I have a modal box that has a PHP form on it. When the form is submitted it closes the modal box and redirects back to the page. I want the modal box to stay open if there is an error.
It is ok if modal box closes when it is a successful submission because it redirects to my success url. This is only an issue if there is an error on the form. I am using php to check to see if there is a blank field and using the built in email validator.
Also worth mentioning if there is an error on the form and it closes the modal box if you open it back up you see the errors since it wasn't successfully submitted.
I am using this for my form action
<form action="<?php echo htmlspecialchars($_SERVER['PHP_SELF']); ?>" method="post">
I can post more of the code if necessary.
Is there anything that strikes anyone that could be a simple fix for this?
You can do Client Side (JavaScript/Jquery) validation. Which can be done by using onSubmit='return validateMyForm()' on the form element.
But, its good to have server side validation, so use AJAX for that.
Don't submit your form, use <input type="button"> instead of <input
type="submit">
Submit your form using $.post or $.get or $.ajax, get PHP errors as
return and show errors on the Modal Box
To do this you can use ajax...
Tutorial
I am using php to check to see if there is a blank field and using the built in email validator.
While it's good to perform validation on the server, you should deal with validation on the client side. Use javascript to validate so you don't hit the server and your modal screen won't close.
Related
I'm working on editing an existing PHP form that seems to use Bootstrap to do the field validation (telling me if a required field is missing).
Currently, when you fill out the form and click Submit, a modal pop-up comes up that basically just prints your form data so you can review it before submitting. Then, within that modal is another Submit button that actually submits the form.
However, the validation of determining whether all the required fields are filled out only happens on the 2nd Submit button, not the first.
Is there a way I can tell my 1st Submit button to do the validation, and only open the modal pop-up if the validation passes?
Hello you can use Jquery. You can check with jquery first form values. If you need check with php you can use Ajax.
I spent a few days and got a form working on my website.
However whenever it is submitted, it does not reset and when I reload the browser it sends the form again using the previous submitted data.
How would I stop/prevent this?
I also want to get rid of the leave page warning that pops up when there is any data written in the form. So that users can leave the page without the pop-up even if there is data not submitted.
The form is commented out on this temporarily page: http://rikahiyuka.com/Template%20-%20index.php
(I don't have much time to type this question so I might change it later)
To clear your form on submit, you can add some Javascript to the form element itself, e.g.:
<form onsubmit="this.submit(); this.reset(); return false;">
To prevent the warning on page exit, have you tried:
window.onbeforeunload = null;
Check out the JavaScript onbeforeunload event. It's non-standard JavaScript introduced by Microsoft, however it works in most browsers and their onbeforeunload documentation has more information and examples.
<form action="MAILTO:contact#rikahiyuka.com" method="post" enctype="text/plain">
You cannot POST to a mailto: url. You should have the action set to a PHP page, which sent the email for you. There are many examples for a PHP contact form on the internet.
I am currently submitting a form using form action to a php script and i was going to implement ajax form submission also.
But a thought came to my mind that wouldn't it be nice to know if the client's browser has javascript enabled or disabled and submit the form accordingly as i don't want the no-javascript users to view a page that says "Enable Javascript or something"! as i have used both client and server side validations.
So, how should i know that a client has javascript and let him submit form by ajax and vice versa?
I found many QA's related to redirecting users to a page that says "Javascript disabled" and they mostly talked about tags.
I would appreciate hearing you guys and your suggestions. Thankyou :)
Use a form with a submit button.
In your javascript script put an handler on it, and call the preventDefault function to let your ajax code do the job.
So if javascript is enabled it will submit with ajax. If not it will submit it the default way .
EDIT:
Here is a jsfiddle to illustrate it: http://jsfiddle.net/CTwx2/
Basically the default behavior of a submit button is to send the data to the address indicated in the form tag.
With the handler defined in javascript & jquery, you stop this behavior and send the data by yourself through an ajax request (http://api.jquery.com/event.preventDefault/)
You will have to have 2 versions of your site and redirect accordingly using :
<noscript>
<meta http-equiv="refresh" content="0;url=noscript.html">
</noscript>
OR
Wrap your form in your <noscript> tags, and if javascript is enabled disable that form-
I have a WordPress site with a form that I need to add a captcha to. The form isn't it's own template or even on it's own page but it is a single php file that is included on all of the pages. The actual form is in the shape of a drop down menu. When a user clicks on the "request info" link, the form drops down from the navbar. Do to the way it is set up I can't use a WordPress plugin.
Normally, I could I just add a php captcha script and be done with it but the form action is set to post to an external website. When the visitor submits the form, it goes to another website that collects the info, as you can see here:
<form action="https://www.salesforce.com/servlet/servlet.WebToLead?encoding=UTF-8" method="POST" name="contact" id="contact" onsubmit="return checkform(this);">
Because the form isn't verified with a php file on the sites server, I don't know how to verify the captcha and get it to work. Does anyone have any suggestions?
The only way to do it would be to make an ajax call on submit to your server where you check the captcha code. If the code is valid, then submit the form. If it isn't display the error and don't allow the form to submit.
If you are using Recaptcha, check this SO: using reCAPTCHA with ajax....javascript loading problem
If a general Captcha is what you are doing: jQuery ajax validate captcha
The answers are more focused that what you are looking for, but will at least get you pointed in the right direction.
I have a webpage that contains a form, and i need to refresh the page right before the form is submitted. Is there a way to have the Submit button refresh the current page and then submit the form to the proper php document?
I am using a general form with the submit button looking like
<input name="Submit" value="Submit" type="submit" />
Fix the page - do not pursue making this problem larger than it already is. I think it's some tunnel vision, you've made some mistakes on how you have setup your form or page, and now you are trying to continue down the wrong path instead of correcting your original problem.
Refreshing the page to submit some javascript data and then submit the form etc... is incorrect and needs to be fixed.
Best of luck and happy coding!
You can give the form a target to submit it in a new window and bind an event handler to it that refreshes the page on submit.
Please clarify what exactly you're trying to achieve. If you're trying to get some data from the server that's required to submit the form, it's possible to do (though it's not the best way to handle it). You'll need to intercept form submit, stop the events, perform an AJAX request to the server and then submit the form from code.