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

Question

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

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

Index.aspx '<% @ Page Title = "ManifestSearchPage" AutoEventWireup= "true" Language = "C #" MasterPageFile = "~ / Views / Shared / Site.Master" Inherits = "System.Web.Mvc.ViewPage"%>

Манифест

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

<% } %>

'

Это все работает, за исключением моего требования, чтобы мои выпадающие списки не были связаны между собой.

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

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
)