1

我有一个自定义验证器(.net 3.5),它检查我表单中的四个下拉列表是否有重复值。它适用于服务器端,但我想添加一个客户端功能来配合它。我对JavaScript一无所知。你能帮忙吗?谢谢。

 <asp:CustomValidator id="CustomValidator1" runat="server" ErrorMessage = "Same related document was entered more than once" OnServerValidate="dropDownValidation_ServerValidate" Display="Dynamic"></asp:CustomValidator>


   Protected Sub dropDownValidation_ServerValidate(ByVal sender As Object, ByVal e As ServerValidateEventArgs)
    e.IsValid = Not haveSameValue(DropDownList9.SelectedValue, DropDownList12.SelectedValue) AndAlso _
                Not haveSameValue(DropDownList9.SelectedValue, DropDownList15.SelectedValue) AndAlso _
                Not haveSameValue(DropDownList9.SelectedValue, DropDownList18.SelectedValue) AndAlso _
                Not haveSameValue(DropDownList12.SelectedValue, DropDownList15.SelectedValue) AndAlso _
                Not haveSameValue(DropDownList12.SelectedValue, DropDownList18.SelectedValue) AndAlso _
                Not haveSameValue(DropDownList15.SelectedValue, DropDownList18.SelectedValue) 
    End Sub

    Protected Function haveSameValue(ByVal first As String, ByVal second As String) As Boolean
    If first <> "" And second <> "" AndAlso first.Equals(second) Then
        Return first.Equals(second)
    End If
   End Function

更新:以下 JavaScript 代码可以正常工作,因为它会检查下拉列表中是否存在重复值。但是,如何将其链接到我的自定义验证器并消除警报消息。就目前而言,页面已提交。谢谢。

  function dropDownValidation_ClientValidate() { 

    var strValue1 = document.getElementById('ctl00_ContentPlaceHolder1_DropDownList1');  
    var strValue2 = document.getElementById('ctl00_ContentPlaceHolder1_DropDownList2'); 
    var strValue3 = document.getElementById('ctl00_ContentPlaceHolder1_DropDownList3'); 
    var strValue4 = document.getElementById('ctl00_ContentPlaceHolder1_DropDownList4'); 

         var result = haveSameValue(strValue1.value, strValue2.value) &&
          haveSameValue(strValue1.value, strValue3.value) &&
          haveSameValue(strValue1.value, strValue4.value) &&
          haveSameValue(strValue2.value, strValue3.value) &&
          haveSameValue(strValue2.value, strValue4.value) &&
          haveSameValue(strValue3.value, strValue4.value);

          return result; 


           }

function haveSameValue(ddlValue1, ddlValue2) {

  if (ddlValue1 != null && ddlValue1 != '' && ddlValue2 != null && ddlValue2 != '' && ddlValue1 == ddlValue2){
    alert("Related documents contain duplicate values");

    }

}
4

3 回答 3

0

不使用任何库(如 jQuery),最简单的方法可能是这样的:

HTML:

<select id="dropdown1">
    <option value="1">One</option>
    <option value="2">Two</option>
    <option value="3">Three</option>
    <option value="4">Four</option>
</select>
<select id="dropdown2">
    <option value="1">One</option>
    <option value="2">Two</option>
    <option value="3">Three</option>
    <option value="4">Four</option>
</select>
<select id="dropdown3">
    <option value="1">One</option>
    <option value="2">Two</option>
    <option value="3">Three</option>
    <option value="4">Four</option>
</select>
<select id="dropdown4">
    <option value="1">One</option>
    <option value="2">Two</option>
    <option value="3">Three</option>
    <option value="4">Four</option>
</select>
<button id="submitbutton">Submit</button>

JavaScript 验证器:

var validator = function() {
    var objChosenItems = {};
    var strDuplicateItem = null;
    for (var i = 1; i <= 4; i++) {
        var strValue = document.getElementById('dropdown' + i.toString()).value;
        if (objChosenItems[strValue]) {
            strDuplicateItem = strValue;
            break;
        }
        objChosenItems[strValue] = true;
    }
    if (strDuplicateItem === null) {
        return true;
    }
    else {
        alert("DUPLICATE ITEM: " + strDuplicateItem);
        return false;
    }
};

您需要连接validator到按钮,这可能是一个<input type="submit/image/etc" />或一个<button>或几个其他东西。无论是什么,您都可以将onclick事件绑定到元素。例如:

document.getElementById('submitbutton').onclick = validator;

或者

<input type="button" onclick="validator()" />

或者

<form action="mysite.aspx" method="post" onsubmit="validator()">
于 2010-09-07T12:23:08.607 回答
0

这是旧的,但我想在这里给出一个答案,因为我在谷歌搜索类似问题时得到了答案。

在您的 Javascript 函数中,它将采用 2 个参数,source 和 args。您希望根据验证是否成功将 args.IsValid 设置为 true 或 false。如果您正在验证特定字段,则 args.Value 将是正在验证的表单字段的值。

检查表单是否等于“1”的简单验证器函数如下所示:

function validateThis(source, args) { 
    if (args.Value == "1") 
        args.IsValid = true; 
    else 
        args.IsValid = false;
}

将其与上述答案结合并设置 args.IsValid 而不是 return,您应该得到答案。

更多信息可以在这篇 4guysfromrolla.com 文章中找到。

于 2011-07-22T20:50:59.423 回答
0

我认为你需要这种东西:

<asp:CustomValidator id="CustomValidator1" runat="server" 
    ErrorMessage = "Same related document was entered more than once" 
    OnServerValidate="dropDownValidation_ServerValidate" Display="Dynamic"
    ClientValidationFunction="dropDownValidation_ClientValidate();">
</asp:CustomValidator>

<script type="text/javascript">
    function dropDownValidation_ClientValidate() {
        var result =
            (haveSameValue('<%= DropDownList1.ClientID %>', '<%= DropDownList2.ClientID %>') == false) &&
            (haveSameValue('<%= DropDownList2.ClientID %>', '<%= DropDownList3.ClientID %>') == false) &&
            (haveSameValue('<%= DropDownList3.ClientID %>', '<%= DropDownList4.ClientID %>') == false) &&
            (haveSameValue('<%= DropDownList4.ClientID %>', '<%= DropDownList5.ClientID %>') == false);
        return result;
    }

    function haveSameValue(ddl1, ddl2) {
        var result = false;
        var value1 = document.getElementById(ddl1).value;
        var value2 = document.getElementById(ddl2).value;

        if (value1 != null && value1 != '' && value2 != null && value2 != '' && value1 == value2) {
            result = true;
        }
        return result;
    }
</script>

你能检查它是否有效吗?

于 2010-09-07T13:20:42.937 回答