Question

我正在尝试在我的网络应用中构建一些验证并且遇到一个小问题。我有一个asp下拉列表和一个文本框，如果有人从下拉列表中选择“其他”，我想强制使用文本框。当我选择其他时验证工作但如果我决定选择另一个选项并单击保存按钮，它仍然要求我在文本框中输入一个值，即使下拉列表的选定值不是其他值。

这是我的jquery函数：

$(function() {

    $("#btnMainSave").click(function() {

        val = $('#ddlRefTo').val();
        alert(val);
        $("#form1").validate({

            rules: {

                txbRefToOther: val == "Other" ? "required" : "notrequired",
                txbRefConcern: "required"

            },
            messages: {
                txbRefConcern: "*This field is mandatory",
                txbRefToOther: "*This field is mandatory"

            },

            ignore: ""
        });
    });
});

警报显示正在拾取值的变化但由于某种原因，验证部分仍然坚持我在文本框中放置了一个值，即使val =与“其他”不同。

任何帮助将不胜感激。谢谢

更新

我玩过自定义验证，但仍然遇到了一些问题。这是我的自定义验证方法：

$.validator.addMethod("Test", function(value, element) {

        var val = $('#ddlRefTo').val();

        if (value.length==0 && val=="Other") {

            //INVALID
            return false;
        }
        // VALID
        else return true;
    },
             "*This field is required.");

我指的是这样的：

$("#form1").validate({
        rules: {
            txbRefToOther: {
                required: true,
                Test: true

            }
        }
    });

然而，只要我提交，无论在下拉列表中选择了什么，都会触发验证错误，并且只有在文本框中输入内容时才会停止。

但是，如果我在下拉菜单而不是文本框中设置验证，如下所示：

$.validator.addMethod("Test", function(value, element) {

  if (value=="Other" && $('#txbRefToOther').val()=="") {

              //INVALID
               return false; 
           }
           // VALID
          else return true; 
            },
             "*This field is required.");

$("#form1").validate({
          rules: {
                ddlRefTo:{
                            required: true,
                           Test: true

                        }
                    }
        });

它按照我想要的方式工作，但错误信息显示在下拉列表中！为什么第一个版本不起作用？如果有帮助的话，继承我的HTML：

<script type="text/javascript" src="http://code.jquery.com/jquery-1.9.1.js"></script>
<script type="text/javascript" src="http://code.jquery.com/ui/1.10.3/jquery-ui.js"></script>

<script  type="text/javascript" src="http://jquery.bassistance.de/validate/jquery.validate.js"></script>
<script type="text/javascript" src="http://jquery.bassistance.de/validate/additional-methods.js"></script>
......
......
<table width="530">
<tr>
<td class="Label" width="80">Referring to</td>
<td width="120"><asp:DropDownList id="ddlRefTo" runat="server" CssClass="textbox" Font-Size="9pt" Width="110">
        <asp:ListItem Text="Test1" Value="Test1"></asp:ListItem>
        <asp:ListItem Text="Test2" Value="Test2"></asp:ListItem>
        <asp:ListItem Text="Test3" Value="Test3"></asp:ListItem>
        <asp:ListItem Text="Other" Value="Other"></asp:ListItem>
</asp:DropDownList>

</td>
<td class="Label" align="right" width="170">If 'Other', Please specify</td>
<td><asp:TextBox ID="txbRefToOther" runat="server" CssClass="textbox" Width="150"></asp:TextBox></td>
</tr>
</table>
<asp:Button ID="submit" runat="server" Text="Click" />

Answer 1

尝试仅将消息设置为所需的验证：

messages:{
    txtRefToOther:{
        required: "*This field is mandatory"
    }

另外，什么是不需要的？确保将其定义为自定义方法。

根据您的评论，我认为您最好的选择是添加自定义方法来处理此验证。这是自定义方法：

 jQuery.validator.addMethod("conditionallyRequired", function (value, element, params) {
    if ($("'#" + params + "'").val() == "Other") && value == ''{
         return false; //INVALID
    }
    return true; // VALID
}, "*This field is required." //VALIDATION MESSAGE      
);

// connect it to a css class 
jQuery.validator.addClassRules({
    conditionallyRequired: { conditionallyRequired: true }
});

此方法将检查ddlRefTo是否为“其他”以及此文本框是否为空。如果是，它将返回false - 无效。将方法应用于文本框：

txtRefToOther:
{
    conditionallyRequired: ddlRefTo
}

更改下拉列表值未在jquery验证中获取

更新

1 个答案: