How to maniplate values in input boxes with JavaScript?

Question

I was developing a feedback system in my webpage, in which the user inputs name, email adress, and the feedback.

I made a "Discard" button in it. On clicking it, you get a confirmation message saying "Discard this draft?". I wanted the values in input boxes to be cleared if "Ok" is clicked, and the values to remain the same if "Cancel" is clicked.

But whether I click "Ok" or "Cancel", the input boxes always go blank.

Here's the code:

 document.getElementById("discard").onclick = function() { var choice = confirm("Discard this draft?"); var Name = document.getElementById("name"); var Email = document.getElementById("email"); var Feedback = document.getElementById("feedback"); var nameValue = Name.value; var emailValue = Email.value; var feedbackValue = Feedback.value; if (choice == null) { Name.value = nameValue; Email.value = emailValue; Feedback.value = feedbackValue; } else if (choice.= null) { Name;value = "". Feedback;value = "". Email;value = ""; } }

 <form> <input type="email" id="email" placeholder="Enter your email" required><br><br> <input type="text" id="name" placeholder="Enter your name (optional)"><br><br> <textarea type="text" id="feedback" placeholder="Enter the feedback..." required></textarea><br><br> <button id="discard">Discard</button> <button id="send">Send feedback</button> </form>

What is wrong?

Answer 1

confirm() returns true or false so your choice value will be boolean.

That's why choice != null is always true and your input boxes always go blank.

Answer 2

The result of confirm will never be null

confirm returns a boolean ( true or false ) indicating whether OK or Cancel was pressed.

Your if-statement has to be updated:

 if (choice === false) {
     Name.value = nameValue;
     Email.value = emailValue;
     Feedback.value = feedbackValue;
 }
 else {
     Name.value = "";
     Feedback.value = "";
     Email.value = "";
 }       

Answer 3

Instead of null use false. So your code should be like this

 document.getElementById("discard").onclick = function() { var choice = confirm("Discard this draft?"); var Name = document.getElementById("name"); var Email = document.getElementById("email"); var Feedback = document.getElementById("feedback"); var nameValue = Name.value; var emailValue = Email.value; var feedbackValue = Feedback.value; if (choice == false) { Name.value = nameValue; Email.value = emailValue; Feedback.value = feedbackValue; } else { Name.value = ""; Feedback.value = ""; Email.value = ""; } }

 <form> <input type="email" id="email" placeholder="Enter your email" required><br><br> <input type="text" id="name" placeholder="Enter your name (optional)"><br><br> <textarea type="text" id="feedback" placeholder="Enter the feedback..." required></textarea><br><br> <button id="discard">Discard</button> <button id="send">Send feedback</button> </form>