обратная передача mvc 3 не обновляет экран

Question

Я новичок в MVC, поэтому у меня есть некоторые концептуальные проблемы.У меня есть WebGrid, который заполняется данными из модели представления, и с этим есть DropDownList, который пользователь может выбрать, сколько записей вернуть (50, 100 и т. Д.), Который также является свойством виртуальной машины.Я установил событие onchange на стороне клиента DDL для запуска this.form.submit (), и мое действие контроллера получает POST.Беда в том, что логика для обновления не срабатывает.Представление просто обновляет выбранное значение в DDL.

/ * Действия контроллера * /

public ShopsController()
{
    ViewBag.PageList =
    new SelectList(new[] { 10, 15, 25, 50, 100, 1000 }
        .Select(x => new { value = x, text = x }), "value", "text");
}

[HttpGet]
public ActionResult Index()
{
    var model = new ShopsViewModel();
    return View(model);
}
[HttpPost]
public ActionResult Index(int RowsPerPage)
{
    var model = new ShopsViewModel();
    TryUpdateModel(model);
    return View(model);
}

Представление использует JSON для обновления данных в сетке, чтобы их можно было перемещать с помощьюТехника Малкольма Шеридана опубликована здесь .Для краткости я обрезал код.

    <script type="text/javascript">
    $(function () {
        // fire JSON request to initially fill grid
        $.getJSON("/Shops/ShopsPager", null, function (d) {
            $("#grid").append(d.Data);

            $("#DataTable tfoot a").live("click", function (event) {
                event.preventDefault();
                OnPageClick($(this).text() );
            });
            $("#tLinks a").live("click", function (event) {
                event.preventDefault();
                OnPageClick($(this).text() );
            });
        });
    });
</script>
@Html.BeginForm();
    // this is the DDL that when changed, I want the view to refresh using the new value
    <div class="rlinks" style="float:right;">Display&nbsp;
         @Html.DropDownList("RowsPerPage", ViewBag.PageList as SelectList, 
           new{onchange= "this.form.submit();"})&nbsp;Items per page
    </div>
    <div id="grid" class="gridWrapper">
        <!-- the grid get inserted here by the JSON callback
    </div>

Так что происходит, когда страница загружается, а вызов JSON выбирает WebGrid с количеством строк, которые в настоящее время указаны в свойстве Model.RowsPerPage.Измените его, скажем, с 25 на 50, так что submit () срабатывает и вызывается действие Index () POSTПараметр правильный, и TryUpdateModel () правильно обновляет значение RowsPerPage.Действие возвращает представление по умолчанию с обновленной моделью, но представление не обновляется, оно не выполняет вызов JSON.Поскольку я не совсем уверен, как эта маршрутизация и AJAX работают вместе, вероятно, это что-то простое.

Answer 1

Поскольку вы пытаетесь выполнить обратную передачу страницы, на которой в MVC исключена функция обратной передачи, вы просто пытаетесь обновить страницу, но на самом деле ваша сетка обновляет ваш $.getJSON вызов /Shops/ShopsPager. Вместо этого не отправляйте обратно свою страницу, просто снова вызовите getJSON при событии обмена DDL.

Предполагая, что ваш /Shops/ShopsPager принимает параметр RowsPerPage, такой как ваш индекс.

$(document).ready(function(){
    // Fires Initially.
    GetPage(null);
});

function GetPage(data) {
    var passedData;
    if(data == null)
        passedData = null;
    else {
        passedData = $(data).val();
    }

    // Assuming called action accepts RowsPerPage parameter.
    $.getJSON("/Shops/ShopsPager", { "RowsPerPage" : passedData }, function (d) {
        $("#grid").append(d.Data);

        $("#DataTable tfoot a").live("click", function (event) {
            event.preventDefault();
            OnPageClick($(this).text() );
        });
        $("#tLinks a").live("click", function (event) {
            event.preventDefault();
            OnPageClick($(this).text() );
        });
    });
}

и ваш обмен DDL просто вызывает GetPage ()

<div class="rlinks" style="float:right;">Display&nbsp;
     @Html.DropDownList("RowsPerPage", ViewBag.PageList as SelectList, 
       new{onchange= "GetPage(this);"})&nbsp;Items per page
</div>