CODEWITHSUNDEEP
javascriptformsonsubmit
Algore87
Algore87

Reputation: 43

submit function does not trigger onsubmit return function?

I think I have a misunderstanding of the onsubmit attribute. I thought that every submission, like a <input type="submit" ...>, <button></button> or any javascript form.submit() trigger the onsubmit="return function();" after the submit. In other words, I will never see the "last triggered" log.

Example:

function triggerFirst() {
  console.log("first triggered");
  myForm.submit();  
}

function triggerLast() {
  console.log("last triggered");
  return true;
}
<form id="myForm" onsubmit="return triggerLast();">
  <input type="button" onclick="triggerFirst();" value="trigger">
</form>

This example will never trigger the onsubmit, why? I thought onsubmit means if someone submits? Is that false?

Upvotes: 1

Views: 815

Answers (3)

Joe Kdw
Joe Kdw

Reputation: 2261

It works.

UPDATED: Place the 2nd function inside first.

function triggerFirst() {
  alert('wow'); 
triggerLast() 
}

function triggerLast() {
alert('wowpsubmit');
  return true;
}
<form id="myForm" onsubmit='return triggerLast();'>
  <input type="button" onclick="triggerFirst();" value="trigger" >
</form>

Upvotes: 2

Rupert
Rupert

Reputation: 1639

In your triggerFirst function the inner function call to submit does nothing. That submit function is not defined. I think here you want to make the function submit so below I passed a reference to the form into the triggerFirst function. This should clarify things for you. Open the console to view the output.

function triggerFirst(form) {
  console.log('triggerFirst')
  console.log(form);
  form.submit();
}

function triggerLast() {
  console.log('triggerLast')
  return true;
}
<form onsubmit="return triggerLast();">
  <input type="button" onclick="triggerFirst(this.form);" value="trigger">
</form>

Upvotes: 0

Matt Butler
Matt Butler

Reputation: 476

An HTML form does not require javascript to work. Refer the code below:

<form action="action_page.php">
  First name:<br>
  <input type="text" name="firstname" value="Mickey"><br>
  Last name:<br>
  <input type="text" name="lastname" value="Mouse"><br><br>
  <input type="submit" value="Submit">
</form>

The <form action="action_page.php"> declaration is run once the form is submitted.

The <input type="submit" value="Submit"> is a built in type that triggers the form action to run.

See more here

Upvotes: 0

Related Questions