Develop Reference

submit() method does not work when call in input file changed [duplicate]

I have a form like below:
<form action="/action_page.php" onsubmit="alert('The form was submitted');" >
Enter name: <input type="text" name="fname">
<input type="button" onclick="document.getElementsByTagName('form')[0].submit()" value="Submit">
</form>
Though I clicked the button and indeed it submitted the form, but the alert box wasn't shown. That is, the submit() method submitted the form but without triggering the onsubmit event. What happened? And how should I use submit() method to trigger the onsubmit event?

Well, the documentation for the submit method is pretty clear that it doesn't trigger onsubmit.
Since any of the following form elements cause a form submit:
<input type='submit'>
<input type='button'>
<button>
You likely don't need an onclick handler on that button at all

it seems that you can't, please check this post - https://stackoverflow.com/a/19847255/8449863
however, please try workaround with hidden submit button:
<form action="/action_page.php" onsubmit="alert('The form was submitted');" >
Enter name: <input type="text" name="fname">
<input type="button" value="Submit" onclick="document.getElementById('submit').click();" >
<input id="submit" type="submit" style="display: none;" />
</form>

how to make reset button on Metro UI bootstrap?

i have some problem on my php code..
<form id="form1" method="post" action="proses.php">
<div class="input-control text area">
<textarea name="ipt1" type="textarea"><?php echo $data['data'];?></textarea>
</div>
<input name="submit-btn" type="submit" value="Submit"/>
<input name="clear-btn" type="reset" value="Clear" onclick="document.getElementById('form1').clear();"/>
</form>
the result is nothing happened when i click the "Clear" button, and "ipt" field is not cleared,
i need to help, if anyone know, please tell me.

The type='reset' button will reset all form values, but your problem is you have some default values coming from PHP. You can do the following:
<input name="clear-btn" type="reset" value="Clear" onclick="document.getElementsByName('ipt1')[0].innerHTML=''"/>
innerHTML here is used to access the content inside textarea.
DEMO

Resetting textbox in javascript

I'm working on a project for school and I'm stuck on how to reset all the textboxs on the page. This is what my reset button looks like:
<form name="Reset">
<input type="button" value="New ordering sheet." onClick="Reset()">
</form>
I don't know what to do for the function, I have no code for the Reset() function:
function Reset() {}

Have a look at the following questions, there are a few ways of doing it in them:
How to clear all textboxs in a DIV using jQuery?
JQuery how to clear all the input:textfields of a .class on a form. Not working for me

i think this can help!! just have a 'reset' input inside your form :-)
<form name="myform" action="http://something" method="POST">
<input type="text" size="25" value="Enter your name here!">
<input type="submit" value="Send me your name!">
<input type="reset" value="Reset!">
</form>

How to clear the spring form fields using jQuery?

When I click the 'CLEAR' button, I want the javascipt code to run. It does run but then the form gets submitted. Is there a way to stop the form from getting submitted? Or is there a spring standard to clear the form. I just thought it would be faster if I did it on the client-side.
<input type="submit" value="CLEAR" onclick="javascript:clearForm()"/>
The above code appears inside the spring form tag.

Two options.
1). Using input type="button":
<input type="button" value="CLEAR" onclick="clearForm()"/>
2). Using input type="reset" instead of clearing the form with javascript.
<input type="reset" value="CLEAR" />

Change
<input type="submit"
to:
<input type="button"
That will stop your form being submitted when the button is clicked.

html button v.s. html submit?

I have an input text box and a search submit button, and when user clicks the Search submit button, I want to redirect user to url http://testsearch/results.aspx?k=<value of text box k>, for example, if user put "StackOverflow" into text box and then clicks the search button, I want to redirect user to the following page,
http://testsearch/results.aspx?k=StackOverflow
I find when I use button for Search button, it works (see below source codes),
<input type="text" id="k" name="k" />
<input type="button" id="Go" value="Search" onclick="location.href = 'http://somemachine/Search/results.aspx?k='+document.getElementById('k').value;"/>
but when I use submit for Search button, it does not works (see below source codes), why?
<input type="text" id="k" name="k" />
<input type="submit" id="Go" value="Search" onclick="location.href = 'http://somemachine/Search/results.aspx?k='+document.getElementById('k').value;"/>
thanks in advance,
George

You can even use the submit button this way:
<input type="submit" id="Go" value="Search" onclick="document.location='http://testsearch/results.aspx?k=StackOverflow'; return false;" />
Semantically submit button is used to submit forms not redirect pages. You should use normal button type for this. However as i showed you can use the submit button too but that is not semantic i think.
The below line prevents the form from being submitted.
return false;
That is what you are missing in your code :)
Thanks

<button>-elements and <input type="button"/> don't do anything by default, unless you tell them to do something with Javascript.
<input type="submit"/> will submit the form it is in.
So, if <input type="submit"/> won't work, you got it probably not in the <form/>-element itself.

If that's the only field in your form, simply set the form's method to "get" and it'll work.
<html>
<body>
<form action="http://localhost/mytest" method="get" >
<input type="text" id="k" name="k" />
<input type="submit" id="Go" value="Search" />
</form>
</body>
</html>

<button> means "put a button in the page and do whatever the onclick event says". So if you don't write an onclick handler the page doesn't do nothing.
If you use submit is ok, because you want to redirect to another page.
If you want to use button anyway you can do this way:
<script>
function doTheSearch() {
// do the submit mannually
document.getElementById('myForm').submit();
}
</script>
<form id="myForm" action="results.aspx">
<input type="text" id="k" name="k" />
<input type="button" id="Go" value="Search" onclick="doTheSearch();" />
</form>
Warning: submit button with onclick
If you have a submit button (inside a form, it is, a working submit button) with an onclick event, some browsers will:
1) execute onclick
2) execute submit
your onclick tries to redirect but the submit button wins.
If you want to avoid it you have some options:
a) change submit button to normal button
b) avoid the submit thing (add onsubmit="return false;" to form element)
c) use the submit procedure (form action="..." method="get", no onclick event), the browser will be happy and you can control the submit in the onsubmit event (you can cancel it or not).

make sure you got the input's in a form tag with a GET method:
<form action='http://testsearch/results.aspx' method='GET'>
... inputs
</form>

If I'm understanding correctly, it is not working because it is not in a form tag. If you put it in a form tag with method="get" it should work. The button works because it does not have to be in a form.