php - How can I display form validation messages on the same page as the form itself? -
i have simple html form single field submits download.php validates form , sends me email user input. far, works great - error messages , thank message display inside original html form, not on new page (as happening now).
can tell me how keep myform.html visible after submit button clicked, , load error , thank messages inside "notification" div?
btw, in case it's relevant, myform.html dynamically displayed inside on index.html using jquery .load().
thanks help!
myform.html
<html> <head>...</head> <body> <div id="notification"></div> <!-- want load errors , thank you, here --> <form id="downloadform" method="post" action="_php/download.php"> <label for="biz_email">business email:</label><input type="text" name="biz_email"> <div id="submit" class="submit_button"></div> <!-- fyi submit function called in separate jquery file --> </form> </body> </html> download.php
<?php if(isset($_post['biz_email'])) { $email_to = "foo@bar.com"; //my email $email_subject = "form submission"; $email_from ="form test"; $biz_email = $_post['biz_email']; $error_message = ""; // validation ... //error code function died($error) { echo "there errors in submission:<br /><br />"; echo $error."<br /><br />"; echo "please go , fix these errors.<br /><br />"; die(); } //email message (sent me) $email_message = "form details below.\n\n"; function clean_string($string) { $bad = array("content-type","bcc:","to:","cc:","href"); return str_replace($bad,"",$string); } $email_message .= "email: ".clean_string($biz_email)."\n"; // create email headers $headers = 'from: '.$biz_email."\r\n". 'reply-to: '.$biz_email."\r\n" . 'x-mailer: php/' . phpversion(); @mail($email_to, $email_subject, $email_message, $headers); ?> <!-- thank message --> success! <?php } ?>
you can use following post form ajax:
$('#downloadform').submit(function (e) { e.preventdefault(); // don't let form submitted normal way $.post("download.php", $('#downloadform').serializearray()).then(function (data) { $('notification').html(data); }, function (error) { $('notification').html("network error submitting form - please try again"); }); }); there's lot of improvements can made this, it's enough started.
Comments
Post a Comment