填充DropDown /选择基于另一个DropDown选择的值

我是一名初学者开发人员，但偶然发现了一个我无法解决的问题。我使用ASP.NET MVC与C＃加一些JavaScript（JQuery，JSON ...）。填充DropDown /选择基于另一个DropDown选择的值

我要做的是根据其他选择的值填充下拉菜单。这似乎很简单（我知道它是），但这特定情况下是躲过我。我已经失去了很多小时，我仍然在bon my我的脑袋。如果有人能帮助我，我会非常感激。

我的代码如下：

我有类“任务”同时具有相位和订购的对象。在第二个下拉菜单中可供用户使用的订单将取决于此任务在firts下拉菜单中分配给的阶段。订单仅仅是一个Int32（从订单排序，而不是从业务订单订购）

First DropDown使用此IF来检查会话是否为空，然后继续显示默认消息或将默认消息作为默认值。

<% 
if (TempData["TaskObject"] != null) 
    { 
     var Phases = new SelectList(ViewData["phaseList"] as List<Phase>, "Phase_ID", "Phase_Name", ((Task)TempData["TaskObject"]).Phase_ID.ToString()); 

    %> 
     <%=Html.DropDownList("Phase_ID", Phases, new { @class = "textbox"})%> 
    <%}%> 
    <%else 
     {%> 
     <%=Html.DropDownList("Phase_ID", (new SelectList((List<Phase>)ViewData["phaseList"], "Phase_ID", "Phase_Name")), 
               "Please Choose...", 
               new { @class = "textbox"})%> 
    <%} %>

第二个DropDown很像第一个，但它的SelectList是列表的列表。每个列表包含第一个DropDown中每个选项的可能选项。不会有太多，所以不要担心。

<%if (TempData["TaskObject"] != null) 
    { 
     var orderList = (ViewData["orderList"] as List<List<int>>)[0]; 
     var orders = new SelectList(orderList, ((Task)TempData["TaskObject"]).Phase_ID.ToString()); 

%> 
     <%=Html.DropDownList("Order_ID", orders, new { @class = "textbox"})%> 
    <%}%> 
<%else 
    {%> 
     <%=Html.DropDownList("Order_ID", (new SelectList((List<int>)ViewData["phaseList"], "Phase_ID", "Phase_Name")), 
              "Please Choose...", 
              new { @class = "textbox"})%> 
    <%} %>

现在的问题是：如何使第二个DropDown基于第一个DropDown中的选定值更改其值？我对JavaScript很穷（开始学习）。我们在项目中使用JQuery，JSON。

在此先感谢您的关注。

来源

2010-02-01 Lynx Kepler

重复：http://stackoverflow.com/questions/1976981/asp-net-mvc-filtering-results-in-a-list-grid/1977055＃1977055 – 2010-02-23 17:00:54

你基本上要一个JavaScript事件附加到第一下拉列表，并有jQuery的查询Web服务（或其他方式）来获取该ID的详细信息。然后在javascript中使用可用选项重新呈现第二个下拉列表。一个很好的例子是here。使用Javascript摘自例子如下：

$(function() { 
     $.getJSON("/Home/Countries/List", function(data) { 
      var items = "---------------------"; 
      $.each(data, function(i, country) { 
       items += "" + country.Text + ""; 
      }); 
      $("#Countries").html(items); 
     }); 

    $("#Countries").change(function() { 
     $.getJSON("/Home/States/List/" + $("#Countries > option:selected").attr("value"), function(data) { 
      var items = "---------------------"; 
      $.each(data, function(i, state) { 
       items += "" + state.Text + ""; 
      }); 
      $("#States").html(items); 
     }); 
    }); 
});

来源

2010-02-01 02:42:35 Rosstified

您需要捕获第一个DropDown的更改事件。并在此填充/选择您需要的值。

$('#Phase_ID').change(function(){ 
     var t = $(this); 
     $('#Order_ID').val(t.val()); // this is only for example. 
});

来源

2010-02-01 02:40:00

我该怎么做？我是n00b，对不起。 – 2010-02-01 02:42:52

有一个关于如何做一个很好的教程，从Stephen Walther

它应该是很容易做到的这

来源

2010-02-18 16:49:56

填充DropDown /选择基于另一个DropDown选择的值

回答

相关问题