Should jQuery s form submit not trigger onSubmit within the form tag

Question

I have the following    lt script type  text javascript  gt  function CancelFormButton button          button form  submit       lt  script gt    lt form onsubmit  alert  here     gt   lt input type  button  value  Cancel  onClick  CancelFormButton this      gt   lt  form gt    When I click the  Cancel  button  the onsubmit from the form tag is not triggered   This line instead submits the form successfully    button form  submit    but skips the alert  here    within the onsubmit in the form tag   Is this correct or am I doing something wrong   By the way  in this case  I want this functionality  but I m just wondering if I m going to run into a problem in a browser where the onsubmit is triggered

User · Answer

Try to trigger   event in your function      form   trigger  submit       and then    do submit

User · Answer

I suppose it s reasonable to want this behavior in some cases  but I would argue that code not triggering a form submission should  always  be the default behavior  Suppose you want to catch a form s submission with      form   submit function e       e preventDefault          and then do some validation on the input  If code could trigger submit handlers  you could never include     form   submit     inside this handler because it would result in an infinite loop  the SAME handler would be called  prevent the submission  validate  and resubmit   You need to be able to manually submit a form inside a submit handler without triggering the same handler   I realize this doesn t ANSWER the question directly  but there are lots of other answers on this page about how this functionality can be hacked  and I felt that this needed to be pointed out  and it s too long for a comment

User · Answer

Sorry  misunderstood your question  According to Javascript - capturing onsubmit when calling form submit     I was recently asked   quot Why doesn t the form onsubmit event get fired when I submit my form using javascript  quot  The answer  Current browsers do not adhere to this part of the html specification   The event only fires when it is activated by a user - and does not fire when activated by code    emphasis added   Note   quot activated by a user quot  also includes hitting submit buttons  probably including default submit behaviour from the enter key but I haven t tried this    Nor  I believe  does it get triggered if you  with code  click a submit button

User · Answer

I found this question serval years ago   recently I tried to  rewrite  the submit method  below is my code  window onload  function     for var i  0 i lt document forms length i          function  p           var form  document forms i           var originFn  form submit          form submit function                   do something you like             alert  submitting   form id   using submit method                  originFn                      form onsubmit  function                 alert  submitting   form id   with onsubmit event                       i             lt form method  get  action    id  form1  gt   lt input type  submit  value    form1    gt   lt input type  button  name    id    value  button    1  onclick  document forms 0  submit       gt  lt  form gt    It did in IE but failed in other browsers for the same reason as  cletus

User · Answer

The easiest solution to workaround this is to create  temporary  input with type submit and trigger click   var submitInput       lt input type  submit    gt         aspnetForm   append submitInput   submitInput trigger  click

User · Answer

This work around will fix the issue found by  Cletus   function submitForm form          get the form element s document to create the input control with        this way will work across windows in IE8      var button   form ownerDocument createElement  input          make sure it can t be seen disrupts layout  even momentarily      button style display    none         make it such that it will invoke submit if clicked     button type    submit         append it and click it     form appendChild button  click          if it was prevented  make sure we don t get a build up of buttons     form removeChild button       Will work on all modern browsers Will work across tabs spawned child windows  yes  even in IE lt 9  And is in vanilla   Just pass it a DOM reference to a form element and it ll make sure all the attached listeners  the onsubmit  and  if its not prevented by then  finally  submit the form

User · Answer

My simple solution      form   children  input type  submit     click      It is work for me

User · Answer

Instead of      form   submit    try this       lt input type  submit  id  btn tmpSubmit   gt    css  display   none   appendTo  form         btn tmpSubmit   click

User · Answer

trigger  submit   does not work beacuse onSubmit method does not get fired  the following code works for me  call onSubmit method when using this code        form   find   submit   click

[jquery] Should jQuery's $(form).submit(); not trigger onSubmit within the form tag?

Examples related to jquery

Examples related to onsubmit