Celebrate National IT Professionals Day with 3 months of free Premium Membership. Use Code ITDAY17

x
?
Solved

onSubmit Event while using document.form.submit()

Posted on 2004-10-11
17
Medium Priority
?
4,805 Views
Last Modified: 2012-05-05
Hi Everybody!

I have a problem concerning the onSubmit event inside forms. when i have a submit button or image (<input type="submit"> or <input type="image">) the event is called. when i use a hyperlink (<a href="javascript:document.testform.submit()"...>) the form is being submitted, but the event is not called.

Working Code (reduced):

<form name="testform" method="POST" action="test.php" onsubmit="return chkForm();">
<input type="submit" value="abschicken">
</form>

not working code (reduced):

<form name="testform" method="POST" action="test.php" onsubmit="return chkForm();">
<a href="javascript:document.testform.submit();" >send</a>
</form>

Any Ideas how i can send the form with a hyperlink WITH onSubmit event being raised?

Any Help would be greatly appreciated.
Thx in advance.

Kind Regards.
Alex Hepp
0
Comment
Question by:heppa
[X]
Welcome to Experts Exchange

Add your voice to the tech community where 5M+ people just like you are talking about what matters.

  • Help others & share knowledge
  • Earn cash & points
  • Learn & ask questions
  • 7
  • 5
  • 3
  • +2
17 Comments
 
LVL 13

Expert Comment

by:cLFlaVA
ID: 12278406

Two methods to try:

<a href="document.testform.submit(); return false;" >send</a>

And:

<a href="#" onclick="document.testform.submit(); return false;" >send</a>
0
 
LVL 63

Accepted Solution

by:
Zvonko earned 300 total points
ID: 12278419
Like this:

<form name="testform" method="POST" action="test.php" onsubmit="return chkForm();">
<input type="submit" value="abschicken" name="Submit" style="display:none">
</form>
<a href="javascript:document.testform.Submit.click();" >send</a>


0
 
LVL 4

Author Comment

by:heppa
ID: 12278500
Thank you for your efforts...

cLFlaVA, your versions don´t work either. The first one does nothing because of the return false; and the second one also submits the form, but the event onsubmit is not being raised.

Zvonko: Your approach does work, but is that really the only workaround to get this to work? I don´t really like such "hidden features" ;) but thank you very much. At least a workaround;) Will accept your answer later, after one or two days. Perhaps there is a more standardlike way...

Thank you!
0
What does it mean to be "Always On"?

Is your cloud always on? With an Always On cloud you won't have to worry about downtime for maintenance or software application code updates, ensuring that your bottom line isn't affected.

 
LVL 13

Expert Comment

by:cLFlaVA
ID: 12278563
Do take into account that Zvonko is at the top of the list in the JavaScript hall of fame, as well as being the featured JavaScript expert.  I think your answer lies in safe hands.
0
 
LVL 63

Expert Comment

by:Zvonko
ID: 12278577
Is this method more "standard"  to you:

<a href="#" onClick="f=document.testform;if(f.onsubmit())f.submit();return false;" >send</a>

0
 
LVL 4

Author Comment

by:heppa
ID: 12278598
I know that, and i really appreciate it very much. Perhaps my comment was a bit lacking the respect, the workaround deserves. It´s great!!!
But nevertheless it is a workaround, and i think there´s a kind of bug in javascript. When i call the method submit, it should be the same as clicking a submit button. or am i wrong?

Kind Regards.
0
 
LVL 63

Expert Comment

by:Zvonko
ID: 12278613
cLFlaVA, do you really believe I know everything?
This still experts Exchange where I do learn every day.
0
 
LVL 4

Author Comment

by:heppa
ID: 12278620
At Zvonko:

;)

Nope, you´re right. I hope, you do not misunderstand my words... The thing about workaround is more going towards javascript then you... i excuse for my too short comment.

Kind regards.
0
 
LVL 63

Expert Comment

by:Zvonko
ID: 12278632
heppa, in my last hyperlink you see that there is a difference betwean forms onsubmit() event handler and forms submit() method.
0
 
LVL 13

Expert Comment

by:cLFlaVA
ID: 12278639
all i was doing was expressing my confidence in the answer.  i do not really believe you know everything :)
0
 
LVL 63

Expert Comment

by:Zvonko
ID: 12278683
Sorry cLFlaVA, but I react to such compares because when I started in this topic area I was asked to be more respectful to "honored" experts comments. I was not too respectful, so I hope you are also not too respectful ;-)
0
 
LVL 4

Author Comment

by:heppa
ID: 12278692
ok, i see. But in my eyes, calling the method submit(), i want the form to be submitted. And when the form is being submitted, the event onSubmit should be raised...

Perhaps only my special meaning, and totally off the green, but i know it now, and i know, that i can´t change javascripts behaviour, so i will accept it, and work with it.

Thank you very much for making that clear...

I did not only put confidence in the answer, i checked it out, but you must agree, that a hidden submit button, and a link, that simulates a click on this button, is a workaround, even when it is a really great one, that i would have never discovered.

Thanks
0
 
LVL 15

Expert Comment

by:Thogek
ID: 12278997
heppa,
Did you try Zvonko's latter suggestion?  It takes into account the fact that [1] programmatic calls to a form's submit() method do bypass the onsubmit event (yes, this is normal and expected, although I don't know what the reasoning behind it is), and [2] you can generally call the form's onsubmit code yourself as though onsubmit were simply another method of the form object.
0
 
LVL 63

Expert Comment

by:Zvonko
ID: 12281376
I think you see the solution, but only to go for sure, in the last hyperlink you do not need the hidden submit button.
Of course you are true, and also I have expected the onSubmit event to be fired when form is submitted.
But see it like this: when you have a form field with an onChange event is that event also not fired when field value is set by script.

That's the way how it works and we have to live with it.
0
 
LVL 3

Expert Comment

by:hemebond
ID: 12283179
So, why exactly do you need to use a hyperlink?
0
 
LVL 4

Author Comment

by:heppa
ID: 12284328
because design is hyperlink, not button, simple as that...

@Zvonko: You are right, we have to live with it. but i would say, that the onchange event should also be fired, when value is changed by script... nevertheless, i think, this is being discussed enough.

Thank you for your help
0
 
LVL 63

Expert Comment

by:Zvonko
ID: 12284720
You are welcome.
0

Featured Post

[Webinar] How Hackers Steal Your Credentials

Do You Know How Hackers Steal Your Credentials? Join us and Skyport Systems to learn how hackers steal your credentials and why Active Directory must be secure to stop them.

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

Introduction HTML checkboxes provide the perfect way for a web developer to receive client input when the client's options might be none, one or many.  But the PHP code for processing the checkboxes can be confusing at first.  What if a checkbox is…
Nothing in an HTTP request can be trusted, including HTTP headers and form data.  A form token is a tool that can be used to guard against request forgeries (CSRF).  This article shows an improved approach to form tokens, making it more difficult to…
The viewer will learn the basics of jQuery, including how to invoke it on a web page. Reference your jQuery libraries: (CODE) Include your new external js/jQuery file: (CODE) Write your first lines of code to setup your site for jQuery.: (CODE)
The viewer will learn the basics of jQuery including how to code hide show and toggles. Reference your jQuery libraries: (CODE) Include your new external js/jQuery file: (CODE) Write your first lines of code to setup your site for jQuery…

730 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question