jQuery表單驗證 - 成功+ showErrors

我使用jQuery Validation Plugin，並且當插件檢測到有效或無效的輸入時想運行我自己的代碼。jQuery表單驗證 - 成功+ showErrors

我已經想通了，這兩個.validate()選擇我需要的是success和showErrors，我可以讓他們既要對自己的工作：

var validator = $('#form').validate({ 
    rules: { 
    name: "required", 
    email: { 
     required: true, 
     email: true 
    } 
    }, 
success: function() { 
    console.log('success'); 
}

，它記錄success有效輸入時的任何時間。而showErrors作品也會正確：

var validator = $('#form').validate({ 
    rules: { 
    name: "required", 
    email: { 
     required: true, 
     email: true 
    } 
    }, 
showErrors: function() { 
    console.log('error'); 
}

但是當我嘗試把二者結合起來，error將記錄每一次無論輸入是否有效：

var validator = $('#form').validate({ 
    rules: { 
    name: "required", 
    email: { 
     required: true, 
     email: true 
    } 
    }, 
success: function() { 
    console.log('success'); 
}, 
showErrors: function() { 
    console.log('error'); 
}

的選項的順序不有什麼影響。

有誰知道爲什麼這兩個選項不能一起工作，以及如何在有效和無效輸入上運行我自己的功能？

來源

2013-09-01 cantera

我也有這個問題。雖然下面的突出顯示/突出顯示很有幫助，但這不完全是我想要實現的。 showErrors是很好的，因爲它將錯誤作爲參數提供給你。 Highlight/unhighlight有一個單獨的用例。能夠將兩者結合起來會很好。 – getWeberForStackExchange

想通了......有點。

我將showErrors替換爲highlight，這允許我對有效或無效條目運行回調。

但是，該插件仍然顯示默認錯誤消息 - 可能因爲我沒有做任何事情showErrors。於是我只好通過設置一個空字符串的每個字段的消息破解是：

var validator = $('#form').validate({ 
    rules: { 
    name: "required", 
    email: { 
     required: true, 
     email: true 
    } 
    }, 
    messages: { 
    name: '', 
    email: '' 
    }, 
    success: function() { 
    console.log('success'); 
    }, 
    highlight: function() { 
    console.log('highlight'); 
    } 
}

當然不是乾淨，因爲我想，如果任何人有一個更好的方式，將是巨大的。

來源

2013-09-01 04:16:56 cantera

你很近。 **提示：「不高興」**。請參閱文檔。 – Sparky

謝謝 - 錯過了文檔。當我在控制檯中注意「unighighlight」時，每次點擊某個字段時都會觸發。那應該是這樣嗎？ – cantera

默認情況下，blur，keyup，radio/checkbox click，select change和submit click是觸發驗證的事件。因爲'unhighlight'可以消除錯誤，那麼是的，情況就是這樣。構建一個jsFiddle示例。 – Sparky

只有在檢測到錯誤時纔會調用「showErrors」，無論您輸入什麼值，每次更改輸入時都會調用它。

「showErrors」接收兩個參數：「errorMap」和「errorList」。爲了驗證是否真的是你必須檢查這些值的一個錯誤：

showErrors: function(errorMap, errorList) { 
    if (errorsList.length > 0) { 
    console.log('error'); 
    } 
}

您也可以處理showErrors函數裏面的「成功」的事件，因爲它被稱爲在當前的情況下驗證。

showErrors: function(errorMap, errorList) { 
    if (errorsList.length == 0) { 
    this.currentElements.addClass("success"); 
    } 
}

來源

2014-05-23 12:25:39

jQuery表單驗證 - 成功+ showErrors

回答

相關問題