根据下拉列表值删除字段RSS 0回复以电子邮件订阅
Remove fields according to drop down list value RSS 0 replies Subscribe via Email
我有以下代码,我希望当用户将下拉值从A更改为B时,
的字段用户和密码(标签和文本框)将被省略,我怎么做?
这是模型
public class Ad
{
[Key]
[Required]
[DatabaseGenerated(DatabaseGeneratedOption.None)]
public int ID { get; set; }
[RegularExpression(@"^[a-zA-Z]*$", ErrorMessage = "Invalid User")]
public string Name { get; set; }
public string User { get; set; }
public string Password { get; set; }
public string Type { get; set; }
public IEnumerable<SelectListItem> Types
{
get
{
return new[]
{
new SelectListItem {Value = "A", Text = "A"},
new SelectListItem {Value = "A", Text = "B"},
new SelectListItem {Value = "A", Text = "C"}
};
}
}
}
这是视图
<div class="form-horizontal">
<h4>Ad</h4>
<hr />
@Html.ValidationSummary(true)
<div class="form-group">
@Html.LabelFor(model => model.ID, new { @class = "control-label col-md-2" })
<div class="col-md-10">
@Html.EditorFor(model => model.ID)
@Html.ValidationMessageFor(model => model.ID)
</div>
</div>
<div class="form-group">
@Html.LabelFor(model => model.Name, new { @class = "control-label col-md-2" })
<div class="col-md-10">
@Html.EditorFor(model => model.Name)
@Html.ValidationMessageFor(model => model.Name)
</div>
</div>
<div class="form-group">
@Html.LabelFor(model => model.Type, new { @class = "control-label col-md-2" })
<div class="col-md-10">
@Html.DropDownListFor(model => model.Type, Model.Types)
</div>
</div>
<div class="form-group">
@Html.LabelFor(model => model.User, new { @class = "control-label col-md-2" })
<div class="col-md-10">
@Html.EditorFor(model => model.User)
@Html.ValidationMessageFor(model => model.User)
</div>
</div>
<div class="form-group">
@Html.LabelFor(model => model.Password, new { @class = "control-label col-md-2" })
<div class="col-md-10">
@Html.EditorFor(model => model.Password)
@Html.ValidationMessageFor(model => model.Password)
</div>
</div>
<div class="form-group">
<div class="col-md-offset-2 col-md-10">
<input type="submit" value="Create" class="btn btn-default" />
</div>
</div>
Page source
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Create - My ASP.NET Application</title>
<link href="/Content/bootstrap.css" rel="stylesheet"/>
<link href="/Content/site.css" rel="stylesheet"/>
<script src="/Scripts/modernizr-2.6.2.js"></script>
</head>
<body>
<div class="navbar navbar-inverse navbar-fixed-top">
<div class="container">
<div class="navbar-header">
<button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-collapse">
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</button>
<a class="navbar-brand" href="/">Application name</a>
</div>
<div class="navbar-collapse collapse">
<ul class="nav navbar-nav">
<li><a href="/">Home</a></li>
<li><a href="/Home/About">About</a></li>
<li><a href="/Home/Contact">Contact</a></li>
</ul>
</div>
</div>
</div>
<div class="container body-content">
<h2>Create</h2>
<script src="http://code.jquery.com/jquery-1.11.0.min.js"></script>
<script type="text/javascript">
$(document).ready(function () {
debugger;
$('select[name="Type"]').change(function () {
if ($(this).val() === 'p') {
$('input[name="User"]').prop("disabled", true);
$('input[name="Password"]').prop("disabled", true);
}
else {
$('input[name="User"]').prop("disabled", false);
$('input[name="Password"]').prop("disabled", false);
}
});
});
$('select#Type').change(function () {
$('#selectedOne').val($(this).val());
});
</script>
<form action="/ad/Create" method="post"><input name="__RequestVerificationToken" type="hidden" value="FGle3vl5PfpKQK76_Bb02PVaNQqS9K1MdIl__r7kNxsiNGueP9tkc4qvqQQ46EWXdiKO2iMKOYJzRXMk9IDAEi-vdA0VEuv4OfLC0nym94g1" /> <div class="form-horizontal">
<h4>Ad</h4>
<hr />
<div class="form-group">
<label class="control-label col-md-2" for="ID">ID</label>
<div class="col-md-10">
<input class="text-box single-line" data-val="true" data-val-number="The field ID must be a number." data-val-required="The ID field is required." id="ID" name="ID" type="number" value="0" />
<span class="field-validation-valid" data-valmsg-for="ID" data-valmsg-replace="true"></span>
</div>
</div>
<div class="form-group">
<label class="control-label col-md-2" for="Name">Name</label>
<div class="col-md-10">
<input class="text-box single-line" data-val="true" data-val-regex="Invalid User" data-val-regex-pattern="^[a-zA-Z]*$" id="Name" name="Name" type="text" value="" />
<span class="field-validation-valid" data-valmsg-for="Name" data-valmsg-replace="true"></span>
</div>
</div>
<div class="form-group">
<label class="control-label col-md-2" for="Type">Type</label>
<div class="col-md-10">
<select id="Type" name="Type"><option value="A">A</option>
<option value="A">B</option>
<option value="A">C</option>
</select>
</div>
</div>
<div class="form-group">
<label class="control-label col-md-2" for="User">User</label>
<div class="col-md-10">
<input class="text-box single-line" id="User" name="User" type="text" value="" />
<span class="field-validation-valid" data-valmsg-for="User" data-valmsg-replace="true"></span>
</div>
</div>
<div class="form-group">
<label class="control-label col-md-2" for="Password">Password</label>
<div class="col-md-10">
<input class="text-box single-line" id="Password" name="Password" type="text" value="" />
<span class="field-validation-valid" data-valmsg-for="Password" data-valmsg-replace="true"></span>
</div>
</div>
<div class="form-group">
<div class="col-md-offset-2 col-md-10">
<input type="submit" value="Create" class="btn btn-default" />
</div>
</div>
</div>
</form>
<div>
<a href="/ad">Back to List</a>
</div>
<hr />
<footer>
<p>© 2014 - My ASP.NET Application</p>
</footer>
</div>
<script src="/Scripts/jquery-1.10.2.js"></script>
<script src="/Scripts/bootstrap.js"></script>
<script src="/Scripts/respond.js"></script>
<script src="/Scripts/jquery.unobtrusive-ajax.js"></script>
<script src="/Scripts/jquery.validate.js"></script>
<script src="/Scripts/jquery.validate.unobtrusive.js"></script>
<!-- Visual Studio Browser Link -->
<script type="application/json" id="__browserLink_initializationData">
{"appName":"Chrome","requestId":"499bf8fae4db48ef9af85e995c0d0cac"}
</script>
<script type="text/javascript" src="http://localhost:49339/ae4883a652ba49be983288d0f9770745/browserLink" async="async"></script>
<!-- End Browser Link -->
</body>
</html>
在HTML源代码中,已经有一些处理下拉菜单更改的功能。您需要稍微修改一下:
你可以从修改
开始$(this).val() === 'p'
这:
$(this).val() === 'A'
如果不符合您的需要,请尝试像这样完全隐藏元素:
$('select[name="Type"]').change(function () {
if ($(this).val() === 'A') {
$('input[name="User"]').parents('.form-group').hide();
$('input[name="Password"]').parents('.form-group').hide();
}
else {
$('input[name="User"]').parents('.form-group').show();
$('input[name="Password"]').parents('.form-group').show();
}
});
相关文章:
- 如果我在javascript中输入无效的电子邮件或空白,如何显示特定的文本框边框红色
- 使用angularjs验证文本框中的电子邮件
- 使用正则表达式评估电子邮件地址时出现性能问题
- javascript中添加验证电子邮件的问题
- 如何在收到电子邮件时自动调用脚本
- 获取屏幕截图并在电子邮件中发送的按钮
- 将项目履行与高级模板合并,并通过电子邮件发送至Netsuite 2.0
- php&js-将电子邮件添加到输入文本中
- 将用户制作的SVG(raphael.js)发送到服务器(php),以便通过电子邮件发送
- 以PDF附件的形式通过电子邮件发送谷歌文档
- 将Meteor中的base64 PDF作为电子邮件附件
- 来自现场目的的Meteor电子邮件.send()
- 将回复电子邮件地址更改为队列's在动态crm 2011中的电子邮件地址
- 是否可以通过电子邮件将无线电输入的结果直接回复给我?是/否
- 表单以HTML电子邮件回复
- 电子邮件被回复到收件人而不是发件人或回复地址
- 我如何使回复电子邮件是从提交的人(谷歌应用程序脚本)
- 根据下拉列表值删除字段RSS 0回复以电子邮件订阅
- 在电子邮件文本中添加一个按钮,以a)自动回复,或b)转到链接
- 通过电子邮件发送和收集调查回复的技术