更改输入文本框类电平变化的下拉列表(Change input class of textbox on

我有在下拉列表中的数据变化如何改变输入类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="" />`

因为我用的jQuery的验证

我有电子邮件和电话号码在我的DropDownList

我想，当我在下拉列表中选择电子邮件来验证，这将允许电子邮件格式文本框，当我选择在我的下拉列表中的电话号码...

这将只允许手机格式这是我使用的类

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

玩弄我的代码，看看你的作品。 有jQuery的API网站上的许多例子。

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]]");
    }
});

文章来源: Change input class of textbox onchange dropdown List