验证 ASP.net 表单中的 bootstrap 3 单选按钮

Question

我一直在研究这个 asp.net 表单，让 jquery 验证/不显眼的验证工作，但已经耗尽了我的 google.com 技能，还没有找到答案。

我似乎无法在单选按钮上进行 jquery 验证。任何帮助将不胜感激

asp.net 代码：

<div class="btn-group" data-toggle="buttons">
    <label class="btn btn-default">
        @Html.RadioButtonFor(x => x, true, new Dictionary<string, object> { { "id", "IsMonetary" }, { "data-val", "true" } })
        Add $ amount
    </label>
    <label class="btn btn-default">
        @Html.RadioButtonFor(x => x, false, new Dictionary<string, object> { { "id", "IsNotMonetary" } })
        Not this time jackson
    </label>
</div>

@Html.ValidationMessageFor(x => x)

输出html：

<form action class="form-horizontal" id="recipientForm" role="form" novalidate="novalidate">
    <div class="form-group">
        <div class="btn_group" data-toggle="buttons">
            <label class="btn btn-default">
                <input id="IsMonetary" name="IsMonetary" type="radio" data-val="true" data-val-required="*" value="true">Add $ award</label>
            <label class="btn btn-default">
                <input id="IsNotMonetary" name="IsMonetary" type="radio" value="false" data-val-required="*">Not this time</label>
        </div>
       <span class="field-validation-valid" data-valmsg-for="IsMonetary" data-valmsg-replace="true"></span>
    </div>
    <input id="derp" name="derp" data-val="true" data-val-required=”Required” />
    <span data-valmsg-for="derp" data-valmsg-replace="true"></span>
    <input type="submit" class="btn btn-primary pull-right loading" value="Submit" />
</form>

这里是小提琴：JSFiddle* 注意外部文件，如果您想查看它们，请查看：Here (github link)

Answer 1

您的代码：

$('form').validate();

$('form').on('submit', function () {
    console.log($(this).validate());
    console.log("valid: " + $(this).valid());
    //return false;
});

您不需要提交处理程序。

jQuery Validate 插件...

a) 捕获提交按钮的click，
b) 捕获触发验证的其他鼠标事件，
c) 进行验证，
d) 如果无效则阻止提交，
e) 然后如果有效则允许提交

...所有自动。

基本用法：http://jsfiddle.net/xjXhN/

---

另外，.validate() 是插件的 initialization 方法，只在页面加载时被调用一次。 unobtrusive 插件和 ASP 不是已经自动处理这个初始化了吗？