ASP.NET MVC 2 Фильтрация нескольких выпадающих списков

Question

Я знаю, как подойти к этой проблеме, но у меня очень мало опыта работы с чем-либо связанным с Интернетом.

Ситуация: У меня есть контроллер, который возвращает представление с помощью пользовательского элемента управления. Внутри пользовательского элемента управления есть 3 выпадающих списка; один для компаний, один для полевых офисов и один для объектов. Когда компании ddl изменены, полевые офисы и объекты ddls должны измениться, и когда полевое отделение ddl будет изменено, объект ddl должен измениться.

index.aspx '<% Название @ Page = "ManifestSearchPage" AutoEventWireup = "истинный" Language = "C#" MasterPageFile = "~/Просмотров/Shared/Site.Master" наследуется = "System.Web.Mvc. ViewPage "%>

Manifest

<form id="form1" runat="server"> 

<% using (Html.BeginForm()) { %> 
    <fieldset> 
     <legend><h2>Find a Manifest</h2></legend> 
     <table> 
      <tr> 
       <td> 
        <img src="../../Content/magnify-large.jpg" width="111" height="111" align="middle"></img> 
       </td> 
       <td> 
        <% Html.RenderPartial("../Shared/EditorTemplates/ManifestSearch");%> 
       </td> 
      </tr> 
     </table> 
    </fieldset> 
<% 

}%>

<h2>Search Results</h2> 
<div id="resultspanel"> 
    <table> 
     <tr> 
     </tr> 
     <% foreach (var item in Model.SearchResults) { %> 
      <tr> 
      <td> 
       blargh 
      </td> 
      </tr> 
    <% } %> 
    </table> 
</div> 

</form> 

'

ManifestSearch.aspx ' <% @ Control Language = "C#" Inherits = "System.Web.Mvc.ViewUserControl" %>

<% using (Html.BeginForm()) {%> 
    <%: Html.ValidationSummary(true) %> 

    <fieldset> 
     <legend>Fields</legend> 
      <table> 
       <tr> 
        <td> 
         <%: Html.LabelFor(model => model.ManifestPartialId) %> 
         <%: Html.CheckBoxFor(model => model.SearchByManifestPartialId)%> 
         <%: Html.ValidationMessageFor(model => model.SearchByManifestPartialId) %> 
        </td> 
        <td> 
         <%: Html.LabelFor(model => model.CompanyId) %> 
         <%: Html.CheckBoxFor(model => model.SearchByCompanyId)%> 
         <%: Html.ValidationMessageFor(model => model.SearchByCompanyId) %> 
        </td> 
       </tr> 
       <tr> 
        <td> 
         <%: Html.TextBoxFor(model => model.ManifestPartialId) %> 
         <%: Html.ValidationMessageFor(model => model.ManifestPartialId) %> 
        </td> 
        <td> 
         <%: Html.DropDownList("CompanyId", new SelectList(ViewData["Companies"] as IEnumerable,"Id","CompanyName", Model.CompanyId))%> 
         <%: Html.ValidationMessageFor(model => model.CompanyId) %> 
        </td> 
       </tr> 
       <tr> 
        <td> 
         <%: Html.LabelFor(model => model.FieldOfficeId) %> 
         <%: Html.CheckBoxFor(model => model.SearchByFieldOfficeId)%> 
         <%: Html.ValidationMessageFor(model => model.SearchByFieldOfficeId) %> 
        </td> 
        <td> 
         <%: Html.LabelFor(model => model.FacilityId) %> 
         <%: Html.CheckBoxFor(model => model.SearchByFacilityId)%> 
         <%: Html.ValidationMessageFor(model => model.SearchByFacilityId) %> 
        </td> 
       </tr> 
       <tr> 
        <td> 
         <%: Html.DropDownList("FieldOfficeId", new SelectList(ViewData["FieldOffices"] as IEnumerable, "Id", "FacilityName", Model.FieldOfficeId))%> 
         <%: Html.ValidationMessageFor(model => model.FieldOfficeId) %> 
        </td> 
        <td> 
         <%: Html.DropDownList("FacilityId", new SelectList(ViewData["Facilities"] as IEnumerable, "Id", "FacilityName", Model.FacilityId))%> 
         <%: Html.ValidationMessageFor(model => model.FacilityId) %> 
        </td> 
       </tr> 
       <tr> 
        <td> 
         <%: Html.LabelFor(model => model.SearchByDateTime) %> 
         <%: Html.CheckBoxFor(model => model.SearchByDateTime) %> 
         <%: Html.ValidationMessageFor(model => model.SearchByDateTime) %> 
        </td> 
        <td> 
        </td> 
       </tr> 
       <tr> 
        <td> 
         <%: Html.LabelFor(model => model.FromDate) %> 
         <%: Html.TextBoxFor(model => model.FromDate) %> 
         <%: Html.ValidationMessageFor(model => model.FromDate) %> 
        </td> 
        <td> 
         <%: Html.LabelFor(model => model.ToDate) %> 
         <%: Html.TextBoxFor(model => model.ToDate) %> 
         <%: Html.ValidationMessageFor(model => model.ToDate) %> 
        </td> 
       </tr> 
       <tr> 
        <td> 
        </td> 
        <td> 
         <input type="submit" value="Search" /> 
        </td> 
       </tr> 
      </table> 
    </fieldset> 

<% } %> 

'

Все это работает, за исключением моего требования о том, что мои dropdownlists не связаны.

Я знаю, что мне нужно использовать Javascript для выполнения моего требования связанных dropdownlists, но я понятия не имею, как даже приблизиться к нему. Я нашел несколько учебников, но ни один из них не связан с тем, как у меня настроен мой код. Может кто-нибудь помочь с этим?

Answer 1

Во-первых, для всех людей, JQuery здесь

Если вы используете JQuery вы можете использовать Изменить обработчик событий, чтобы изменить вас выпадающие меню.

$('#firstSelect').change(function() { 
    // DO STUFF 
}); 

Если вы не использование JQuery на мог использовать OnChange атрибут вашего выпадающего меню

<script type="text/javascript> 
function doStuffOnChange() { 
    // DO STUFF 
} 
</script> 

<select id="firstSelect" onchange="doStuffOnChange();"> 

Вы можете добавить HTML атрибуты с HTML-хелперов, используя этот вариант

public static MvcHtmlString DropDownList(
    this HtmlHelper htmlHelper, 
    string name, 
    IEnumerable<SelectListItem> selectList, 
    IDictionary<string, Object> htmlAttributes 
)