对表单使用“按钮”类型而不是“提交”类型的 JQuery 验证
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/11914626/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
JQuery validation with "button" type rather than "submit" type for a form
提问by TheDude
$('selector').validation() seems to be built more for the "input" type button than the "button" type. How would I get it working with a button type within the form?
$('selector').validation() 似乎是为“输入”类型按钮而不是“按钮”类型构建的。我如何让它与表单中的按钮类型一起工作？
@using(Html.BeginForm(new {id="TheForm"}))
{
// code here
<input id="TheButton" type="button">
}
JQuery:
查询：
$(document).ready(function() {
$("#TheForm").validate({
rules: {
"AuditDoc.Title": {
required: true
}
}
});
$("#TheButton").click(function() {
});
});
Using this basic idea, how would I get jquery validate working with a button rather than a submit type button? I've seen examples where JQuery automatically displays error messages when the rules aren't met using submit type, but it doesn't appear to work with button type. I'd appreciate any advice!
使用这个基本思想，我如何让 jquery 验证使用按钮而不是提交类型按钮？我见过一些例子，当使用提交类型不满足规则时，JQuery 自动显示错误消息，但它似乎不适用于按钮类型。我很感激任何建议！
回答by Thulasiram
$(document).ready(function () {
$("#TheForm").validate({
rules: {
"AuditDoc.Title": {
required: true
}
}
});
$("#TheButton").click(function () {
if (!$("#TheForm").validate()) { // Not Valid
return false;
} else {
$("#TheForm").submit()
}
});
$('#btnReset').live('click', function (e) {
//var $validateObj = $('#formId');
//Or
var $validateObj = $(this).parents('form');
$validateObj.find("[data-valmsg-summary=true]").removeClass("validation-summary-errors").addClass("validation-summary-valid").find("ul").empty();
$validateObj.find("[data-valmsg-replace]").removeClass("field-validation-error").addClass("field-validation-valid").empty();
});
});
回答by Kanishka Panamaldeniya
$(document).ready(function(){
$("#myform").validate();
$("#byuttion").click(function() {
if($("#myform").valid())
{
$("#myform").submit();
}
else
{
return false;
}
});
});
回答by Rafay
One hackish way could be:
一种骇人听闻的方式可能是：
$("#TheButton").click(function() {
$("#TheForm").submit()
});
回答by Josh Bedo
It works pretty much the same as it would with a normal input except it doesn't support the submit method. preventDefault just stops the page from doing it's default request.
除了不支持提交方法外，它的工作方式与普通输入几乎相同。preventDefault 只是阻止页面执行它的默认请求。
$("#TheButton").click(function(event) {
event.preventDefault(); //or return false
getData();
});
