форма отправляет вместо этого return false javascript

Question

Я пытаюсь проверить свою форму для проверки. У меня нет файла .asp или .php, поэтому мне сообщили, что я могу использовать action = "". Мой код, похоже, не работает правильно. В кодедере он отображается, когда значения публикуются. Jsfiddle дает мне ошибку, длинный абзац. В браузере страница, похоже, обновляется. У меня нет предупреждений, показывающих ничего ....

что я делаю неправильно здесь?

HTML:

<form name="name_form" action="" onsubmit="ValidateFormJS()" method="post"> 
    First Name: 
    <input type="text" name="first_name"> 
    <br> Last Name: 
    <input type="text" name="last_name"> 
    <br> 
    <input type="submit" value="Submit"> 
</form> 

Javascript:

function ValidateFormJS() { 
    var first = document.forms["name_form"]["first_name"].value; 
    var last = document.form["name_form"]["last_name"].value; 

    if (first == null || first == "") { 
     alert("First name must be filled out."); 
     return false; 
    } else if (last == null || last == "") { 
     alert("Last name must be filled out."); 
     return false; 
    } else { 
     alert("Form Submitted."); 
     return true; 
    } 
} 

Answer 1

Возвращаемые значения из функции никогда не используются. Вы забыли return перед вызовом функции на onsubmit события.

onsubmit="return ValidateFormJS()" 

Другая проблема заключается в том, что вы используете document.form, чтобы получить значение last name. Это должно быть document.forms.

Последние else могут быть удалены.

Demo

var form = document.forms["name_form"]; 
 

 
function ValidateFormJS() { 
 
    var first = form["first_name"].value, 
 
    last = form["last_name"].value; 
 

 
    if (first == null || first == "") { 
 
    alert("First name must be filled out."); 
 
    return false; 
 
    } else if (last == null || last == "") { 
 
    alert("Last name must be filled out."); 
 
    return false; 
 
    } 
 
}

<form name="name_form" action="" onsubmit="return ValidateFormJS()" method="post"> 
 
    First Name: 
 
    <input type="text" name="first_name"> 
 
    <br>Last Name: 
 
    <input type="text" name="last_name"> 
 
    <br> 
 
    <input type="submit" value="Submit"> 
 
</form>

Answer 2

попробовать это

ввиду

<form name="name_form" action="" onsubmit="return ValidateFormJS();" method="post"> 

в JS код

function ValidateFormJS() { 
    var first = document.forms["name_form"]["first_name"].value; 
    var last = document.form["name_form"]["last_name"].value; 

    if (first == null || first == "") { 
     alert("First name must be filled out."); 
     return false; 
    } else if (last == null || last == "") { 
     alert("Last name must be filled out."); 
     return false; 
    } 

    alert("Form Submitted."); 
    return true; 
}