JQuery : Submit event not firing on FireFox

Question

I can't understand why the submit event described below is not firing on FireFox and IE. Ok for Chrome

 $("#frame-right").on("submit", "form", function(event){ alert('Submit done') }); 

Can you help me?

EDIT

The forms are submitting by pressing a "submit" button, but the forms are included in page loaded through .load() function and not exist when the function above is defined.

FYI, at the same place, I defined this function which is working fine on all browser

$("#frame-right").on("click","a",function(event){
alert('link clicked');
}

Is the "submit" event can be bound dynamically like "click" event?

EDIT 2

Thanks for your reply. The problem is that after a load() function, the form loaded cannot be submitted with Firefox

Answer 1

My mistake...

After long tests, I have discovered that a form must be declared inside a table element ou outside the table...

This exemple doesn't work :

<table>
  <form>
    <tr><td><button type="submit">Submit</button></td></tr>
  </form>
</table>

This exemple works :

<form>
  <table>    
    <tr><td><button type="submit">Submit</button></td></tr>
  </table>
</form>

Answer 2

so you should attach that listener in the callback for your load function to make sure it gets attached after the forms have been loaded in.

so for example:

$('#result').load('ajax/test.html', function() {


    $("#frame-right").on("submit", "form", function(event){                  
        alert('Submit done')
    });


});

Answer 3

This should work for you. Make sure you are preventing the default submit behaviour when doing the ajax stuff.

$(function(){
  $(document).on("submit", "form", function(event){   
      event.preventDefault() ;  // prevent dfaul submit behaviour
      alert("submitting")
  });
});