validate <form> with Javascript

Question

I’m trying to validate a <form> with Javascript, but the code I created is not doing anything. seems right to me.

HTML code

<form name="ContactForm" action="addDataAdmin.php" method="POST" enctype="multipart/form-data" autocomplete="off" onsubmit="return ValidateContactForm();">
  <p>ISBN</p> <input type="text" name="ISBN">
  <p>Author's Name</p> <input type="text" name="Authorsname">
  <p>Title</p> <input type="text" name="Title">
  <p>Edition</p> <input type="text" name="edition">
  <p>Year</p> <input type="text" name="year">

  <p>Category</p>
  <select name="category" size="1">
      <option value="computing">Computing</option>
      <option value="Romance">Romance</option>
      <option value="Fiction">Fiction</option>
      <option value="Non-Fiction">Non-Fiction</option>
  </select>
  <br />

  <p>Publisher</p> <input type="text" name="publisher">
  <p>Quantity-in-stock</p> <input type="text" name="quantityinstock">
  <p>Price</p> <input type="text" name="price">
  <input type="file" name="fileToUpload" id="fileToUpload">
  <input type="submit" value="Upload Image" name="submit" formaction="/upload.php">
  <input type="submit" value="Send" name="send">
  <input type="reset" value="Clear">
</form>

Script

function ValidateContactForm()
{
    var ISBN = document.ContactForm.ISBN;
    var Authorsname = document.ContactForm.Authorsname;
    var Title = document.ContactForm.Title; 
    var edition = document.ContactForm.edition;
    var year= document.ContactForm.year;
    var category = document.ContactForm.category;
    var publisher = document.ContactForm.publisher;
    var quantityinstock= document.ContactForm.quantityinstock;
    var price = document.ContactForm.price;
}

if (ISBN.value == "")
{
    window.alert("Please enter ISBN.");
    ISBN.focus();
    return false;
}

Answer 1

The key that closes the function ValidateContactForm is in the wrong place.

This if (ISBN.value == "") is lost in the code, it should be inside the function that makes the validation.

See working (I took out a good part of the code for easy reading).

function ValidateContactForm()
{
    var ISBN = document.ContactForm.ISBN;
    
    if (ISBN.value == "")
    {
        window.alert("Please enter ISBN.");
        ISBN.focus();
        return false;
    }
}

<form name="ContactForm" method="GET" onsubmit="return ValidateContactForm();">
  <p>ISBN</p> <input type="text" name="ISBN">
  
  <input type="submit" value="Send" name="send">
</form>

Answer 2

If you want, you can use the plugin jQuery Validation.

To use you would only have to download the plugin, call it in your HTML page and configure:

<form name="ContactForm" id="ContactForm" action="addDataAdmin.php" method="POST" enctype="multipart/form-data" autocomplete="off">
  <p>ISBN</p> <input type="text" name="ISBN">
  <p>Author's Name</p> <input type="text" name="Authorsname">
  <p>Title</p> <input type="text" name="Title">
  <p>Edition</p> <input type="text" name="edition">
  <p>Year</p> <input type="text" name="year">

  <p>Category</p>
  <select name="category" size="1">
      <option value="computing">Computing</option>
      <option value="Romance">Romance</option>
      <option value="Fiction">Fiction</option>
      <option value="Non-Fiction">Non-Fiction</option>
  </select>
  <br />

  <p>Publisher</p> <input type="text" name="publisher">
  <p>Quantity-in-stock</p> <input type="text" name="quantityinstock">
  <p>Price</p> <input type="text" name="price">
  <input type="file" name="fileToUpload" id="fileToUpload">
  <input type="submit" value="Upload Image" name="submit" formaction="/upload.php">
  <input type="submit" value="Send" name="send">
  <input type="reset" value="Clear">
</form>

<script src="https://code.jquery.com/jquery.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery-validate/1.16.0/jquery.validate.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery-validate/1.16.0/additional-methods.js"></script>

<script>
$("#ContactForm").validate({
    rules: {
        ISBN: "required",
        Authorsname: "required",
        Title: "required",
        edition: "required",
        year: {
            required: true,
            minlength: 4
        },
        category: "required",
        publisher: "required",
        quantityinstock: "required",
        price: "required"
    },
    messages: {
        ISBN: "Informe o ISBN",
        Authorsname: "Informe o nome do Autor",
        Title: "Informe o Título",
        edition: "Informe a Edição",
        year: {
            required: "Informe o ano",
            minlength: "O ano deve ser de 4 digitos"
        },
        category: "Escolha uma categoria",
        publisher: "Informe a editora",
        quantityinstock: "Informe a quantidade em Estoque",
        price: "Informe o Preço"
    }
});
</script>