帶有選項卡和自定義錯誤消息的jQuery表單驗證

Question

我正在使用http://bassistance.de/jquery-plugins/jquery-plugin-validation/進行表單驗證。

我的表格分為多個選項卡。

最后一個標簽是我的表單提交按鈕所在的位置。 現在，驗證檢查似乎可以正常工作，但是，驗證總是返回到缺少完成的字段。

我寧願只是在“提交”按鈕上方輸出我的錯誤消息，告訴用戶返回到有問題的選項卡並完成該字段。

這是我正在使用的代碼

var errcontainer = $('.errcontainer');
$("#application-submit").click(function() {
        $("#application-form").validate({
        debug: true,
        rules: {
            student_lastname: "required"
        },
        errorContainer: errcontainer,
        errorLabelContainer: $("ol", errcontainer),
        wrapper: 'li',
        meta: "validate"
    });
});

http://jsfiddle.net/F2HNh/

當我禁用選項卡時，輸出錯誤消息，但是當我啟用它們時，我什么也沒得到。

有什么建議么？

謝謝。

Answer 1

與其他jQuery插件一樣，您可以在DOM上對其進行初始化。 無需將.validate()放在點擊處理程序中。 如果您只希望它在單擊“提交”按鈕時測試表單的有效性，則默認情況下已執行該操作。

$(document).ready(function() {
    $("#application-form").validate({
        debug: true, // <-- this will block a real submission
        rules: {
            student_lastname: "required"
        },
        errorContainer: errcontainer, // <-- errcontainer not defined or a valid selector.
        errorLabelContainer: $("ol", errcontainer), // <-- errcontainer not defined or a valid selector.
        wrapper: 'li',
        meta: "validate"  // <-- this is not a documented option
    });
});

我不確定您對meta: "validate"期望是什么meta: "validate" ... 這不是文檔說明的選項 。

另外，您的errorContainer:和errorLabelContainer:選項無效。 根據文檔和示例 ， errorLabelContainer:是“由作為errorContainer選項傳遞的選擇器指定的” 。 errcontainer不是有效的選擇器，也不是定義的變量。

與errorLabelContainer:相同的是， $("ol", errcontainer)不是有效的選擇器。

正如您所定義的，這兩個選項均導致插件因錯誤而失敗： http : //jsfiddle.net/5JRNV/

如果您不想關注第一個無效字段，請使用focusInvalid: false選項。

$(document).ready(function() {
    $("#application-form").validate({
        focusInvalid: false,
        rules: {
            student_lastname: "required"
        },
        // other options.
    });
});

標准演示： http : //jsfiddle.net/5G5PT/

Answer 2

嘗試傳遞帶有空數組的ignore選項

$('form').validate({
 // your other options    
 ignore:[]
});

如果在啟用選項卡之前錯誤消息已顯示在errorLabelContainer中 ，但之后未顯示，則可能是因為錯誤位於隱藏的字段中，默認情況下未驗證。