[英]MVC3 Cascade DropDownList pre-select values from database
我已經使用jQuery和AJAX實現了一個層疊下拉列表。 這在創建項目時效果很好,但是當我編輯現有項目時,我需要從數據庫中預選擇值。 我試圖用模型中的預選值創建一個SelectList,但這僅適用於第一個dropdownlist。
如何制作其他顯示項目區域和類別值的列表?
這是我的jQuery代碼:
<script type="text/javascript">
$(document).ready(function() {
$("#ddlDeps").change(function() {
var idArea = $(this).val();
$.getJSON("/Admin/LoadAreasByDepartment", { id: idArea },
function(depData) {
var select = $("#ddlAreas");
select.empty();
select.append($('<option/>', {
value: 0,
text: "Выберите направление"
}));
$.each(depData, function(index, itemData) {
select.append($('<option/>', {
value: itemData.Value,
text: itemData.Text
}));
});
});
});
$("#ddlAreas").change(function() {
var idCategory = $(this).val();
$.getJSON("/Admin/LoadCategoriesByArea", { id: idCategory },
function(areaData) {
var select = $("#ddlCategories");
select.empty();
select.append($('<option/>', {
value: 0,
text: "Выберите категорию"
}));
$.each(areaData, function(index, itemData) {
select.append($('<option/>', {
value: itemData.Value,
text: itemData.Text
}));
});
});
});
});
這是我的框下拉列表代碼:
<p>
@Html.DropDownListFor(model => model.DepartmentId, new SelectList(Model.DataContainer.Departments, "Id", "Name"),
"Выберите отдел", new {id = "ddlDeps"})
@Html.ValidationMessageFor(model => model.DepartmentId)
</p>
<p>
@{
var areaSelectList = new SelectList(Enumerable.Empty<SelectListItem>(), "DepartmentId", "Title", Model.AreaId);
var categorySelectList = new SelectList(Enumerable.Empty<SelectListItem>(), "AreaId", "Title", Model.CategoryId);
}
@Html.DropDownListFor(model => model.AreaId, areaSelectList,
"Выберите направление", new {id = "ddlAreas"})
@Html.ValidationMessageFor(model => model.AreaId)
</p>
<p>
@Html.DropDownListFor(model => model.CategoryId, categorySelectList,
"Выберите категорию", new {id = "ddlCategories"})
</p>
將其替換為您的代碼,然后嘗試。
@{
var areaSelectList = new SelectList(Model.DataContainer.Areas, "DepartmentId", "Title", Model.AreaId);
var categorySelectList = new SelectList(Model.DataContainer.Categories, "AreaId", "Title", Model.CategoryId);
}
聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.