从ASP.NET MVC中的第二个下拉列表中选择值后，第二个下拉列表未显示 [英] 2nd dropdown not displaying after selecting the value from 2nd dropdown in ASP.NET MVC
本文介绍了从ASP.NET MVC中的第二个下拉列表中选择值后，第二个下拉列表未显示的处理方法，对大家解决问题具有一定的参考价值，需要的朋友们下面随着小编来一起学习吧！
问题描述
我在asp.net mvc中使用级联下拉列表。当从第一个下拉列表中选择值时，列表显示在第二个下拉列表中，但是当我从第二个下拉列表中选择值时，它会在下拉列表中显示，但在单击提交按钮后，它将消失，显示从列表中选择。请有人帮我克服这个错误....代码如下：
查看.....
< div class = 行表单组 >
< div class = col-md-6 >
@Html .LabelFor（model => model.Religion_Id，new {@class =control-label}）
< div class = 输入组 >
< span < span class =code-attribute> class = input-group-addon style = background：white >
< < span class =code-leadattribute> i class = fa fa-cloud style = c olor：＃179CDC; > < / i >
< / span >
@ Html.DropDownListFor（model => model.Religion_Id，Model.Religion，Select From List，new {@class =form-control select2me，@ id =ddlReligion}）
< / div >
@ Html.ValidationMessageFor（model => model .Religion_Id，string.Empty，new {@class =small text-danger text-uppercase}）
< / div >
< div class = col-md-6 >
@ Html.LabelFor（ model => model.Sect_Id，new {@class =control-label}）
< div class = input-group >
< span class = input-group-addon 样式 = background：white >
< i class = fa fa-cloud 样式 = 颜色：＃179CDC; > < / i >
< / span >
< div id = Sects >
@ Html.DropDownListFor（model => model.Sect_Id，new List < SelectListItem > （），选择表单列表，新{@class =form-control select2me，@ id =ddlSect}）
< / div >
< / div >
@ Html.ValidationMessageFor（model => model .Sect_Id，string.Empty，new {@class =small text-danger text-uppercase}）
< / div >
< / div >
< scr ipt >
$（ document ）。ready（ function （）{
loadSect（）;
}）;
var loadSect = function （flag）{
if （ undefined == typeof （flag））{
flag = true ;
}
$ .ajax（{
type： post，
url：' @ Url.Action（GetSects，MyProfile，new {area = Candidate}）'，
数据：{religionId：$（' ＃ddlReligion' ）。val（）}，
数据类型： json，
traditional： true ，
成功：功能（数据）{
var district = < select id ='ddlSect' class ='form-control text-uppercase select2me'name ='Sect_Id'>;
district = district + ' < option value =>从列表中选择& LT; /选项>';
for （ var i = 0 ; i< data.length; i ++）{
district = district + ' < option value =' + data [i] .Value + ' >' + data [i ] .Text + ' < / option>';
}
district = district + ' < / select>';
$（' ＃Sects'）。html（district）;
if （flag）{
setOption（$（'' #Sects select'）[ 0 ]，$（' ＃HSPEC_ID'）。val（））
}
if （jQuery（）。select2）{
$（' #Sects .select2me'）。select2（{
占位符： 选择一个选项，
allowClear： true
}）;
}
}
}）;
};
$（' #ddlReligion'）。change（ function （）{
loadSect（ false ）;
}）;
function setOption（selectElement，value）{
var options = selectElement.options;
for （ var i = 0 ，optionsLength = options.length; i< optionsLength; i ++）{
if （options [i] .value == value）{
selectElement.selectedIndex = i;
return true ;
}
}
返回 false ;
}
我的尝试：
上面提到了所有内容，并且还提供了代码
解决方案
（ document ）。 ready（ function （）{
loadSect（）;
}）;
var loadSect = function （flag）{
if （ undefined == typeof （flag））{
flag = true ;
}
.ajax（{
type： post，
url：' @ Url.Action（GetSects，MyProfile ，new {area =Candidate}）'，
data：{religionId：
（' #ddlReligion'）。val（）}，
数据类型： json，
traditional： true ，
成功：功能（数据）{
var district = < select id ='ddlSect'class ='form-control text-uppercase select2me'name ='Sect_Id'>;
district = district + ' < option value =>选择From List< / option>';
for （ var i = 0 ; i< data.length; i ++）{
district = district + ' < option value =' + data [i] .Value + ' >' + data [i ] .Text + ' < / option>';
}
分区=分区+ ' < / select>';
i am using cascading dropdownlist in asp.net mvc. when value is selected from first dropdown, the list is shown in 2nd dropdown but when i select the value from 2nd dropdown it shows in the dropdown but after clicking the submit button it disappears showing "Select from List". Please can someone help me to overcome this error.... the code is given below...
View.....
<div class="row form-group">
<div class="col-md-6">
@Html.LabelFor(model => model.Religion_Id, new { @class = "control-label" })
<div class="input-group">
<span class="input-group-addon" style="background:white">
<i class="fa fa-cloud" style="color:#179CDC;"></i>
</span>
@Html.DropDownListFor(model => model.Religion_Id, Model.Religion, "Select From List", new { @class = "form-control select2me", @id = "ddlReligion" })
</div>
@Html.ValidationMessageFor(model => model.Religion_Id, string.Empty, new { @class = "small text-danger text-uppercase" })
</div>
<div class="col-md-6">
@Html.LabelFor(model => model.Sect_Id, new { @class = "control-label" })
<div class="input-group">
<span class="input-group-addon" style="background:white">
<i class="fa fa-cloud" style="color:#179CDC;"></i>
</span>
<div id="Sects">
@Html.DropDownListFor(model => model.Sect_Id, new List<SelectListItem>(), "Select Form List", new { @class = "form-control select2me", @id = "ddlSect" })
</div>
</div>
@Html.ValidationMessageFor(model => model.Sect_Id, string.Empty, new { @class = "small text-danger text-uppercase" })
</div>
</div>
<script>
$(document).ready(function () {
loadSect();
});
var loadSect = function (flag) {
if ("undefined" == typeof (flag)) {
flag = true;
}
$.ajax({
type: "post",
url: '@Url.Action("GetSects", "MyProfile", new { area = "Candidate" })',
data: { religionId: $('#ddlReligion').val() },
datatype: "json",
traditional: true,
success: function (data) {
var district = "<select id='ddlSect' class='form-control text-uppercase select2me' name='Sect_Id'>";
district = district + '<option value="">Select From List</option>';
for (var i = 0; i < data.length; i++) {
district = district + '<option value=' + data[i].Value + '>' + data[i].Text + '</option>';
}
district = district + '</select>';
$('#Sects').html(district);
if (flag) {
setOption($('#Sects select')[0], $('#HSPEC_ID').val())
}
if (jQuery().select2) {
$('#Sects .select2me').select2({
placeholder: "Select an option",
allowClear: true
});
}
}
});
};
$('#ddlReligion').change(function () {
loadSect(false);
});
function setOption(selectElement, value) {
var options = selectElement.options;
for (var i = 0, optionsLength = options.length; i < optionsLength; i++) {
if (options[i].value == value) {
selectElement.selectedIndex = i;
return true;
}
}
return false;
}
What I have tried:
everything is mentioned above and code is also provided
解决方案
(document).ready(function () { loadSect(); }); var loadSect = function (flag) { if ("undefined" == typeof (flag)) { flag = true; }
.ajax({ type: "post", url: '@Url.Action("GetSects", "MyProfile", new { area = "Candidate" })', data: { religionId:
('#ddlReligion').val() }, datatype: "json", traditional: true, success: function (data) { var district = "<select id='ddlSect' class='form-control text-uppercase select2me' name='Sect_Id'>"; district = district + '<option value="">Select From List</option>'; for (var i = 0; i < data.length; i++) { district = district + '<option value=' + data[i].Value + '>' + data[i].Text + '</option>'; } district = district + '</select>';
这篇关于从ASP.NET MVC中的第二个下拉列表中选择值后，第二个下拉列表未显示的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
查看全文
