Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

when form submit ,the order of click function and submit

about click and submit example below:

<form action="url" method="post">
<input type="text" id="input1"/>
<input type="submit" value="submit" onclick="testFun()"/>
</form>

if it is possible that function testFun run after the form's submit when we click the button to submit

if the answser is no. why? how does the browser work when click the submit button?? the order is click function-> submit ? is right??

like image 550
SKing7 Avatar asked Jun 19 '12 09:06

SKing7


People also ask

Which event occurs when the submit button is clicked in a form?

The submit event fires when the user clicks a submit button ( <button> or <input type="submit">) or presses Enter while editing a field (e.g. <input type="text">) in a form. The event is not sent to the form when calling the form.

When we click submit button data sent?

The form will be submitted to the server and the browser will redirect away to the current address of the browser and append as query string parameters the values of the input fields.

What happens when the user clicks on the submit button?

5. Most HTML forms have a submit button at the bottom of the form. Once all of the fields in the form have been filled in, the user clicks on the submit button to record the form data. The standard behaviour is to gather all of the data that were entered into the form and send it to another program to be processed.

What is difference between OnClick and submit?

OnSubmit is used on a form , and indicates that the information is to be submitted to the server at this point unless you return false. OnClick is used on anything, and indicates that it was clicked, offering no other context to the intention of the event at all.


2 Answers

No you cannot execute a function after the form has been submitted - the order of which things are executed is as follows :

  • User clicks the submit button
  • The onclick function is executed
  • The browser submits the page to the url specified in the action of the form

You can prevent the browser submitting the page by returning false from the onclick handler :

function myfunc() {
  // do some stuff
  return false;
}

the submit button should then be modified like this :

<input type="submit" onclick="return myfunc()"/>

If you do wish to execute a function after the form has been submitted you need to submit the form using AJAX - this doesnt cause the browser to navigate away from the page and a JavaScript function can be executed after the form has been submitted

like image 87
Manse Avatar answered Oct 11 '22 03:10

Manse


This is not possible because the form's action would redirect the browser to that URL.

1 option would be to run testFun() on your action url page, but this might not be possible depending on what the function does.

If you are to post more information about what you are actually trying to do here, then it might help.

like image 32
Curtis Avatar answered Oct 11 '22 02:10

Curtis