我有一个用户两次的patialview
Parialview:
<divclass="row Address2">
<divclass="col-sm-4">
<divclass="md-form">
@Html.DropDownListFor(m=>m.StateId,Model.States,"--SelectState--",new{@id="addressState",@class="posT mdb-select",@autocomplete="off"})
</div>
</div>
<divclass="col-sm-4">
<divclass="md-form">
<divclass="loader-div">
@Html.TextBoxFor(m=>m.City,new{@id="addressCity",@autocomplete="off",@class="form-control Clr"})
</div>
</div>
</div>
<divclass="col-sm-4">
<divclass="md-form">
<divclass="loader-div">
@Html.TextBoxFor(m=>m.Zipcode,new{@id="addressZipcode",@autocomplete="off",@class="form-control Clr",})
</div>
</div>
</div>
</div>
现在我想根据状态下拉列表更改删除状态和邮政编码。
假设我选择上面的下拉列表然后它应该删除上面或当前的div状态和邮政编码 如果我选择下面的下拉列表而不是下面的状态,则应删除zipcode。
但是在我的情况下,当我选择下面的下拉时间时,它总是在上面清楚。 我的java脚本如下所示。
$(".mdb-select").change(function(){
if($(this).closest('.Address2').find('#addressState').val()==''){
$(this).closest('.Address2').find('#addressCity').val("");
$(this).closest('.Address2').find('#addressZipcode').val("");
//$(this).parents('.Address2').find('#addressCity').val("");
//$(this).parents('.Address2').find('#addressZipcode').val("");
}
}
})
我已经绑定了像这样的部分视图
@Html.Partial("_AddressPartial", feedback.AddressProperty, new ViewDataDictionary() { TemplateInfo = new TemplateInfo() { HtmlFieldPrefix = "AddressProperty" } })
and
@Html.Partial("_AddressPartial", feedback.EscrowProperty, new ViewDataDictionary() { TemplateInfo = new TemplateInfo() { HtmlFieldPrefix = "EscrowProperty" } })
并尝试通过JQ以下删除 $(本).closest(&#39; .Address2&#39)。发现(&#39; .Clr&#39;)VAL(&#34;&#34);
但结果相同。
答案 0 :(得分:1)
您对HtmlFieldPrefix
的使用正确地生成了唯一的id
属性,但您使用new { @id=".." }
会覆盖该属性并生成重复的id
属性,这些属性是无效的html,以及您的jquery选择器只会选择第一个。
将其更改为使用类名和相对选择器
@Html.DropDownListFor(m => m.StateId, Model.States,"--SelectState--", new { @class="posT mdb-select", @autocomplete="off"})
@Html.TextBoxFor(m => m.City, new { @class="city form-control Clr", @autocomplete="off",})
@Html.TextBoxFor( m=> m.Zipcode, new {@class="zipcode form-control Clr", @autocomplete="off" })
然后脚本变为
$('.mdb-select').change(function() {
var state = $(this).val();
var container = $(this).closest('.Address2');
container.find('.city').val('');
container.find('.zipcode').val('');
});
作为旁注,使用EditorTemplate
生成控件更容易。假设您的班级为Address.cs
,则将您的部分重命名为/Views/Shared/EditorTemplates/Address.cshtml
(即匹配班级名称),然后在主视图中将其变为
@Html.EditorFor(m => m.AddressProperty)
@Html.EditorFor(m => m.EscrowProperty)