MVC3根据下拉菜单上的选择锁定文本框

本文关键字:选择 锁定 文本 下拉菜单 MVC3 | 更新日期: 2023-09-27 18:24:00

我正在使用ASP MVC 3制作表单,我不仅是web开发的新手,也是ASP.NET MVC的新手。

用户将有机会从下拉菜单中选择一个给定的问题,或者编写自己的问题。

我想做的是,如果用户之前从下拉菜单中选择了任何问题,则阻止用户键入问题的文本字段。

我既可以使用JavaScript,也可以使用MVC(我更喜欢使用MVC代码,但JavaScript也可以工作)。

<tr> 
<td width="40%" height="31">
<div align="right"><strong>Security question:</strong></div>
 </td>
 <td width="60%" height="31"> 
 @Html.DropDownListFor(m => m.PickSecretQuestion, new[] {
   new SelectListItem() { Text = "---select a question --- or create your own below --", Value = "createNew"},
   new SelectListItem() { Text = "Mother's Maiden Name?", Value = "Mother's Maiden Name?"},
   new SelectListItem() { Text = "Father's Middle Name?", Value = "Father's Middle Name?"},
   new SelectListItem() { Text = "What High School did you attend?", Value = "What High School did you attend?"},
   new SelectListItem() { Text = "First company you worked for?", Value = "First company you worked for?"}
   }
    </td>  
    </tr>
     <tr> 
     <td width="40%" height="31">
     <div align="right"><strong>Or create one here:</strong></div>
     </td>
     <td width="60%" height="31"> 
         @Html.TextBoxFor(m => m.SecretQuestion)
         <span style="color:Red">  @Html.ValidationMessageFor(m => m.SecretQuestion </span>
     </td>  
     </tr>

MVC3根据下拉菜单上的选择锁定文本框

使用jQuery,这无疑要简单得多。以下是我的做法:

$('#yourDropDownId').change(function() {
    if ($(this).attr('selectedIndex') == 0)
        $('#yourTextBoxId').attr('disabled', 'disabled');
    else
        $('#yourTextBoxId').removeAttr('disabled');
});

这是真正应该在客户端上处理的逻辑,而不是访问服务器。利用jQuery的强大功能和简单性是有意义的。

在您的视图中,您可以通过使用helper方法的htmlAttributes对象来为DOM元素设置id。这是您对TextBoxFor()所做的更改。这会将您的id设置为"yourTextBoxId"。

@Html.TextBoxFor(m => m.SecretQuestion, new { id = "yourTextBoxId" })