How to stop getting back to "blank" in the form after alert?

Question

Alert pop up if there is a blank in forms. The error check in Javascript is working,
but after alert is closed, the text in the form will be blank.

I want that the text I filled in will stay after alert is closed.
Because I want to fill up the only blank after alert.

Could you let me know how to keep the value even after alert?

function check_form() {
  let name = document.form1.name.value;
  let mail = document.form1.mail.value;
  let subject = document.form1.subject.value;
  let message = document.form1.message.value;

  let error_message = '';

  if (name == '') {
    error_message += 'Name is blank\n';
  }
  if (mail == '') {
    error_message += 'Mail is blank\n';
  }
  if (subject == '') {
    error_message += 'Subject is blank\n';
  }
  if (message == '') {
    error_message += 'Message is blank\n';
  }

  if (error_message != '') {
    alert(error_message);
    return false;
  } else {
    return true;
  }
}

<form method="post" name="form1" onsubmit="check_form()">
  <label for="name">Name</label>
  <input type="text" id="name" name="name">

  <label for="mail">Mail</label>
  <input type="text" id="mail" name="mail">

  <label for="subject">Subject</label>
  <input type="text" id="subject" name="subject">

  <label for="message">Message</label>
  <textarea id="message" name="message"></textarea>

  <input type="submit" value="Send message" id="submit-btn">
</form>

Possible duplicate of [How to prevent buttons from submitting forms](https://stackoverflow.com/questions/932653/how-to-prevent-buttons-from-submitting-forms) — Heretic Monkey, Feb 18 '19 at 14:55

score 2 · Accepted Answer · answered Feb 18 '19 at 14:53

The problem is that your form is submitted when the alert pops up, the return false is not enough to stop the form submit. You should use the preventDefault in order to stop the submit in the error case

function check_form(e) {
  let name = document.form1.name.value;
  let mail = document.form1.mail.value;
  let subject = document.form1.subject.value;
  let message = document.form1.message.value;

  let error_message = '';

  if (name == '') {
    error_message += 'Name is blank\n';
  }
  if (mail == '') {
    error_message += 'Mail is blank\n';
  }
  if (subject == '') {
    error_message += 'Subject is blank\n';
  }
  if (message == '') {
    error_message += 'Message is blank\n';
  }

  if (error_message != '') {
    alert(error_message);
    e.preventDefault();
    return false;
  } else {
    return true;
  }
}

<form method="post" name="form1" onsubmit="check_form(event)">
  <label for="name">Name</label>
  <input type="text" id="name" name="name">

  <label for="mail">Mail</label>
  <input type="text" id="mail" name="mail">

  <label for="subject">Subject</label>
  <input type="text" id="subject" name="subject">

  <label for="message">Message</label>
  <textarea id="message" name="message"></textarea>

  <input type="submit" value="Send message" id="submit-btn">
</form>

How to stop getting back to "blank" in the form after alert?

1 Answers1