在编辑期间从数据库填充级联下拉列表
Filling Cascading dropdown from database during edit
我需要帮助填写相关下拉菜单。我有输入数据时工作的依赖下拉菜单,select 状态下拉菜单和依赖下拉菜单根据状态重新加载 selected.
问题是当我想编辑时,状态已填充并从数据库中 selected,但依赖项未被填充和 selected。 onChange
函数没有被激活或命中。
这是我的代码:
<div class="form-row">
<div class="col">
<div class="form-group">
<label asp-for="Sposted"></label>
<select asp-for="Sposted"
class="form-control"
asp-items="@(new SelectList(@ViewBag.statelist, "Stateid", "Statename" ))"
onchange="sposted(this)">
</select>
</div>
</div>
<div class="col">
<div class="form-group">
<label asp-for="Pcommand"></label>
<select asp-for="Pcommand" class="form-control" id="Pcommand"
asp-items="@(new SelectList(string.Empty, "Commandid", "Cfname"))">
<option>Select ...</option>
</select>
</div>
</div>
<div class="col">
<div class="form-group">
<label asp-for="PayP"></label>
<select asp-for="PayP" id="PayP"
class="form-control"
asp-items="@(new SelectList(string.Empty, "Ppid", "Ppfull"))"></select>
</div>
</div>
</div>
2 个下拉菜单 Pcommand
和 PayP
依赖于 sposted
。同样,在编辑时,sposted
下拉列表是 selected 并从 db 填充,但不会级联到其他 2.
这是JS:
<script type="text/javascript">
//$(document).ready(function () {
//$('#Sposted').change(function () {
function sposted(stateid) {
console.log(stateid.value);
var url = '@Url.Content("~/")' + "MemberList/RetPayPoint";
//var ddlsource = "#Sposted";
//$.getJSON(url, { Stateid: $(ddlsource).val() }, function (data) {
$.getJSON(url, { Stateid: stateid.value }, function (data) {
var items = '';
$("#PayP").empty();
$.each(data, function (i, pp) {
items += "<option value='" + pp.value + "'>" + pp.text + "</option>";
});
$('#PayP').html(items);
});
}//});
// });
</script>
提前致谢。
几天后,我决定添加应该填充视图中下拉列表的控制器方法。
public IActionResult DisplayMem()
{
var statelist = _mr.GetStates().ToList();
statelist.Insert(0, new ToxState { Stateid = 0, Statename = "Select..." });
ViewBag.statelist = statelist;
var rank = _mr.GetRanks().ToList();
rank.Insert(0, new ToxRank { Rankid = 0, Fullname = "Select..." });
ViewBag.rank = rank;
//memid = memlist.FirstOrDefault().MemberId;
var obj = _mr.MemberInfo((long)_ar.FindAcc(long.Parse(HttpContext.Session.GetString("memberid"))).MemId);
return View(obj);
}
填充视图元素所需的所有信息都在 obj 中。它从 obj 中的 id 加载 selects 状态,但不会触发 onchange 来填充依赖的下拉列表。
使用 selected stateid
进行编辑时,您需要获取两个下拉列表数据,就像您使用 selected stateid
获取 PayP
数据一样:
$.getJSON(url, { Stateid: stateid.value }, function (data) {
var items = '';
$("#PayP").empty();
$.each(data, function (i, pp) {
items += "<option value='" + pp.value + "'>" + pp.text + "</option>";
});
$('#PayP').html(items);
});
您将在创建或编辑时两次调用您的函数 sposted
并传递 selected stateid
。
经过几天的研究,我似乎无法找到一种方法来强制 onchange
调用 Ajax 来动态填充相关下拉列表。因此,我从 Mateen 的第 3 条评论中得到启发,并重写了控制器中的方法,以读取将相关项目加载到 ViewBag 中。
public IActionResult DisplayMem()
{
var statelist = _mr.GetStates().ToList();
statelist.Insert(0, new ToxState { Stateid = 0, Statename = "Select..." });
ViewBag.statelist = statelist;
var rank = _mr.GetRanks().ToList();
rank.Insert(0, new ToxRank { Rankid = 0, Fullname = "Select..." });
ViewBag.rank = rank;
var obj = _mr.MemberInfo((long)_ar.FindAcc(long.Parse(HttpContext.Session.GetString("memberid"))).MemId);
ViewBag.payp = _mr.GetPayPoint(obj.Sposted.Value).ToList();
ViewBag.pcommand = _mr.GetCommand(obj.Sposted.Value).ToList();
return View(obj);
}
我需要帮助填写相关下拉菜单。我有输入数据时工作的依赖下拉菜单,select 状态下拉菜单和依赖下拉菜单根据状态重新加载 selected.
问题是当我想编辑时,状态已填充并从数据库中 selected,但依赖项未被填充和 selected。 onChange
函数没有被激活或命中。
这是我的代码:
<div class="form-row">
<div class="col">
<div class="form-group">
<label asp-for="Sposted"></label>
<select asp-for="Sposted"
class="form-control"
asp-items="@(new SelectList(@ViewBag.statelist, "Stateid", "Statename" ))"
onchange="sposted(this)">
</select>
</div>
</div>
<div class="col">
<div class="form-group">
<label asp-for="Pcommand"></label>
<select asp-for="Pcommand" class="form-control" id="Pcommand"
asp-items="@(new SelectList(string.Empty, "Commandid", "Cfname"))">
<option>Select ...</option>
</select>
</div>
</div>
<div class="col">
<div class="form-group">
<label asp-for="PayP"></label>
<select asp-for="PayP" id="PayP"
class="form-control"
asp-items="@(new SelectList(string.Empty, "Ppid", "Ppfull"))"></select>
</div>
</div>
</div>
2 个下拉菜单 Pcommand
和 PayP
依赖于 sposted
。同样,在编辑时,sposted
下拉列表是 selected 并从 db 填充,但不会级联到其他 2.
这是JS:
<script type="text/javascript">
//$(document).ready(function () {
//$('#Sposted').change(function () {
function sposted(stateid) {
console.log(stateid.value);
var url = '@Url.Content("~/")' + "MemberList/RetPayPoint";
//var ddlsource = "#Sposted";
//$.getJSON(url, { Stateid: $(ddlsource).val() }, function (data) {
$.getJSON(url, { Stateid: stateid.value }, function (data) {
var items = '';
$("#PayP").empty();
$.each(data, function (i, pp) {
items += "<option value='" + pp.value + "'>" + pp.text + "</option>";
});
$('#PayP').html(items);
});
}//});
// });
</script>
提前致谢。
几天后,我决定添加应该填充视图中下拉列表的控制器方法。
public IActionResult DisplayMem()
{
var statelist = _mr.GetStates().ToList();
statelist.Insert(0, new ToxState { Stateid = 0, Statename = "Select..." });
ViewBag.statelist = statelist;
var rank = _mr.GetRanks().ToList();
rank.Insert(0, new ToxRank { Rankid = 0, Fullname = "Select..." });
ViewBag.rank = rank;
//memid = memlist.FirstOrDefault().MemberId;
var obj = _mr.MemberInfo((long)_ar.FindAcc(long.Parse(HttpContext.Session.GetString("memberid"))).MemId);
return View(obj);
}
填充视图元素所需的所有信息都在 obj 中。它从 obj 中的 id 加载 selects 状态,但不会触发 onchange 来填充依赖的下拉列表。
使用 selected stateid
进行编辑时,您需要获取两个下拉列表数据,就像您使用 selected stateid
获取 PayP
数据一样:
$.getJSON(url, { Stateid: stateid.value }, function (data) {
var items = '';
$("#PayP").empty();
$.each(data, function (i, pp) {
items += "<option value='" + pp.value + "'>" + pp.text + "</option>";
});
$('#PayP').html(items);
});
您将在创建或编辑时两次调用您的函数 sposted
并传递 selected stateid
。
经过几天的研究,我似乎无法找到一种方法来强制 onchange
调用 Ajax 来动态填充相关下拉列表。因此,我从 Mateen 的第 3 条评论中得到启发,并重写了控制器中的方法,以读取将相关项目加载到 ViewBag 中。
public IActionResult DisplayMem()
{
var statelist = _mr.GetStates().ToList();
statelist.Insert(0, new ToxState { Stateid = 0, Statename = "Select..." });
ViewBag.statelist = statelist;
var rank = _mr.GetRanks().ToList();
rank.Insert(0, new ToxRank { Rankid = 0, Fullname = "Select..." });
ViewBag.rank = rank;
var obj = _mr.MemberInfo((long)_ar.FindAcc(long.Parse(HttpContext.Session.GetString("memberid"))).MemId);
ViewBag.payp = _mr.GetPayPoint(obj.Sposted.Value).ToList();
ViewBag.pcommand = _mr.GetCommand(obj.Sposted.Value).ToList();
return View(obj);
}