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="" />`

因为我使用了jquery的验证

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

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

它只允许手机格式这是我正在使用的课程

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

和

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

Answer 1

如果要在更改下拉列表时更改类，则只需为“change”事件添加一个侦听器。处理程序应根据需要更新类：

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

Answer 2

我不确定下拉列表的输出是什么样的。让我假设它看起来像这样：

<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网站上有很多例子。

更改文本框onchange下拉列表的输入类

2 个答案: