Заполните раскрывающийся список на основе выбора в другом выпадающем списке

Question

Я работаю над веб-сайтом в ASP.NET MVC 3 с использованием Razor и C#.

У меня есть два выпадающих списка на вид - один для типа устройства и один для модели устройства. Содержимое раскрывающегося списка «Модель устройства» основано на выбранном типе устройства. Также выпадающее меню устройства должно быть отключено до тех пор, пока не будет выбран тип устройства. Я бы предпочел, чтобы функциональность была на стороне клиента.

Как я могу это достичь?

EDIT: Получен ответ на другой вопрос: Fill a drop down list dynamically using Javascript/jQuery

Answer 1

Почему бы не разместить 2-й список дд в контейнере DIV, с помощью Ajax, чтобы отправить выбранное значение из первого списка в действие контроллера (OnChange), который возвращается визуализированный как HTML для клиента, а затем заменяет HTML-файл контейнера второго списка результатом действия.

Если вы открыты для использования jquery look в $ .ajax и replaceWith, чтобы поговорить с действием вашего контроллера и динамически переписать свой целевой div html соответственно.

Answer 2

Если комбинаций не так много, то вы также можете просто привести весь словарь к клиенту в переменной JavaScript, а затем просто сделать всю клиентскую сторону по своему усмотрению.

Пример:

в контроллере, вы бы сохранить словарь в ViewBag так:

// Keep in mind that I don't know your data structure, but you'll get the point. 
ViewBag.DeviceDictionary = myDictionary; 

Тогда в представлении, вы могли бы сделать что-то вроде этого:

<script type="text/javascript"> 

// new-up an array in JavaScript. 
var devices = []; 

// ... IT'S RAZOR TIME!!! 
@foreach (Device d in ViewBag.DeviceDictionary) 
{ 
    <text> 
     // We're back in JavaScript here... new up the dictionary. 
     devices[@d.ID] = []; 
    </text> 

    foreach (var model in d.Models 
    { 
     <text>devices[@d.ID].push("@model.Name");</text> 
    } 
} 

</script> 

Затем вы просто пишете простой JavaScript (используя jQuery?), Который очищает второй выпадающий список и заполняет его из этого массива (который является клиентской стороной).

Имейте в виду, что я даю вам пример, полностью составляющий ваши структуры данных ... но вы должны получить от этого идею.