Jquery validation using ajax
I'm using this plugin https://github.com/posabsolute/jQuery-Validation-Engine for form validation. Sometimes I need some validation for email or username to check if it exists or not.
Base on the tutorial in http://www.position-absolute.com/articles/using-form-ajax-validation-with-the-jquery-validation-engine-plugin/
include this script in the language
"ajaxEmailPhp": { "url": settings.base_url + "home/check_email", // you may want to pass extra data on the ajax call //"extraData": "name=eric", // if you provide an "alertTextOk", it will show as a green prompt when the field validates "alertTextOk": "* silahkan lanjut", "alertText": "* Email sudah terpakai", "alertTextLoad": "* Validasi, Silahkan menunggu" },
And this in your custom js
$("#register_form").validationEngine({ ajaxFormValidation: true, onAjaxFormComplete: ajaxValidationCallback, onValidationComplete: ajaxValidationCallback, onBeforeAjaxFormValidation: beforeCall }); function beforeCall(form, options){ if (console) console.log("Right before the AJAX form validation call"); return true; } // Called once the server replies to the ajax form validation request function ajaxValidationCallback(status, form, json, options){ //if (console) console.log(status); if (status === true) { alert("the form is valid!"); // uncomment these lines to submit the form to form.action // form.validationEngine('detach'); // form.submit(); // or you may use AJAX again to submit the data } }
in view
in php
public function check_email() { $get = $this->input->get(); if (!empty($get)) { $this->load->library('core/student_library'); $check = $this->student_library->get(array('email' => $get['fieldValue'])); $check = (empty($check)) ? true : false; } echo json_encode(array($get['fieldId'],$check)); }
Troubleshoot
Ajax error: 200 parsererror
Fix the output use echo json_encode($array);
How come it doesn't callback and keep on validating
check the output format or check my example