4

我创建了两个下拉列表,我想做的是让它们级联。这样第二个依赖于第一个。原因是因为我的数据库是这样布局的

****Car_iD      Car_Name            Car_drive** 
      1           Honda             2 wheel drive
      2           Acura             4wheel drive        
      3           Toyota            2 wheel drive
      4           Honda             4wheelDrive       

如您所见,我有两个相同的 Car_Name,但 Car_drive 不同。因此,当用户单击第一个下拉列表时,他们将看到 Honda、Acura、Toyota……但如果他们选择 Honda,第二个下拉框会显示 2wheeldrive 和 4wheeldrive。

我的控制器看起来像这样:

 public ActionResult Home()
  {
  ViewData["Car_Name"] = new SelectList(_context.Cars.Select(a => a.Car_Name).Distinct());
   ViewData["Car_drive"] = new SelectList(_context.Cars.Select(a => a.Car_drive).Distinct());
  }

我的视图看起来像这样

      Choose an Car
               <label for= "Car_Names"></label>
                <%= Html.DropDownList("Car_Name" )%>  

               <label for= "Application_Names"></label>
                <%= Html.DropDownList("Car_drive")%>    
                <input type = "submit" value ="Update" /> 
                 <% using(Html.BeginForm("Home", "Home")) { %>  
                <%}%>       

我已经阅读了很多教程,但没有什么能真正接近。我接近 MVC Awesome 的东西,但我一直收到错误说 SelectableItem 缺少引用。任何有关实现此功能的帮助都会很棒。

更新 我已将此添加到我的控制器

    public ActionResult CarNameChange(string Car_Name)
    {
        var car_drive = from env in _context.Cars
                              where env.Car_Name == Car_Name
                              select car_drive;
        return Json(ViewData["Car_Drive"] = car_drive); 
    }

现在需要一些帮助来编写脚本以从控制器获取此信息。

   <script type = "text/javascript">
   $('#Car_Names').change(function(){
      var selectedName = $(this).val();
       $getJson('@Url.Action("
4

2 回答 2

3

检查: http: //blogs.msdn.com/b/rickandy/archive/2012/01/09/cascasding-dropdownlist-in-asp-net-mvc.aspxhttp://msprogrammer.serviciipeweb.ro/2011/ 02/13/asp-net-mvc-jquery-and-razor-cascading-dropdown-retrieving-partial-views-json-send-objects-handling-errors/你不需要其他任何东西。这两个项目都有一个演示可供下载以检查代码。

问候

编辑:更新后

不要使用 ViewData 或 ViewBag。制作一个包含 Cars 和 CarDrive 属性的 ViewModel,这样添加新东西会更干净、更容易。

于 2012-04-04T20:01:38.827 回答
2

使用一些客户端 jQuery 脚本,让您的Car_Name下拉菜单在有人更改选择时触发一个事件。

//Use your DOM identifier here. I don't know what it's called.
$('#car_name').change(function() {
    //Magic here.
});

现在您要做的是,当触发此事件时,触发一个值为 的 AJAX 请求Car_Name

让您的 ActionMethod 返回一个JsonResult.

然后,您在客户端捕获该信息,并解析数据以将选择选项插入到您的下拉列表Car_Drive中。

这就是您需要做的,将其分解为易于遵循的小块。

于 2012-04-04T18:00:58.140 回答