Why doesn't JavaScript trigger submit get caught by onsubmit?

I notice that if I trigger a form's submit event with javascript, as below, control goes straight to the action page rather than being cought by the onsubmit event code in the opening form tag.  But if I trigger the submit event with a submit button, control IS caught first by the onsubmit in the opening form tag.  I'm just wondering what's going on here and why triggering submit with JavaScript doesn't get caught by onsubmit.


<form name="sw1" action="managecart.html" id="sw1Info" onsubmit="alert('submitting');">
          <label for="whole"><input type="radio" class="check" id="whole" name="bread" value="Whole Grain Ciabatta Roll"/>Whole Grain Ciabatta Roll </label><br/>
          <label for="white"><input type="radio" class="check" id="white" name="bread" value="White Ciabatta Roll"/>White  Ciabatta Roll</label> <br/>
          <label for="full"><input type="radio" class="check" id="full" name="size" value="Full"/>Full</label><br/>
          <label for="half"><input type="radio" class="check" id="half" name="size" value="Half"/>Half </label><br/>
          <h2>Special Instructions:</h2>
          <textarea name="instructions" cols=40 rows=2></textarea>
           <p><a href="javascript:document.getElementById('sw1Info').submit();">Add to Order</a></p>

Who is Participating?

[Product update] Infrastructure Analysis Tool is now available with Business Accounts.Learn More

I wear a lot of hats...

"The solutions and answers provided on Experts Exchange have been extremely helpful to me over the last few years. I wear a lot of hats - Developer, Database Administrator, Help Desk, etc., so I know a lot of things but not a lot about one thing. Experts Exchange gives me answers from people who do know a lot about one thing, in a easy to use platform." -Todd S.

Ryan ChongBusiness Systems Analyst , ex-Senior Application EngineerCommented:
>>I'm just wondering what's going on here and why triggering submit with JavaScript doesn't get caught by onsubmit.

It's the behaviour of Javascript that it will only trigger the scripts you executed. That means by executed a javascript in hyperlink will not actually trigger the onsubmit event on the form.
onsubmit event of the form will be triggered only when a submit button submits a form.

onsumbit event means when <input type="submit"> is clicked. then only the event will fires. But u've used sumbit(), it'll directly submit the form.

Experts Exchange Solution brought to you by

Your issues matter to us.

Facing a tech roadblock? Get the help and guidance you need from experienced professionals who care. Ask your question anytime, anywhere, with no hassle.

Start your 7-day free trial
Big Business Goals? Which KPIs Will Help You

The most successful MSPs rely on metrics – known as key performance indicators (KPIs) – for making informed decisions that help their businesses thrive, rather than just survive. This eBook provides an overview of the most important KPIs used by top MSPs.

stevaAuthor Commented:

That's the clearest answer so far, so I gave you the points. if you have any references to where this is documented I'd be very interested.

Sorry steva, that is not from any documents. I came to a situation like this, long ago and i confirmed that after a lot of struggling.
Dave BaldwinFixer of ProblemsCommented:
I got curious and did some research on http://www.w3.org/.  <input type="submit"> is part of the HTML <form> definition.  document.getElementById('sw1Info').submit(); is javascript talking to the DOM.  Apparently they are not actually the same thing.

I made up a form from the code above and added a submit button and several more variations of the javascript method.  I also included a text input.  The only things that went thru the form process were the submit button and pressing enter in a text field. Using the javascript with the anchor, <p> text, or an <input type="button" skips directly to the submit process.
stevaAuthor Commented:

Thanks for the extra information.  By the way, one more thing that will trigger the form's onsubmit event before action  is <input type="image" src=...
Dave BaldwinFixer of ProblemsCommented:
<input type="image" src=... is defined in the 'standards' as a submit button.  I had to look that one up recently too.
It's more than this solution.Get answers and train to solve all your tech problems - anytime, anywhere.Try it for free Edge Out The Competitionfor your dream job with proven skills and certifications.Get started today Stand Outas the employee with proven skills.Start learning today for free Move Your Career Forwardwith certification training in the latest technologies.Start your trial today

From novice to tech pro — start learning today.