javascript - Debugging an ajax call after submitting form

Question

I have a form developed automatically by some php framework. I want to add a custom validation for form inputs and prevent submitting the form if the validation fails.

To do this, I wrote the following script:

$("form.pods-form-pod-katilimci").submit(function(event){
    telefon = $("form.pods-form-pod-katilimci #pods-form-ui-pods-field-oncelikli-telefon");
    email = $("form.pods-form-pod-katilimci #pods-form-ui-pods-field-email");
    if( $.trim(telefon.val()).length == 0 && $.trim(email.val()).length == 0) {
        alert("Size ulaşabilmemiz için eposta adresi veya telefon numaranızdan birisini mutlaka doldurmalısınız.");
        event.preventDefault();
        return false;
    }
});

It works properly. There is no problem. But submitting the form triggers an automatic ajax call and that call bypasses my validation.

Therefore, preventDefault() can not prevent submitting the form.

I want to find out which javascript function causes this behaviour using Firebug. I looked at the html source of the form but there is no clear sign of a function triggered by submit evend. Since this is an ajax call, I cannot figure out which function is called after form submitting by using "Break on Next" in Firebug.

The form is on this page: http://www.aep.gov.tr/kullanici-islemleri/uyelik-bilgileri/

How can I find out which javascript function is triggered after form submitting.

Answer 1

您可以尝试使用 jquery 验证插件：

http://bassistance.de/jquery-plugins/jquery-plugin-validation/

$('#yourformId').validate({
  rules:{
     telefon:{
         required:true
     },
     email:{
         required:true
     }
  }
});

然后使用 ajax-form 插件： http: //malsup.com/jquery/form/

而这段代码：

$('#yourformId').ajaxForm({
   succes:function(response){
      (your code needed for another ajax call)
   }
});