Cascading DropDownList and ListBox in ASP.Net MVC

问题

I am trying out a sample of cascading dropdowlist and listbox in Asp.Net MVC. I have seen examples of cascading dropdownlists alone, but that uses JSON to fill the second dropdownlist. So, please don't mark this question as duplicate.

I have a dropdownlist for displaying the districts/counties and a listbox that displays the customers in the View page which are pre populated using the model. When I chose an county/district in the dropdownlist, I need to get a filtered list of customers in the listbox, by using queries, I prefer linq.

My question is where would I write the query in the controller?

Model:

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; }
}

Controller:

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);
}

View:

<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:

For Example I am put some coding here. Please do follow like it.

$('#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));
                });
        }
    });
})

My controller action method

[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 .
}

来源：https://stackoverflow.com/questions/27915527/cascading-dropdownlist-and-listbox-in-asp-net-mvc

标签

asp.net-mvc

asp.net-mvc-4

listbox