пользовательская функция клиентского валидатора

Question

У меня есть пользовательский валидатор (.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 

UPDATE: Следующий код 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"); 

    } 

} 

Answer 1

без использования каких-либо библиотек (таких, как 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()"> 

Answer 2

Вам нужно такого рода вещи, я думаю:

<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> 

Вы можете проверить, работает ли он?

Answer 3

Это старый, но я хотел бы ответить здесь, так как получил его в ответ на поиск Google по аналогичному вопросу.

В вашей функции Javascript потребуется 2 параметра, источник и аргументы. Вы хотите установить args.IsValid как true, так и false, в зависимости от того, выполнена ли проверка или нет. args.Value будет значением поля формы, которое будет проверяться, если вы проверяете конкретное поле.

Простая функция валидатор, чтобы проверить, если форма была равна «1» будет выглядеть следующим образом:

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

В сочетании с вышеперечисленными ответы и установить args.IsValid, а не возвращение, и вы должны ответьте.

Более подробную информацию можно найти в this 4guysfromrolla.com article.