MVC: загрузка массива в зависимости от выбранной клиентской части выпадающего списка

Question

Я бы хотел сделать следующее: - Загрузка массива (имеется в виду использование EF для фильтрации результата запроса) на моей странице aspx, в зависимости от выбора, на стороне клиента, из моего раскрывающегося списка (содержащего идентификатор для передачи параметра в моем результате запроса).

Полагаю, мне придется пройти мимо jquery или чего-то в этом роде.

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

<script type="text/javascript" src="/Scripts/jquery-1.5.2.js"></script>
<script type="text/javascript" src="/Scripts/jquery-ui-1.8.11.custom.js"></script>
<script type="text/javascript">
        $(function() {
           $("#FK_MET_ID").change(function() {
              $.get("/Provider/UpdateListProvider", function(data) {
              // something must be written here ?
              $("#ResultProvider").toggle(); // the div, containing my generated result ? 
                });
            });
        });
</script>

<% using (Html.BeginForm("Action", "Post")){%>    

<div id="ResultProvider"></div>

<%= Html.DropDownList("FK_MET_ID"); %>
<% } %> 

(я использовал следующий учебник, чтобы начать кодирование этой части кода: http://www.dotnetcurry.com/ShowArticle.aspx?ID=443)

Answer 1

Вы на правильном пути, вам нужно добавить скрипт, чтобы он заработал. Вам нужно передать выбранное значение, вы должны добавить код контроллера к вопросу. Может быть, это больше пост, чем получить, но это выходит за рамки этого вопроса. Какие данные вы возвращаете? Я думаю, что вы должны использовать jquery template , чтобы показать свои данные.

$(function() {
           $("#FK_MET_ID").change(function() {
              $.get("/Provider/UpdateListProvider/" + $(this).val(), function(data) {

                if (data) {
                    $("#contractsTemplate").tmpl(data).appendTo('#contracts');
                }

                });
            });
        });

РЕДАКТИРОВАТЬ:

Лучший способ - работать с Json, в вашем контроллере вам нужен такой метод:

[HttpPost]
public virtual JsonResult GetContracts(string nameOfTheVariable)
        {
            var contracts = _session.All<Contract>();//add restriction with the variable
            return Json(contracts);
        }

В вашем представлении вы можете работать с шаблоном jquery :

<script id="contractsTemplate" type="test/x-jquery-tmpl">
    <li><a href="/contract/${Id}/version/${Version}/edit">${Filename}</a>&nbsp;&nbsp;&nbsp;<span>${Status}</span></li>
</script>

<script type="text/javascript" src="@Links.Content.javascript.jquery_tmpl_min_js"></script>
<script type="text/javascript">

    $(function () {
        GetContracts();
    });

    function GetContracts() {
        $.ajax({
            type: "POST",
            url: "/API/GetContracts",
            dataType: "json",
            success: function (data) {
                $('#contracts').empty();
                if (data) {
                    $("#contractsTemplate").tmpl(data).appendTo('#contracts');
                }
            }
        });
    }
</script>

Вам нужно добавить собственный маршрут в ваш global.ascx, который будет указывать на ваш контроллер с нужным вам действием и параметром nameOfTheVariable, который вам нужен, или вы можете также сделать это как параметр запроса yoururl.com $ action? NameOfTheVariable = "значение"

Дайте мне знать, если вам нужна дополнительная помощь!