Jquery success message shows even if php form is not validated -
i have php mail form. if email address not validate, jquery updates emailform div success message. want success message appear if form submitted (post).
jquery:
$('#submit').submit(function() { // catch form's submit event $.ajax({ // create ajax call... data: $(this).serialize(), // form data type: $(this).attr('method'), // or post url: $(this).attr('action'), // file call success: function(response) { // on success.. console.log(response); if(response != 'error; need submit form!'){ $('#emailform').html("<h2 style='text-align:center;'>thank you!</h2><hr><p style='text-align:center;'>thank submitting purchase information.<br>we send free gifts soon!</p>"); // update div } } }); return false; // cancel original event prevent form submitting }); php:
<?php ini_set('display_errors',1); error_reporting(e_all); if(!isset($_post['submit'])) { //this page should not accessed directly. need submit form. echo "error; need submit form!"; } $name = $_post['name']; $email = $_post['email']; $purchasecode = $_post['purchasecode']; $vendor = $_post['vendor']; //validate first if(empty($_post['name']) || empty($_post['email']) || empty($_post['purchasecode']) || empty($_post['vendor'])) { echo "all fields required."; exit; } if(isinjected($email)) { echo "bad email value!"; exit(); } $email_from = $email; $email_subject = "gdfy purchase confirmation"; $email_body = "new purchase confirmation $name.\n". "here details:\n\n name: $name \n\n email: $email \n\n purchase code: $purchasecode \n\n vendor: $vendor"; $to = "idc615@gmail.com";//<== update email address $headers = "from: $email_from \r\n"; $headers .= "reply-to: $email_from \r\n"; //send email! mail($to,$email_subject,$email_body,$headers); //done. redirect thank-you page. header('location: index.html'); // echo "success"; // function validate against email injection attempts function isinjected($str) { $injections = array('(\n+)', '(\r+)', '(\t+)', '(%0a+)', '(%0d+)', '(%08+)', '(%09+)' ); $inject = join('|', $injections); $inject = "/$inject/i"; if(preg_match($inject,$str)) { return true; } else { return false; } } ?>
ok, have going work you, need first download 2 files, got js/demo/tutorial from.
source: http://webdesign.torn.be/tutorials/javascript/prototype/forms-with-prototype/
1) http://webdesign.torn.be/tutorials/assets/images/loading_indicator.gif
2) http://webdesign.torn.be/tutorials/assets/js/prototype.js
plus this:
<button type="submit" name="submit" id="submitbutton" value="submit" class="mainbutton">submit</button> should use instead:
<input type="submit" name="submit" id="submitbutton" value="submit" class="mainbutton"> jquery conflict
if must use jquery, try following:
<script src="prototype.js"></script> <script src="jquery.js"></script> <script> jquery.noconflict(); or
<script src="prototype.js"></script> <script src="jquery.js"></script> <script> // give $ prototype.js; create new alias jquery. var $jq = jquery.noconflict(); </script> html form (tested)
<!doctype html> <head> <script type="text/javascript" src="prototype.js"></script> <script type="text/javascript"> // <![cdata[ document.observe('dom:loaded', function() { function sendform(event){ // stop default submit behaviour event.stop(event); var ooptions = { method: "post", parameters: form.serialize("contactform"), asynchronous: true, onfailure: function (oxhr) { $('feedback').update(oxhr.statustext); }, onloading: function (oxhr) { $('feedback').update('sending data ... <img src="loading_indicator.gif" title="loading..." alt="loading..." border="0" />'); }, onsuccess: function(oxhr) { $('feedback').update(oxhr.responsetext); } }; var orequest = new ajax.updater({success: ooptions.onsuccess.bindaseventlistener(ooptions)}, "mail_form.php", ooptions); } event.observe('submitbutton', 'click', sendform, false); }); // ]]> </script> </head> <body> <div id="feedback"> </div> <div id="contact"> <h2>confirm purchase information</h2> <hr> <form method="post" id="contactform" name="contactform" action=""> <p> <label for='name'>your name:</label> <br> <input type="text" name="name"> </p> <p> <label for='email'>email address:</label> <br> <input type="text" name="email"> </p> <p> <label for='purchasecode'>purchase code:</label> <br> <input type="text" name="purchasecode"> </p> <p> <label for='vendor'>vendor name:</label> <br> <select name="vendor"> <option value="1" selected="selected"></option> <option value="2" >amazon</option> <option value="3" >barnes & noble</option> <option value="4" >family christian</option> <option value="5" >christianbook.com</option> <option value="6" >lifeway</option> <option value="7" >books-a-million</option> <option value="8" >mardel</option> </select> </p> <input type="submit" name="submit" id="submitbutton" value="submit" class="mainbutton"><br> </form> </div> </body> </html> php handler (mail_form.php) edited
note: change $to = "email@example.com"; email address
<?php ini_set('display_errors',1); error_reporting(e_all); if(!isset($_post['submit'])) { //this page should not accessed directly. need submit form. echo "error, need submit form!"; } $name = $_post['name']; $email = $_post['email']; $purchasecode = $_post['purchasecode']; $vendor = $_post['vendor']; if (!filter_var($email, filter_validate_email)) { die("the email <b>$email</b> entered, not valid."); exit; } //validate first if(empty($_post['name']) || empty($_post['email']) || empty($_post['purchasecode']) || empty($_post['vendor'])) { echo "all fields required."; exit; } if(isinjected($email)) { echo "bad email value!"; exit(); } $email_from = $email; $email_subject = "gdfy purchase confirmation"; $email_body = "new purchase confirmation $name.\n". "here details:\n\n name: $name \n\n email: $email \n\n purchase code: $purchasecode \n\n vendor: $vendor"; $to = "email@example.com"; //<== update email address $headers = "from: $email_from \r\n"; $headers .= "reply-to: $email_from \r\n"; //send email! mail($to,$email_subject,$email_body,$headers); //done. redirect thank-you page. // header('location: index.html'); echo "success"; // function validate against email injection attempts function isinjected($str) { $injections = array('(\n+)', '(\r+)', '(\t+)', '(%0a+)', '(%0d+)', '(%08+)', '(%09+)' ); $inject = join('|', $injections); $inject = "/$inject/i"; if(preg_match($inject,$str)) { return true; } else { return false; } } ?>
Comments
Post a Comment