OnSubmit Javascript not overriding submit action

Question

Я пытаюсь создать веб-сайт с веб-формой. Я использую godaddy по умолчанию webform php, и я не уверен, как проверить форму для обязательных полей.

Я хочу, чтобы пользователь не мог отправить форму до проверки. Я нашел javascript файлы онлайн, представленные другими пользователями, которые решают эту проблему, но я не могу заставить его работать.

<script language="javascript" type="text/javascript"> 
function checkForm() { 
    if (form.FirstName.value == "") { 
     alert("Please enter your first name"); 
     form.FirstName.focus(); 
     return false; 
    } 

    if (form.LastName.value == "") { 
     alert("Please enter your last name"); 
     form.LastName.focus(); 
     return false; 
    } 
    var email = form.email.value; 
    if (email.indexOf('@') == -1) { 
     alert("Plelase enter valid email"); 
     form.email.focus(); 
     return false; 
    } 
    return true; 
} 
</script> 

Ниже форма:

<form onsubmit="return checkForm()" action="/webformmailer.php" method="post"> 
<input type="hidden" name="subject" value="Submission" /> 
<input type="hidden" name="redirect" value="thankyou.html" /> 
<span>First Name:</span><br> 
<input type="text" name="FirstName"/><br> 
<span>Last Name:</span><br> 
<input type="text" name="LastName" /><br> 
<span>*Email:</span><br> 
<input type="text" name="email" /><br> 
<span>*Comments:</span><br> 
<textarea name="comments" cols="40" rows="10"> 
</textarea><br> 

<input type="submit" name="submit" value="submit"/> <span id ="required">*required field</span> 
<input type="hidden" name="form_order" value="alpha"/> <input type="hidden" name="form_delivery" value="daily"/> <input type="hidden" name="form_format" value="html"/> 

Я попытался представления без ввода ничего, и он перенаправляет меня к спасибо.

Answer 1

form не определен в функции. Есть несколько способов справиться с этим. Простейший бы изменить return checkForm() к return checkForm(this) и

function checkForm(form) { 

Answer 2

В форме изменить checkForm() к checkForm(this). Затем в вашем javascript измените function checkForm() { на function checkForm(form) {

Возможно, это поможет.

Answer 3

Вы забыли 2 вещи: первый, пожалуйста, добавьте имя = "форма" в

<form name="form" onsubmit="return checkForm()" action="/webformmailer.php" method="post"> 

второй, вы misstake близко форму, пожалуйста добавьте этот код в конец HTML

</form> 

Ваш HTML-адрес будет выглядеть так:

<form name="form" onsubmit="return checkForm()" action="/webformmailer.php" method="post"> 
    <input type="hidden" name="subject" value="Submission" /> 
    <input type="hidden" name="redirect" value="thankyou.html" /> 
    <span>First Name:</span><br> 
    <input type="text" name="FirstName"/><br> 
    <span>Last Name:</span><br> 
    <input type="text" name="LastName" /><br> 
    <span>*Email:</span><br> 
    <input type="text" name="email" /><br> 
    <span>*Comments:</span><br> 
    <textarea name="comments" cols="40" rows="10"></textarea><br> 
    <input type="submit" name="submit" value="submit"/> 
    <span id ="required">*required field</span> 
    <input type="hidden" name="form_order" value="alpha"/> 
    <input type="hidden" name="form_delivery" value="daily"/> 
    <input type="hidden" name="form_format" value="html"/> 
</form> 

1 вещь в JavaScript, функция для проверки адреса электронной почты неверны, правильным является:

var email = form.email.value; 
var re = /^[\w-]+(\.[\w-]+)*@([\w-]+\.)+[a-zA-Z]{2,7}$/; 

if (!email.match(re) || !email) { 
    // incorrect email address 
} 

Новый скрипт будет:

<script language="javascript" type="text/javascript"> 
function checkForm() { 
    if (form.FirstName.value == "") { 
     alert("Please enter your first name"); 
     form.FirstName.focus(); 
     return false; 
    } 

    if (form.LastName.value == "") { 
     alert("Please enter your last name"); 
     form.LastName.focus(); 
     return false; 
    } 
    var email = form.email.value; 
    var re = /^[\w-]+(\.[\w-]+)*@([\w-]+\.)+[a-zA-Z]{2,7}$/; 

    if (!email.match(re) || !email) { 
     alert("Plelase enter valid email"); 
     form.email.focus(); 
     return false; 
    } 
    return true; 
} 
</script> 

Гудлак!