JS function within external js file cannot be called - Uncaught reference error

Question

I have a small form that should run a js function when the submit button is clicked. Unfortunately, I keep getting an error in the console whenever the submit button is being clicked, that the function is not defined. The script file containing the function, is being integrated at the very bottom within the body tag and the external js script file

function test() {
  alert("this is a test");
}

<form name="form" class="text-center" novalidate onsubmit="return test()" method="POST">  
 <p>enter your name</p>

 <input type="text"  name="name" id="name">

 <button type="submit" class="btn">Submit</button>
</form>

Answer 1

The keyword "return" in your onsubmit means that the value expected to be returned is "false" or "true". It expects a boolean value to decide if the form will submit or not. If you only want to trigger the alert then you must do so without return, as in;

onsubmit="test()"

This has been extensively answered here - stackoverflow