Page Reloads When Submitting A Form

Question

I am currently having some problems with submitting a form. What I'm trying to do is to save what the user enters in the field using localStorage before redirecting them to a new page, while not losing the localStorage.

At the moment, I can't even redirect.

This is for my project at school and there is a limit that I cannot use AJAX or anything rather than JavaScript. In the past, I have tried location.replace and it does redirect, but after a two time click and losing all of the localStorage. I have tried switching to location.href as well as not making it a form any more by removing the form element but things still don't work.

<form> 
   <p class="question_title">Enter your name</p>
   <input type="text" id="name" required> 
   <input type="submit" value="Save" onClick="save();">
</form>

function save() {
   var name = document.getElementById("name").value; 
   localStorage.setItem("name", name);
   location.href("finish.html");
}

It is expected that the name will be saved to the browser's local storage, and the browser will redirect to a new page, rather than now when I click Save, it reloads the page and the value that I have entered is gone.

An input of `type="submit"` will reload the page when it is clicked. You should change it to `type="buttton"` to prevent this reload. — Nick Parsons, Jul 17 '19 at 07:57

score 0 · Accepted Answer · answered Jul 17 '19 at 08:04

0

this cod fix your problem

function save(e) {
   e.preventDefault();
   var name = document.getElementById("name").value; 
   localStorage.setItem("name", name);
   location.href("finish.html");
}

answered Jul 17 '19 at 08:04

Javad Ebrahimi

199
3
11

Page Reloads When Submitting A Form

1 Answers1