InnerHTML changes reverting on form submit

Asked Mar 15 '16 at 04:39

Active Mar 15 '16 at 04:44

Viewed 119 times

I am trying to change the contents of a paragraph to the value of a text input field on the input field's submit. The paragraph will momentarily change and then the page will refresh and the changes will be reverted. How do I keep the changes? Thank you!

Here is my code:

<!DOCTYPE html>
<html>
<body>
    <form onsubmit = "myFunction()">
        <input id = "input" type = "text">
    </form>
    <p id = "change"> This should be changed on submit</p>

    <script>
        function myFunction() {
            document.getElementById("change").innerHTML = document.getElementById("input").value;
        }
    </script>
</body>
</html>

asked Mar 15 '16 at 04:39

Bill Ray

Because `
` is submitted and page is refreshed.
– Tushar Mar 15 '16 at 04:40
How would I keep the form from submitting? – Bill Ray Mar 15 '16 at 04:41
2

[How to prevent form from being submitted?](http://stackoverflow.com/questions/3350247/how-to-prevent-form-from-being-submitted) – Tushar Mar 15 '16 at 04:42
Thank you.
and then making myFunction() return false solved this.
– Bill Ray Mar 15 '16 at 04:45
Why not take the input out of the form and use its *change* event instead? – RobG Mar 15 '16 at 04:50

InnerHTML changes reverting on form submit

0 Answers0