在jQuery验证表单后，它会卡住并继续提交

Question

I have a registration page that uses de JQuery Validation plugin in a website that uses CakePHP framework. The code for submitting with validation looks like this:

$("#ClienteRegistroForm").submit(function(event){
       event.preventDefault();

       console.log("try submit");           

       if($(this).valid())
       {
           $(this).submit();
           console.log("submitting form");

       }

   });

The submit button in the page sends the data to a PHP file as a POST. The problem I'm having is that when it validates, and processes the line:

$(this).submit()

It continues to submit the form multiple times and gets stuck. The console log shows this behaviour, the following is what the console print looks like:

The page stays frozen on the act, the php script never executes. The script should only be used to validate the form and let it submit and send the POST data to the php file.

Any ideas as to why is this happening? Even though I include the

event.preventDefault()

Answer 1

You're doing a submit() inside a submit(), making the function recursive. Try make the initial event handler on #ClienteRegistroForm a click() on the submit button itself. Something like

$("#ClienteRegistroForm input[type='submit']").click(function(event){
  // code here
})