Изменить класс ввода текстового поля onchange. Список

Question

У меня возникла проблема с тем, как изменить класс ввода CheckBox при изменении данных в раскрывающемся списке.

Это мой HTML разметка:

  <p> 
      <label for="ddlContType"> 
       Contact Type</label> 
      <span> 
       @Html.DropDownList("ddlContType", new SelectList(ViewBag.ContTypeList, "ID", "Display_Value",ContType), "[Please Select]", 
      new Dictionary<string, object> 
      { 
       {"class","validate[required] inputLong"} 
      }) 
      </span> 
     </p> 
     <p> 
      <label for="txtContValue"> 
       Contact Value</label> 
      <span> 
       <input type="text" id="txtContValue" name="txtContValue" class="validate[required] inputLong" 
        value="" />` 

Поскольку я использовал Validate из JQuery

Я электронной почты и номер телефона на моем DropDownList

Я хочу проверки, когда я выбираю Email в моем раскрывающемся списке, это позволит использовать текстовое поле «Формат электронной почты» и «Когда я выберу номер телефона на моем раскрывающемся списке».

Это позволит только Phone F Ormat Это класс я использую

class="validate[required,custom[email]] 

и

class="validate[required,custom[phone]] 

Answer 1

Я не уверен, как выглядит результат вашего выпадающего списка. Позвольте мне предположить, что это выглядит примерно так:

<select id="ddlContType" name="ddlContType"> 
    <option value="">-- Select --</option> 
    <option value="1">E-mail</option> 
    <option value="2">Phone Number</option> 
</select> 

Чтобы быть в состоянии обнаружить изменения, что нужно добавить слушатель изменения по выбору ваших Опуститесь в. Я использую jQuery, потому что я знаком с ним. Вы можете использовать любую инфраструктуру JavaScript, с которой вы знакомы (или просто обычный JavaScript).

$(document).ready(function() { 
    $('#ddlContType').change(function() { 
      // This will bring back either a 1 or a 2 
      var commType = $('#ddlContType').val(); 
      // Just to confirm 
      alert('commType = ' + commType); 

      // Get a reference to the textbox 
      var txtContValue = $('txtContValue'); 

      if (commType == '1') { 
       txtContValue.attr('class', 'validate[required,custom[email]]'); 
      } 
      else if (commType == '2') { 
       txtContValue.attr('class', 'validate[required,custom[phone]]'); 
      } 
    }); 
}); 

Я буду честен, я никогда не видел, что-то вроде этого:

class="validate[required,custom[email]] 

Поиграйте с моим кодом и посмотреть, что работает для вас. На веб-сайте API jQuery много примеров.

Answer 2

Если вы хотите изменить класс, когда выпадающий список изменяется, то просто добавьте слушателя для «изменения» событие , Обработчик должен обновить класс по мере необходимости:

$("#ddlContType").on("change", function(ddl) { 
    var textEl = $("txtContValue"); 
    if ($(ddl).val() == "Email") { 
     txtEl.attr("class", "validate[required,custom[email]]"); 
    } else { 
     txtEl.attr("class", "validate[required,custom[phone]]"); 
    } 
});