Функция проверки клиента клиента CustomValidator не срабатывает

Question

Я думал, что то, что я пытаюсь сделать, было довольно тривиально, но, похоже, это меня сильно беспокоило. Вот ситуация.

У меня есть два переключателя (реализованы с использованием RadButton) и RadTextBox. Я хочу проверить на клиенте перед отправкой формы, в которой RadTextBox не пуст, когда выбран один из двух переключателей (скажем, первый). Я использовал CustomValidator, и я установил ValidateEmptyText = «True», чтобы не повезло. Экстракт код ниже:

<asp:Panel runat="server" ID="Panel1"> 
<table> 
    <tr> 
     <td class="auto-style5"> 
      <telerik:RadButton ID="rdBtnIndividual" runat="server" AutoPostBack="False" GroupName="rdEmplrType" 
       Text="Individual" ToggleType="Radio" OnClientCheckedChanged="rdBtnPhysical_CheckedChanged" 
       UseSubmitBehavior="False"> 
       <ToggleStates> 
        <telerik:RadButtonToggleState PrimaryIconCssClass="rbToggleRadioChecked" /> 
        <telerik:RadButtonToggleState PrimaryIconCssClass="rbToggleRadio" /> 
       </ToggleStates> 
      </telerik:RadButton> 
     </td> 
     <td> 
      <telerik:RadButton ID="rdBtnLegal" runat="server" AutoPostBack="False" GroupName="rdEmplrType" Text="Legal Entity" 
       ToggleType="Radio" OnClientCheckedChanged="rdBtnLegal_CheckedChanged" UseSubmitBehavior="False"> 
       <ToggleStates> 
        <telerik:RadButtonToggleState PrimaryIconCssClass="rbToggleRadioChecked" /> 
        <telerik:RadButtonToggleState PrimaryIconCssClass="rbToggleRadio" /> 
       </ToggleStates> 
      </telerik:RadButton> 
     </td> 
    </tr> 
    <tr> 
     <td class="auto-style5"> 
      <label>Name:</label> 
     </td> 
     <td> 
      <telerik:RadTextBox ID="txtName" Runat="server" EmptyMessage="Name" LabelWidth="64px" Resize="None" Width="160px" DisabledStyle-BackColor="Silver"> 
      </telerik:RadTextBox> 
     </td> 
     <td><asp:RequiredFieldValidator ID="THIS_IS_WORKING" ControlToValidate="txtName" 
       runat="server" ErrorMessage="<img src='images/Exclamation.png' Title='Required Field'/>" > 
      </asp:RequiredFieldValidator> 
     </td> 
    </tr> 
    <tr> 
     <td class="auto-style5"> 
      <label>Father's Name</label> 
     </td> 
     <td style="width:100px"> 
      <telerik:RadTextBox ID="txtFathersName" Runat="server" EmptyMessage="Father's Name" LabelWidth="64px" Resize="None" Width="160px" DisabledStyle-BackColor="Silver"> 
      </telerik:RadTextBox> 
     </td> 
     <td> 
      <asp:CustomValidator runat="server" ID="NOT_WORKING_VALIDATOR" ControlToValidate="txtFathersName" ValidateEmptyText="True" 
       ClientValidationFunction="RequiredIfIndividual" 
       ErrorMessage="<img src='images/Exclamation.png' Title='Required Field'/>" EnableClientScript="True"> 
      </asp:CustomValidator> 

     </td> 
    </tr> 
</table> 
</asp:Panel> 

Javascript ниже:

<script type="text/javascript"> 
    function RequiredIfIndividual(sender, args) { 
     var chkBoxIndividual = $find("<%=rdBtnIndividual.ClientID%>"); 
     chkBoxIndividual = $telerik.toButton(chkBoxIndividual); 
     if (chkBoxIndividual.get_checked()) { 
      if (args.Value == "") { 
       args.IsValid = false; 
      } 
      else { 
       args.IsValid = true; 
      } 
     } else { 
      args.IsValid = true; 
     } 
    } 

</script> 

Answer 1

Проведя некоторое время, чтобы решить эту проблему, мне удалось найти основную причину проблемы.

Проблема связана с новым ненавязчивым режимом проверки .NET 4.5. Для правильной работы jQuery 2.0 требуется. Это стандарт в .NET 4.5. Однако встроенная версия jQuery в RadControls (до, по крайней мере, версии 2013Q3), является v1.9.1 (см. here). В результате CustomValidator не работает должным образом.

Есть две альтернативы этому - я только попробовал первый с успехом:

1. Отключить режим ненавязчивый проверки. Для этого вам необходимо включить следующую строку в <appSettings> секции файла web.config:

   <add key="ValidationSettings:UnobtrusiveValidationMode" value="None" />

   Обратное: Режим Ненавязчивых проверок разработан, чтобы сделать се новых возможностей HTML5 для того, чтобы устранить яваскрипт кода сгенерированный для выполнения валидаций, что приводит к более легким страницам (см. here). Отключив его, вы не используете эту функцию.

2. Выберите, чтобы не использовать встроенную версию jQuery для RadControls (т. Е. V1.9.1) и использовать тот, который предоставляется .NET 4.5 (то есть v2.0).

   The Downside: Проблема в том, что RadControls были протестированы с использованием встроенной версии jQuery, и вы можете столкнуться с проблемами. Для того, чтобы отключить встроенную версия JQuery, пожалуйста, обратитесь к this link

Надеется, что это поможет следующему человеку, который будет наткнуться на эту же проблему.

Answer 2

Вам нужно вручную вызвать функцию ValidatorValidate и передать экземпляр валидатора внутри rdBtnPhysical_CheckedChanged и rdBtnLegal_CheckedChanged обработчиков. Я подготовил для вас короткий пример:

<script type="text/javascript"> 
      function RequiredIfIndividual(sender, args) { 
       var chkBoxIndividual = $find("<%=rdBtnIndividual.ClientID%>"); 
       chkBoxIndividual = $telerik.toButton(chkBoxIndividual); 
       if (chkBoxIndividual.get_checked()) { 
        if (args.Value == "") { 
         args.IsValid = false; 
        } 
        else { 
         args.IsValid = true; 
        } 
       } else { 
        args.IsValid = true; 
       } 
      } 

      function rdBtnPhysical_CheckedChanged(sender, args) { 
       ValidatorValidate($get("NOT_WORKING_VALIDATOR")); 
      } 

      function rdBtnLegal_CheckedChanged(sender, args) { 
       ValidatorValidate($get("NOT_WORKING_VALIDATOR")); 
      } 

     </script> 

Я только что протестировал код и, похоже, работает нормально.