how do i keep form data after submitting the form using javascript?
When i submit this form, the values just disappears from the textboxes. I like them to stay printed in the textboxes. How do i do that?
<form id="myform" method="get" action="" onSubmit="hello();">
<input id="hour" type="text" name="hour" style="width:30px; text-align:center;" /> :
<input id="minute" type="text" name="minute" style="width:30px; text-align:center;" />
<br/>
<input type="submit" value="Validate!" />
</form>
<style type="text/css">
.error {
color: red;
font: 10pt verdana;
padding-left: 10px
}
</style>
<script type="text/javascript">
function hello(){
var hour = $("#hour").html();
alert(hour);
}
$(function() {
// validate contact form on keyup and submit
$("#myform").validate({
//set the rules for the fild names
rules: {
hour: {
required: true,
minlength: 1,
maxlength: 2,
range:[0,23]
},
minute: {
required: true,
minlength: 1,
maxlength: 2,
range:[0,60]
},
},
//set messages to appear inline
messages: {
hour: "Please enter a valid hour",
minute: 开发者_JAVA百科"Please enter a valid minute"
}
});
});
</script>
As soon as you submit the page, the data is sent to the server and a new page is loaded. In your case, this is the same page as before but that doesn't make a difference for the browser. To keep the values, you must fill in the values on the server while rendering the page.
Usually, you can simply copy the data from the HTML request parameters into the fields.
When you submit a form, the entire page is replaced with the response from the server. If you want to stay on the page (rather than having it replaced by the response), you might look at using jQuery.post
or jQuery.ajax
to send the form data to the server rather than actually submitting the form.
In the form tag, include onsubmit ="return false"
to avoid form reset.
For example:
<form name = "inputNumbers" onsubmit ="return false">
You can use cookies from JavaScript to keep values in. Basically you access something called document.cookie
.
As an example, to retain the data in a text input:
<input type="text" name="inputText" id="inputText" placeholder="Enter the name of your all-time favorite Duckbilled Platypus" value="@Request["inputText"]" autofocus style="display: inline-block;" />
精彩评论