How to save form data after form submission using javascript?

Question

When I submit this form, the values ​​just disappear from the text fields. I like them to print in text boxes. How to do it?

<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: "Please enter a valid minute"
            }
        });


    });
    </script>

Answer 1

When you submit the form, the whole page is replaced with a response from the server. If you want to stay on the page (instead of replacing it with a response), you can look at jQuery.postor jQuery.ajaxto send the form data to the server, and not send the form.

Answer 2

, . , , . , .

HTML .

Answer 3

You can use cookies with JavaScript to save values. Basically you get access to what is called document.cookie.

Answer 4

As an example, to save data in 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;" />

Answer 5

In the form tag, enable onsubmit ="return false"to avoid reset form. For example:

<form name = "inputNumbers" onsubmit ="return false">