忘记设置我完成的工作..人们可能想看看它是如何发生的..这是我的:
查看 + jQuery
$(function () {
$("select#Design").attr('disabled', 'true');
$("select#Model").attr('disabled', 'true');
$("select#Product").click(function () {
var prod = $("select#Product option:selected").val();
if (prod == "" || prod == 0) {
$("select#Design").attr('disabled', 'true');
$("select#Model").attr('disabled', 'true');
} else {
$.getJSON('@Url.Content("~/Admin/GetDesigns/")', { productId: prod }, function (data) {
$("select#Design").empty();
$("select#Model").empty();
$.each(data, function (i, c) {
$('select#Design').append('<option value="' + c.Value + '">' + c.Text + '</option>');
})
$("select#Design").removeAttr('disabled');
$("select#Design option:first").attr('selected', 'selected');
var des = $("select#Design option:selected").val();
if (des == "" || des == 0) {
$("select#Model").attr('disabled', 'true');
} else {
$.getJSON('@Url.Content("~/Admin/GetModels/")', { designId: des }, function (data) {
$("select#Model").empty();
$.each(data, function (i, c) {
$('select#Model').append('<option value="' + c.Value + '">' + c.Text + '</option>');
})
$("select#Model").removeAttr('disabled');
$("select#Model option:first").attr('selected', 'selected');
})
}
})
}
})
})
原因我以这种方式使用 Jquery 来填充所有下拉列表并选择第一个元素作为默认选择!当我从第一个下拉列表中选择一个元素时,其他两个下拉列表开始填充自己并选择它们的第一个元素作为默认选择。相同的代码可用于其他下拉列表单击功能,如下所示:
$("select#Design").click(function () {
var des = $("select#Design option:selected").val();
if (des == "" || des == 0) {
$("select#Model").attr('disabled', 'true');
} else {
$.getJSON('@Url.Content("~/Admin/GetModels/")', { designId: des }, function (data) {
$("select#Model").empty();
$.each(data, function (i, c) {
$('select#Model').append('<option value="' + c.Value + '">' + c.Text + '</option>');
})
$("select#Model").removeAttr('disabled');
$("select#Model option:first").attr('selected', 'selected');
})
}
});
看法
@using (Html.BeginForm("Index", "Admin", FormMethod.Post, new { enctype = "multipart/form-data" }))
{
<table>
<tr>
<td style="background-color:#e8eef4;" rowspan="3">
</td>
<td style="width:190px; background-color:#e8eef4;">
@Html.DropDownList("Product", (SelectList)ViewData["ProductList"], "Please Select Product", new { style = "width:190px; padding:4px; margin:4px;" })
</td>
<td rowspan="3" style="width:400;">
</td>
<td style="background-color:#e8eef4;">
</td>
<td style="background-color:#e8eef4;" rowspan="3">
</td>
</tr>
<tr>
<td style="background-color:#e8eef4;">
<select id="Design" style="width:190px; padding:4px; margin:4px;">
<option label="Please Select Design" selected="selected"></option>
</select>
</td>
<td style="background-color:#e8eef4;">
</td>
</tr>
<tr>
<td style="background-color:#e8eef4;">
<select id="Model" style=" width:190px; padding:4px; margin:4px;">
<option label="Please Select Model"></option>
</select>
</td>
<td style="background-color:#e8eef4;">
</td>
</tr>
</table>
}
只是因为我使用 linqtosql 而我懒得创建一个存储库.. 这是我的 CONTROLLER
public class AdminController : Controller
{
public linqVipDataContext db = new linqVipDataContext();
//
// GET: /Admin/
public ActionResult Index()
{
IEnumerable<SelectListItem> ProductItems = db.Products.AsEnumerable().Select(c => new SelectListItem()
{
Text = c.name,
Value = c.id.ToString(),
Selected = true,
});
SelectList prod = new SelectList(ProductItems, "Value", "Text");
ViewBag.ProductList = prod;
return View();
}
//
//Fill the Design List..
public JsonResult GetDesigns(int productId)
{
/*var data = dbs.Designs.Where(d => d.master_id == productId).ToList();*/
IEnumerable<SelectListItem> DesignItems = db.Designs.Where(c => c.master_id == productId).AsEnumerable().Select(c => new SelectListItem()
{
Text = c.name,
Value = c.id.ToString()
});
SelectList des = new SelectList(DesignItems, "Value", "Text");
return Json(des, JsonRequestBehavior.AllowGet);
}
//
//Fill the Model List..
public JsonResult GetModels(int designId)
{
/*This code down here! Doesnt work and says it's type is unknown*/
/*var data = dbs.Models.Where(d => d.design_id == designId).ToList();*/
/*For that reason im using this code*/
IEnumerable<SelectListItem> ModelItems = db.Models.Where(d => d.design_id == designId).AsEnumerable().Select(c => new SelectListItem()
{
Text = c.name,
Value = c.id.ToString()
});
SelectList mods= new SelectList(ModelItems, "Value", "Text");
return Json(mods, JsonRequestBehavior.AllowGet);
}
Json 需要将值和文本 2 参数分开来创建选择列表选项。所以我必须以这种方式返回我的值。
我发布了这个原因,我在你的代码中发现了一些故障,再次向我展示了这个解决方案,它给了我这个想法并让我解决了所有问题,所以这是完全工作的代码。再次 Ty。希望它有用。