How to validate phone number in a form JavaScript

To answer a stackoverflow question: https://stackoverflow.com/questions/61841550/how-to-validate-phone-number-in-a-form-javascript/61841589#61841589

by Khader Handal

HTML

<form action="/books" method="POST" onsubmit="return validateForm()">

   <input class="form-control" type="text" name="user[name]" placeholder="name" required>
   <input class="form-control" type="number" name="user[phone]" placeholder="phone" required>

   <button>Submit</button>

</form>

CSS

body {
  background: #20262E;
  padding: 20px;
  font-family: Helvetica;
}

#banner-message {
  background: #fff;
  border-radius: 4px;
  padding: 20px;
  font-size: 25px;
  text-align: center;
  transition: all 0.2s;
  margin: 0 auto;
  width: 300px;
}

button {
  background: #0084ff;
  border: none;
  border-radius: 5px;
  padding: 8px 14px;
  font-size: 15px;
  color: #fff;
}

#banner-message.alt {
  background: #0084ff;
  color: #fff;
  margin-top: 40px;
  width: 200px;
}

#banner-message.alt button {
  background: #fff;
  color: #000;
}

JavaScript

function validateForm() {
  var x = document.forms["myForm"]["fname"].value;
  if (x == "") {
    alert("Name must be filled out");
    return false;
  }
}