在ASP.Net MVC中级联DropDownList和ListBox

时间:2015-01-13 05:39:50

标签: c# asp.net-mvc asp.net-mvc-4 listbox

我在Asp.Net MVC中尝试了级联下拉列表和列表框的示例。我已经看到了单独级联下拉列表的示例,但是使用JSON来填充第二个下拉列表。所以,请不要将此问题标记为重复。

我有一个用于显示区/县的下拉列表和一个列表框,该列表框显示使用该模型预先填充的“查看”页面中的客户。当我在下拉列表中选择一个县/区时,我需要通过查询获得列表框中客户的过滤列表,我更喜欢linq。

我的问题是我在控制器中写入查询的位置?

型号:

public class ReportParameterCustomerCard
{
  [Required(ErrorMessage = "Please select a district")]
  [Display(Name = "District")]
  public int District { get; set; }
  public System.Web.Mvc.SelectList languanges { get; set; }
  public string[] selectedCustomer { get; set; }
  public IEnumerable<SelectListItem> allCustomer { get; set; }
  public string CustomerCode { get; set; }
}

控制器:

public ActionResult CustomerbyDistrictReport()
{
  ViewBag.ShowIFrame = false;
  ReportParameterCustomerCard cus = new ReportParameterCustomerCard();
  List<SelectListItem> list = new List<SelectListItem>();
  Helpers.DataLayer dl = new Helpers.DataLayer();
  DataSet ds = dl.ReturnDataset("[Sales].[County]", "*");
  for (int i = 0; i < ds.Tables[0].Rows.Count; i++)
  {
    list.Add(new SelectListItem { Text = ds.Tables[0].Rows[i]["County_Name"].ToString(), Value = ds.Tables[0].Rows[i]["RowNum"].ToString() });
  }
  cus.languanges = new SelectList(list, "Value", "Text");
  cus.selectedCustomer = null;
  cus.allCustomer = GetallCustomer();
  return View(cus);
}

查看:

<table align="center" style="width: 37%;">
  <tr>
    <td class="style1">
      <h3>
        <asp:Label ID="Label4" runat="server" Text="District"></asp:Label>
      </h3>
    </td>
    <td>
      <%=Html.DropDownListFor(a=>a.District,Model.languanges," --Select One-- ",new{id="ddlDistrict", style = "width: 255px;height:25px;" })%>
    </td>
  </tr>
  <tr>
    <td class="style1">
      <h3>
        <asp:Label ID="Label5" runat="server" Text="Customer"></asp:Label>
      </h3>
    </td>
    <td>
      <%=Html.ListBoxFor(a=>a.selectedCustomer,Model.allCustomer, new { @class = "chosen", multiple = "multiple", style = "width: 250px;", tabindex = "4" })%>
    </td>
  </tr>
  <tr>
    <td class="style1">
      &nbsp;
    </td>
    <td>
      <input id="btnsearch" class="button" type="submit" value="Show" />
    </td>
  </tr>
</table>

1 个答案:

答案 0 :(得分:0)

例如,我在这里进行了一些编码。请按照它做。

$('#firstDropDown').on('change', function() {
    var getValue = $(this).val();
    $.ajax({
        url: '@url.Action("secondDrodownFetchValue"), new { myValue : getValue }',
        type: 'GET',
        success: function (result) {
             $.each(result, function (index, value) {
                    $('#secondDorpDown').append($('<option>').text(value).attr('value', value));
                });
        }
    });
})

我的控制器操作方法

[HttpGet]
public ActionResult secondDrodownFetchValue(string myValue)
{
    // your code
    return List<string>(); // Here i pass the empty value You have to pass the list of customer .
}