防止多個表單提交

我有一個表單供用戶提交他們對電影的評論。當有一個字段被遺漏時，會顯示一個錯誤提示，要求用戶填寫必填字段，但是當您多次點擊提交按鈕時，會按下按鈕多次顯示所需的字段提示錯誤，從而導致長時間重複錯誤列表。我如何防止這種情況發生？我已經嘗試禁用提交按鈕上的工作和顯示錯誤一次，但然後按鈕不能再次按下。任何幫助將不勝感激。防止多個表單提交

$('#review_a_film').submit(function (e) { 

    var error = false; 

    // No value for movie_title 
    if ($('#movie_title').val() == "") { 
     $('.error').append("<li>Please enter a title </li>"); 
     error = true; 
    } 

    // No Value for actor 
    if ($('#leading_name').val() == "") { 
     $('.error').append("<li>Please enter the leading actors name </li>"); 
     error = true; 
    } 

    // No value for rating 
    if ($('#rating').val() == null) { 
     $('.error').append("<li> Please enter a rating</li>"); 
     error = true; 
    } 

    //No value for review 
    if ($('#review').val() == "") { 
     $('.error').append("<li>Please enter a review</li>"); 
     error = true; 
    } 

    if (error) { // If error found dont submit. 
     e.preventDefault(); 
    } 
}); // End of .submit function: review_a_film.

來源

2013-10-18 user1829823

爲什麼不只是在提交函數開始時清除.error列表？

$('#review_a_film').submit(function (e) { 

    var error = false; 

    $('.error').empty(); 

    //... 

}

來源

2013-10-18 18:12:13

這很完美Ed Hinchliffe它是如何工作的雖然無法讓我的頭瞭解程序的工作原理？ – user1829823

按下表單上的提交按鈕調用提交功能。每次按下時，您都會檢查表單中的錯誤，並在存在錯誤時將相應的消息添加到錯誤列表中。最後，如果出現錯誤，您還可以阻止默認提交操作。在每次點擊清除錯誤標記時，您並未清除添加了「附加」的HTML中的錯誤列表。這多餘的行清空錯誤列表HTML。 –

你需要停下來驗證之前提交，然後，如果它的東西，如通過提交：

$('#review_a_film').submit(function (e) { 
    Event.stop(e); 
    var form = Event.element(e); 

    ... 

    if (all is dandy) { form.submit() }; 
});

來源

2013-10-18 18:01:03 isherwood

你必須禁用按鈕，啓用按鈕，如果有任何錯誤。

$('#review_a_film').submit(function (e) { 
$(this).attr('disabled',true); 

var error = false; 

// No value for movie_title 
if ($('#movie_title').val() == "") { 
    $('.error').append("<li>Please enter a title </li>"); 
    error = true; 
} 

// No Value for actor 
if ($('#leading_name').val() == "") { 
    $('.error').append("<li>Please enter the leading actors name </li>"); 
    error = true; 
} 

// No value for rating 
if ($('#rating').val() == null) { 
    $('.error').append("<li> Please enter a rating</li>"); 
    error = true; 
} 

//No value for review 
if ($('#review').val() == "") { 
    $('.error').append("<li>Please enter a review</li>"); 
    error = true; 
} 

if (error) { // If error found dont submit. 
    e.preventDefault(); 
$(this).attr('disabled',false); 
} 
}); // End of .submit function: review_a_film.

來源

2013-10-18 18:06:22

防止多個表單提交

回答

相關問題