Сделать текстовое поле обязательным в зависимости от раскрывающегося списка

Question

У меня есть раскрывающийся список для ранга сотрудников (например, менеджер, супервизор, член и т. Д.) И текстовое поле для имени менеджера/супервизора. По умолчанию текстовое поле не требуется, поэтому оно может быть пустым.

Однако, если выпадающим списком является «Участник», тогда мне нужно сделать текстовое поле таким, чтобы пустое значение не допускалось.

У меня уже есть требуемый идентификатор в текстовом поле, но я не знаю, как его отключить/включить в зависимости от значения в выпадающем списке.

<ASP:DROPDOWNLIST id="drpLstEmRank" tabIndex="2" runat="server" WIDTH="321"></ASP:DROPDOWNLIST> 
<asp:RequiredFieldValidator ID="valDrpLstEmRank" runat="server" ControlToValidate="drpLstEmRank" 
Display="Dynamic" EnableClientScript="False" ErrorMessage="RequiredFieldValidator" 
Font-Italic="True" Font-Names="Verdana" Font-Size="8pt" InitialValue="(Select Rank)">Please select a rank</asp:RequiredFieldValidator></TD> 

<asp:RequiredFieldValidator ID="valTbHeadName" runat="server" ControlToValidate="tbHeadName" 
Display="Dynamic" EnableClientScript="False" ErrorMessage="RequiredFieldValidator" 
Font-Italic="True" Font-Names="Verdana" Font-Size="8pt">Please input a head's name</asp:RequiredFieldValidator> 
<ASP:TEXTBOX id="tbHeadName" runat="server" WIDTH="415" HEIGHT="26" MaxLength="50"></ASP:TEXTBOX> 

Answer 1

Вы можете отключить/активировать валидатор по серверному коду в событии Page_Load следующим образом.

protected void Page_Load(object sender, EventArgs e) 
{ 
    valTbHeadName.Enabled = Request[drpLstEmRank.UniqueID] == "Member" ? true : false; 
} 

Но не забудьте добавить AutoPostBack="true" свойство вашего списка для сотрудников ранга. В противном случае он не будет работать после изменения значения dropdownlist.

Answer 2

Вот на стороне клиента Решение

$("document").ready(function(){ 
    $("drpLstEmRank").change(function(){ 
     if(this.val() == "Member"){ 
     EnableValidator("#valTbHeadName"); 
     } 
    else{ 
     DisableValidator("#valTbHeadName"); 
     } 
    }); 
}); 

//Method to disable the validator 
function DisableValidator(validatorId) { 
    var validator = $(validatorId); 
    ValidatorEnable(validator[0], false); 
} 

//Method to enable the validator 
function EnableValidator(validatorId) { 
    var validator = $(validatorId); 
    ValidatorEnable(validator[0], true); 
    validator.hide(); //hides the error message 
}