Trying to post data with form, and check input field if empty

Question

I'm trying to have a form where I can search a database, but also have simple error handling where I can check if the user did not enter anything and run the function validateForm. However I'm not sure how to do both.

<form action="http://apsrd7252:5000/result/" method="POST">
  <input type="text" id="IDSub" name="hostname" />
  <input onclick="return validateForm()" type="submit" value="Submit" placeholder="Host Name" />
</form>

Here's the script

function validateForm() {
  var a = document.getElementById("IDSub");
  if( a.value == null) {
    alert("Please fill in an ID");
    return false;
  } else {
    window.location.href = "http://apsrd7252:5000/result";
  }
}

Possible duplicate of [javascript validation for empty input field](https://stackoverflow.com/questions/3937513/javascript-validation-for-empty-input-field) — Difster, Jun 22 '17 at 21:40
There are surely enough tutorials on the Internet for this kind of thing — Chris Satchell, Jun 22 '17 at 21:41
I understand how to pass the function from html to js, but it's not working when I have the form action= http..... is there something wrong i'm doing?: — BeastlyBernardo, Jun 22 '17 at 21:42

score 0 · Answer 1 · answered Jun 23 '17 at 04:21

Instead of "null" in if condition simply use empty string like "".

function validateForm() {
  var a = document.getElementById("IDSub");
  if( a.value == "") {
    alert("Please fill in an ID");
    return false;
  } else {
    window.location.href = "http://apsrd7252:5000/result";
  }
}

<!DOCTYPE html>
<html>

  <head>
    <link rel="stylesheet" href="style.css">
    <script src="script.js"></script>
  </head>

  <body>
    <form action="http://apsrd7252:5000/result/" method="POST">
  <input type="text" id="IDSub" name="hostname" />
  <input onclick="return validateForm()" type="submit" value="Submit" placeholder="Host Name" />
</form>
  </body>

</html>

Trying to post data with form, and check input field if empty

1 Answers1