Пользовательский валидатор превращает текст в красный цвет

Question

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

function ButtonClick(session, args, textBoxId, labelId) { 
$(document).ready 
    (
     function() { 

      var is_valid = $("#" + textBoxId).val() != ""; 
      $("#" + labelId).css("color", is_valid ? "#686868" : "red"); 
      args.IsValid = is_valid; 
     } 
    ); 
} 

Здесь я перевожу этикетку красного цвета, которая была передана в функцию. Мне также нужно передать в группу проверки, что соответствует этому валидатору. Я не уверен, как переключить другие метки на серый, когда группа проверки включена. Прямо сейчас у меня есть две кнопки и две пары ярлыков/текстовых полей. Каждый из них находится в собственной группе проверки. Когда я нажимаю кнопку один, все работает отлично. Ярлык 1 красный. Когда я нажимаю кнопку два, label2 становится красным. Метка 1 не возвращается к серому. Мне нужно, чтобы он стал серым. Мне нужно общее решение, которое будет работать для нескольких групп проверки.

Я не знаю, как получить доступ к группам проверки через jQuery.

Благодаря

<div class="formLabel"> 
         <asp:Label ID="lblClientId" runat="server" CssClass="text" meta:resourcekey="lblClientIdResource" /> 
        </div> 
        <div class="formValue"> 
         <asp:TextBox ID="tbClientId" runat="server" CssClass="text" meta:resourcekey="tbClientIdResource" /> 
         <asp:CustomValidator ID="rfvClientId" runat="server" ValidationGroup="ClientId" meta:resourcekey="rfvClientIdResource" ControlToValidate="tbClientId" ClientValidationFunction="BtnClickClientId" style="position:absolute;" ValidateEmptyText="True" ><asp:Image ID="Image2" ImageUrl="caution_20.png" runat="server" /></asp:CustomValidator> 
        </div> 

<script src="../../Scripts/Test.js" type="text/javascript"></script> 
    <script type="text/javascript"> 
     function BtnClickClientId(session, args) { 
      ButtonClick(session, args, "<%= tbClientId.ClientID %>", "<%= lblClientId.ClientID %>"); 
     } 
     function BtnClickLastName(session, args) { 
      ButtonClick(session, args, "<%= tbSearchLastName.ClientID %>", "<%= lblSearchLastName.ClientID %>"); 
     } 
    </script> 

Answer 1

Я не знаком с тегами ASP, но я уверен, что <asp:Label> генерирует HTML <label> тег. Так что в этом случае я могу предложить следующее:

function ButtonClick(session, args, textBoxId, labelId) { 
    $(document).ready (
     function() { 
      // $(".formLabel label").css("color", "#686868"); 

      // this one will work independently from ASP generated tags 
      $(".formLabel").css("color", "#686868"); 

      var is_valid = $("#" + textBoxId).val() != ""; 
      $("#" + labelId).css("color", is_valid ? "#686868" : "red"); 
      args.IsValid = is_valid; 
     } 
    ); 
} 

этим сначала вы настройка по умолчанию «# 686868» цвета для всех ярлыков, а затем делают вашу проверку.

Answer 2

Как насчет того, чтобы связать яваскрипт функцию кнопок, которая выполняет первую и сбрасывает цвет всех текстовых полей на странице? Если есть другие текстовые поля на странице, что вы не хотите, чтобы повлиять, вы можете ориентировать их классом, например, ваш текст одного:

function ResetValidationStates() 
{ 
    $(".text").each(function() { $(this).css("color", "#686868"); }); 
} 

Дополнительно, вместо установки цвета встроенного в вашем коде, почему бы вам не создать классы в вашем файле CSS, а затем использовать методы jQueryи .removeClass(className) для установки классов, которые вы хотите в своих текстовых окнах? Таким образом, если вы придете изменить внешний вид своего сайта, вы не сможете зарыться через Javascript, чтобы внести изменения.