How to Stop SubmitButton when there is a validation error in the dashboard ?

[zacksoft_wf]

I have a field 'Value'  in dashboard that is being validated by an external .js .
When the validation match fails it shows the error message "Please input a valid Value". But when I ignore that message and hit submit button, it anyways submits that record.
I want the dashboard not to submit, until I input the field with correct values and no validation message comes.
I have so many input fields , but I am validating only the 'Value' field. And I don't want the user to be able to submit record while ignoring the validation message.

===================================================
<input type="text" token="value" id="tkn_value_id" searchWhenChanged="true" depends="$some_condition$">
<label>Value</label>
========================================
require([
'underscore',
'splunkjs/mvc',
'jquery',
"splunkjs/mvc/simplexml/ready!"
], function(_, mvc, $) {
var tkn_value = splunkjs.mvc.Components.getInstance("tkn_value_id");
tkn_value.on("change", function(e) {
console.log(e)
// e.preventDefault();
if (!isValueValid(e)) {
alert("Enter Valid Value")
return false;
}
})
function isValueValid(userInput) {
console.log(userInput)
var res = userInput.match(/(^\s|\"|\s$)/g)
if (res == null)
return true;
else
return false;
}
========================================================
})

[jcraumer]

Do not use the default submit button provided by the dashboard editor. 

Create a custom button that will submit the form once validation is complete.  This can be done in the same Javascript file used for the validation but create a if statement that if the validation fails the form doesn't submit.

[zacksoft_wf]

@jcraumer 
I am new to JavaScript , could you elaborate a bit about the positioning of the if condition in the JavaScript ,please .