2009-05-01 1 views
0

Ситуация: Пользователь на рассматриваемой странице выбирает категорию из выпадающего списка, которая затем динамически заполняет всех пользователей этой категории во втором выпадающем списке рядом с ней.Интеграция jquery с AJAX с использованием MVC для ddl/html.dropdownlist

Все данные извлекаются с использованием LinqtoSQL, и мне было интересно, можно ли это сделать a) Используя html.dropdownlist в строго типизированном виде? b) Использование jquery для запуска запроса ajax при выбранном изменении индекса вместо триггера кнопки «заполнить»?

Извините, у меня нет кода, так как я пытаюсь на самом деле не работать. У меня возникли проблемы с тем, как сделать это концептуально и программно!

По достоинству оцените любые ссылки на примеры и многое другое!

Заранее благодарен!

EDIT:

Это вроде того, что я пытался achieve.Dirst ViewPage:

 <script type="text/javascript"> 
     $(document).ready 
      function TypeSearch() { 
       $.getJSON("/Home/Type", null, function(data) { 
        //dont know what to do here 

       }); 

      } 
     </script> 

     <p> 
       <label for="userType">userType:</label> 
      <%= Html.DropDownList("userType") %> 
      <%= Html.ValidationMessage("userType", "*") %> 
      <input type="submit" runat="server" onclick="TypeSearch()" /> 

      <label for="accountNumber">accountNumber:</label> 
      <%= Html.DropDownList("accountNumber") %> 
      <%= Html.ValidationMessage("accountNumber", "*") %> 
     </p> 

Затем домашний контроллер действия:

public ActionResult Type() 
    { 
     string accountType = dropdownvalue; 
     List<Account> accounts = userRep.GetAccountsByType(accountType).ToList(); 

     return Json(accounts); 
    } 

ответ

0

просто кодирования здесь, но жар угас вы можете сделать что-то вроде

public void Type(string accountType) 
{ 
    List<Account> accounts = userRep.GetAccountsByType(accountType).ToList(); 

    Json(accounts).ExecuteResults(this.ControllerContext); 
} 

со следующим JQuery скрипт

$(document).ready(function() { 
    $("#dropdownid").change(function() { 
     $.getJSON(
      "/Home/Type/" + $("#dropdownid :selected").val(), 
      "[]", 
      function(data) { 
       $("#seconddropdownid").empty(); 
       $.each(data, function() { 
        $("#seconddropdownid").append("<option>" + this.Property + "</option>"); 
       }); 
      } 
     ); 
    }); 
}); 

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

0

Я использовал бы jquery и плагин selectboxes. Он имеет приятный интерфейс для создания каскадных выпадающих списков с помощью вызова ajax, который возвращает json. Код будет выглядеть примерно так:

$(document).ready(function() { 
    function TypeSearch() { 
     // remove any existing options 
     $("#idOfSelect").removeOption(/./); 
     var opts = { accountType : $("#idOfParent").val() }; 
     $("#idOfSelect").ajaxAddOption("/Home/Type", opts, false); 
    } 
}); 
+0

спасибо, что кучи ребята, сегодня поиграют с ним и дадут понять, как это происходит. Удивительно иметь помощь! ура –