I have a form that emails a users email to me, theres a form that goes to a .php file that sends the email, and upon success it does: window.history.back();. Which works fine, it goes right back to where they were. EXCEPT the information that they typed into the form is still there. How can I have that input be erased when the page loads, or maybe erased right after the user submits the form so that it will be empty when they go back?
I found a few topics about doing this but they all used jQuery, so this question is asking if this can be done WITHOUT jQuery.
I have a form that emails a users email to me, theres a form that goes to a .php file that sends the email, and upon success it does: window.history.back();. Which works fine, it goes right back to where they were. EXCEPT the information that they typed into the form is still there. How can I have that input be erased when the page loads, or maybe erased right after the user submits the form so that it will be empty when they go back?
I found a few topics about doing this but they all used jQuery, so this question is asking if this can be done WITHOUT jQuery.
Share Improve this question asked Sep 29, 2013 at 19:42 Josh GraefJosh Graef 572 silver badges12 bronze badges 3- To this date I believed jQuery used javascript. – planestepper Commented Sep 29, 2013 at 19:43
- I am not sure i am following you. What exactly are u doing to do cause it seems to me that doing window.history.back(); from the PHP script it's not the way to go. – kbariotis Commented Sep 29, 2013 at 19:45
- If you go back and all that, why don't you use ajax instead. – Daniel Commented Sep 29, 2013 at 19:47
2 Answers
Reset to default 2We can use plain JavaScript to just empty the values. An example of resetting an <input> on an everyday form will go something like this:
var input = document.getElementById('my-input');
input.value = '';
As seen in this fiddle;
If you want to reset the value of the all the input fields. Then, this can be a solution:
<!DOCTYPE html>
<html>
<head>
<script type="text/javascript">
function resetValues()
{
var x=document.getElementsByTagName("input");
for(i = 0; i<=x.length-1; i++)//x.length-1 i don't want to reset the value of the last button
{
if(x.item(i).type!="button")
x.item(i).value = "";
}
}
</script>
</head>
<body onload="resetValues()">
<input type="text" id="name"><br>
<input type="text" id="address"><br>
<input type="text" id="country"><br><br>
<input type="button" onclick="resetValues()" value="Reset values">
</body>
</html>
Or if you wan to reset some particular input fields. Try this:
//In you resetValues() function, replace the code with this
var x = document.getElementById("name");//your input element id
var y = document.getElementById("address");//your input element id
var z = document.getElementById("country");//your input element id
x.value = "";
y.value = x. value;
z.value = y.value;
Hope, this works fine for you.