Question

我想根据另一个dropdownList的selectedValue设置dropdownList的值。

例如：

ViewBag.Brand = new SelectList(db.Brand, "Libel", "Libel");
ViewBag.IdModel = new SelectList(db.Model.Where(model => model.Brand == ViewBag.Brand.SelectedValue), "IdModel", "Descriptive");

我知道这不起作用，但要显示我想要的逻辑。

这是我的观点：

<div class="form-group">
    @Html.LabelFor(model => model.IdModel, htmlAttributes: new { @class = "control-label col-md-2" })
    <div class="col-md-10">
        @Html.DropDownList("IdModel", null, htmlAttributes: new { @class = "form-control" })
        @Html.ValidationMessageFor(model => model.IdModel, "", new { @class = "text-danger" })
    </div>
</div>

<div class="form-group">
    @Html.LabelFor(model => model.Brand, htmlAttributes: new { @class = "control-label col-md-2" })
    <div class="col-md-10">
        @Html.DropDownList("Brand", null, htmlAttributes: new { @class = "form-control" })
        @Html.ValidationMessageFor(model => model.IdModel, "", new { @class = "text-danger" })
    </div>
</div>

他们有什么简单的方法吗？

感谢＆＃39; s！

Answer 1

在您的情况下，您需要在更改品牌下拉框时拨打电话或服务器电话。请参阅下面的示例，它仅使用静态数据来识别品牌模型何时更改，然后使用jquery（客户端）自动更改模型下拉列表。

查看方： -

@*Display the elements in the page*@
@*------------------------------------------------*@
<script type="text/javascript" 
      src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.1/jquery.min.js"></script>
<div class="form-group">
  <div class="col-md-10">  
     @Html.DropDownList("Brand", (SelectList)ViewBag.Brand, new { htmlAttributes = new { @class =
         "form-control" } })
  </div>
</div>
<div class="form-group">
  <div class="col-md-10">
      @Html.DropDownList("IdModel", (SelectList)ViewBag.IdModel, new {htmlAttributes = new { 
        @class = "form-control" } })
  </div>
</div>
@*------------------------------------------------*@


@*Script for call the server side function when you changed brand combo from jquery*@
@*------------------------------------------------*@
<script type="text/javascript">
  $(function () {
      $("#Brand").change(function () {
        var selectedItem = $(this).val();
         $.ajax({
             cache: false,
             type: "GET",
             url: "/Home/GetModelFromBrand", // User your action and controller name 
             data: { "Brandid": selectedItem },
             success: function (data) {
                 $("#IdModel").empty();
                    $.each(data, function (id, option) {
                        $("#IdModel").append($('<option>
                              </option>').val(option.IdModel).html(option.Descriptive));
                    });
                },
                error: function (xhr, ajaxOptions, thrownError) {
                    alert('Failed to retrieve states.');
                }
            });
        });
     });
 </script> 
 @*------------------------------------------------*@

控制器端： -

//Get Method to load the view
//==============================================================
public ActionResult Index()
{
    var brands = new SelectList(new[]
                              {
                                  new {Libel="Brand1",},
                                  new {Libel="Brand2",},  
                              },
                             "Libel", "Libel");

    //=======Suppose Brand1 have idmodels1 , idmodels2 models 
    var idmodels = new SelectList(new[]
                              {
                                  new {IdModel="1",Descriptive="idmodels1",},
                                  new {IdModel="2",Descriptive="idmodels2",},

                              },
                              "IdModel", "Descriptive");
    ViewBag.Brand = brands;
    ViewBag.IdModel = idmodels;
    return View();
}
//==============================================================


//Get Action when changed brand combo
//==============================================================
[AcceptVerbs(HttpVerbs.Get)]
public ActionResult GetModelFromBrand(string Brandid)
{
   var obj = new[] {
                            new {IdModel = 3,
                                                 Descriptive = "idmodels3"},
                            new {IdModel = 4,
                                                 Descriptive = "idmodels4"},
                            new {IdModel = 5,
                                                 Descriptive = "idmodels5"}
                        };


    return Json(obj, JsonRequestBehavior.AllowGet);
}
//==============================================================

Answer 2

有两种方式：

1在客户端做; 2在服务器上执行

在客户端上。第二个下拉选项应该包含具有品牌ID的ID，然后您可以编写javascript，它应该根据第一个下拉列表的选定值更改第二个下拉列表的选定索引。这需要基于您的模型结构。
在服务器上。对第一次下拉的每次更改都做回发。并且每次从第一次下拉时基于发布值的第二次下拉新模型返回。

在运行时在控制器中获取selectedValue dropdownList

2 个答案: