I am trying to add custom error messages to my HTML5-based contact form, with JavaScript, and I encountered an issue in that, though I can get the custom messages to trigger on an invalid entry of a form field, they also trigger and prevent the form's submission when the input's validity conditions are satisfied; below you will see the javaScript and corresponding HTML markup, that relates to this issue; how can I fix this?:

<label>Name 

<input required id="name" name="name" placeholder="Name" tabindex="1">

</label>

<Script>

var nError= document.getElementById("name");

nError.checkValidity(this)

{

    if(nError.validity.valueMissing)

    {

        nError.setCustomValidity("You need to leave your name, here.");

    }

};

</Script>