jquery验证中的Bootstrap单选按钮

时间:2013-03-01 16:42:15

标签: twitter-bootstrap asp.net-mvc-4 jquery-validate radio-button

在尝试避免设置默认选定值时,我尝试了几种不同的选项。

选项1

<div class="control-group">
    <h4>Text</h4>
    <div class="controls">
        <div hidden="hidden" >@Html.EditorFor(m => m.pc.PS1)</div>                            
        <div class="btn-group" data-toggle-name="pc.PS1" data-toggle="buttons-radio">
        <button type="button" value="11" class="btn@((Model.pc.PS1 == 11) ? " active" : string.Empty )" data-toggle="button">Yes</button>
        <button type="button" value="12" class="btn@((Model.pc.PS1 == 12) ? " active" : string.Empty )" data-toggle="button">No</button>
        <button type="button" value="13" class="btn@((Model.pc.PS1 == 13) ? " active" : string.Empty )" data-toggle="button">N/A</button>
    </div>
    @Html.ValidationMessageFor(model => model.pc.PS1)
</div>

选项2

<div class="control-group">
     <h4>Text</h4>
     <div class="controls">
         @Html.HiddenFor(m => m.pc.F1FallsRiskAssessmentFRASE)
         <div class="btn-group" data-toggle-name="pc.PS2" data-toggle="buttons-radio">
         <button type="button" value="11" class="btn@((Model.pc.PS2== 11) ? " active" : string.Empty )" data-toggle="button">Yes</button>
         <button type="button" value="12" class="btn@((Model.pc.PS2== 12) ? " active" : string.Empty )" data-toggle="button">No</button>
         <button type="button" value="13" class="btn@((Model.pc.PS2== 13) ? " active" : string.Empty )" data-toggle="button">N/A</button>
         </div>
         @Html.ValidationMessageFor(model => model.pc.PS2)
      </div>
</div>

$('#ctFRM').validate({
            rules: {
                "pc.PS1": { required: true, minlength: 2 },
                "pc_PS2": { required: true, minlength: 2 },

页面上隐藏的ID是pc_PS2,但名称是pc.PS2,使用了firebug脚本选项卡,并且在此处设置了一个断点,当验证为pc_PS2时,默认值为0,但不管是否存在验证消息&#34;&#34;或&#34; _&#34;。

它们适用于使用&#34;的文本框输入。&#34;在验证规则和&#34; _&#34;在上面设置一个面具。

我曾尝试在radiobuttons上使用必需的验证,每个都具有1/2/3的值,但由于页面默认隐藏值为0,因此它不会触发所需的真实验证。

接下来,我尝试将选项值设置为11/12/13,因此它们的长度为2,因此我可以使用minlength 2来阻止提交但是在更改之前不会启动。

所以我留下了不显眼的验证备份选项,或为每个问题的每个按钮设置onclick,希望获得正常的字符串要求验证以处理另一组隐藏值。

任何想法或解决方案?

1 个答案:

答案 0 :(得分:1)

要验证任何隐藏字段,您必须按如下方式设置ignore选项。

$('#ctFRM').validate({
    // options and rules,
    ignore: []
});

有关详细信息,请参阅此处:https://stackoverflow.com/a/8565769/594235