Forums: Front End:

 

Javascript submit() vs <input type=submit" >

first
 

scudsucker 2008.02.15, 10:50AM — Javascript submit() vs <input type=submit" >

OK, I have come across an oddity: 


<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">

<head>

<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />

<title>Test</title>

</head>

<body>

<form id="test" action="sompepage.php" method="post" onsubmit="alert('submitting the form');" >

  <p><a href="#" onclick="document.forms[0].submit();" >click to submit</a></p>

  <p><input type="submit" value="click to submit" /></p>

</form>

</body>

</html>


Why does the <input> element succesfully submit the form, with the form's onsubmit action being called (the alert box appears), but the <a> element's onclick does not call the forms' onsubmit (form is submitted but no alertbox)?


quote
 

Blaise 2008.02.15, 03:21PM —

I can't answer that question.

But, using inline JavaScript isn't very good practice, so perhaps if you are trying to achieve something other than what this example shows, there is another way to go about it using unobtrusive JavaScript methods.

quote
 

DontBogartMe 2008.02.15, 03:35PM —

if I rem rightly, the onsubmit event is only fired when the users clicks on a submit button - it's not fired when you call submit() via code.

quote
 

OvineWorrier 2008.02.15, 03:52PM —

DBM is right. The onsubmit event won't fire when a script submits the form only when a user submits it. If you want this behaviour, set onclick to fire a function which includes the form submission and then shows an alert.

Besides the usual nonsense about inline javascript and unobtrusive magic - I suspect the inline is only for the sake of this example - the main question is... why would you want to attach a form submission function to a link? That's what <input> and <button> are for.

Bleat for me, baby...
quote
 

scudsucker 2008.02.16, 08:01AM —

The inline js is for the purposes of demonstration. I am trying to create a completely unobtrusive js form-validation system - and certainly not using alerts!

I don't see why the onsubmit action of a form is tied to the submit button though. It should be hooked to the form submit, whether by js or by submit button.

The answer to why I would use a link is not mine to give: I merely develop what designers give me.
quote
 

poliguin 2008.02.16, 03:03PM —

i guess the argument would be that the attribute of onsubmit would be triggered by an html element submitting the form, not some other business logic / design ideals that cause a form submittal in another fashion. ie, the w3 specs for attributes on an element are designed for HTML standards and are no way tied into the ECMA standards.

var _oRLY = {HAI:function(){return this.KTHXBYE(); },KTHXBYE:function(){ return this.HAI();},init:function(){ this.HAI()};_oRLY.init()?'YARLY':'NOWAI';
quote
 

OvineWorrier 2008.02.16, 07:17PM —

Originally posted by: scudsucker
The inline js is for the purposes of demonstration. I am trying to create a completely unobtrusive js form-validation system - and certainly not using alerts!

I don't see why the onsubmit action of a form is tied to the submit button though. It should be hooked to the form submit, whether by js or by submit button.

The answer to why I would use a link is not mine to give: I merely develop what designers give me.



Yeah, thought it was just for the example but....

a link shouldn't be used to submit the form, despite what clueless deisgners say big grin

(plus, if it's going to be unobtrusive, and there's no js available on the client, the form won't work)

Style a <button> for the job - it'll keep the designers happy smile

Bleat for me, baby...
quote
 
first
 

Forums: Front End: Javascript submit() vs <input type=submit" >

 
New Post
 
You must be logged in to post