javascript - How do I validate my form within PHP via JQuery Ajax call? -
javascript - How do I validate my form within PHP via JQuery Ajax call? -
how validate code in php without getting error messages defined in ajax definition in main.js?
note: chrome console returning: xmlhttprequest cannot load file:///c:/documents/mini%20revision%20projects/project%20website%203/ajax.php. received invalid response. origin 'null' hence not allowed access.
below code:
main.html
<!doctype html> <html> <head> <script type="text/javascript" src="c:\documents\jquery\jquery2.js"></script> </head> <body> <ul id="info1"> <li>put in field below.</li> </ul> <form id="form1"> <input type="text" name="field1" id="field1"> <input type="submit" name="submit" id="submit" value="submit form"> </form> <script type="text/javascript" src="main.js"></script> </body> </html> main.js
$(document).ready(function() { $("#form1").submit(function( event ) { event.preventdefault(); //alert("happy"); $.ajax({ type: 'post', url: 'ajax.php', data: $(this).serialize(), datatype: 'json', success: function (data) { console.log(data); $("#info1").html(data.msg); }, error: function (xmlhttprequest, textstatus, errorthrown) { alert("status: " + textstatus); alert("error: " + errorthrown); } }); }); }); ajax.php
<?php class ajaxvalidate { function formvalidate() { //put form elements post variables (this sanitize data) $field1 = @$_post['field1']; //establish values returned via ajax $return = array(); $return['msg'] = ''; $return['error'] = false; //begin form validation functionality if (!isset($field1) || empty($field1)){ $return['error'] = true; $return['msg'] .= '<li>error: field1 empty.</li>'; } //begin form success functionality if ($return['error'] === false){ $return['msg'] = '<li>success message</li>'; } //return json encoded results homecoming json_encode($return); } } $ajaxvalidate = new ajaxvalidate; echo $ajaxvalidate->formvalidate(); ?>
you need have php server in order php scripts work. install xampp (windows) or mamp (linux)
javascript php jquery ajax
Comments
Post a Comment