Как избежать потери состояния элементов управления в ASP.NET MVC - PullRequest
1 голос
/ 03 декабря 2010

Я работаю с ASP.NET MVC 2 и создаю простое бизнес-приложение. Вот некоторые детали:

  • Приложение имеет дело с рабочими заказами и имеет представление индекса рабочего заказа. представление имеет таблицу с перечислением работы заказы и несколько элементов управления (текст ящики, флажки и выпадающий списки), чтобы выбрать критерии для какие рабочие задания отображать.

  • Я использую модели представления. Порядок работы индексное представление имеет модель свойства для каждого управление.

  • Я реализовал пейджинг, похожий на что делается в ответ на этот вопрос: Как сделать нумерацию страниц в ASP.NET MVC? Я использую LINQ Skip () и Take () в качестве продемонстрировал, и ActionLinks для навигация.

  • Если я загружу страницу и не манипулировать любым из элементов управления, я могу нажмите на номер страницы ActionLinks и просто передвигаться между страницы заказов на работу. Тем не менее, если я изменить что-то, мои изменения потеряны когда я перехожу на другую страницу.

    Например, если я на странице 1 и поставьте галочку напротив и затем нажмите на ссылку для страницы 2, загрузится вторая страница результатов но флажок вернется к своему предыдущее состояние.

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

Потенциальные решения, о которых я могу думать:

  1. Установить все контрольные значения как маршрут значения в ActionLinks. это кажется очень противным, и может привести в очень длинных URL-адресах или строках запроса. На самом деле, теперь, когда я думаю об этом, это не сработало бы без способа получения контрольных значений.

  2. Поскольку ссылки ActionLink не публикуются что-нибудь, замените их кнопками. Опять же, это кажется плохой идеей.

  3. Измените ссылки ActionLink на ссылки, которые запустить сценарий jQuery, который делает СООБЩЕНИЕ. Я думаю, что это самый перспективный вариант пока что. Сделать много разработчики так делают?

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

Ответы [ 3 ]

0 голосов
/ 03 декабря 2010

В конце концов, я избавился от ActionLinks для подкачки страниц и заменил их обычными тегами привязки.Индекс текущей страницы теперь сохраняется в скрытом значении формы:

<input id="page" name="page" type="hidden" value="" />

<p>
    <% for (var i = 1; i <= (int)Math.Ceiling(Model.RowsMatchingCriteria / (double)Model.PageSize); i++) { %>

        <%--
            If the page number link being rendered is the current page, don't add the href attribute.
            That makes the link non-clickable.
        --%>
        <a class="pageLink" <%= i != Model.Page ? @"href=""javascript:void(0);""" : string.Empty %>><%: i %></a>

    <% } %>
</p>

Затем я добавил следующий скрипт jQuery, который устанавливает значение скрытой страницы и отправляет форму при нажатии на ссылку:

$(document).ready(function () {

    $('.pageLink:[href]').click(function () {
        $('#page').val($(this).text());  // Set hidden field value to the text of the page link, which is the page number.
        $('form:first').submit();
    });

});

Проблема решена.

0 голосов
/ 04 декабря 2010

Лучше всего эффективно моделировать состояние представления, «регистрируя» изменения в скрытом поле, когда пользователь разбивает страницы на страницы. Для этого:

1) Определите, какие данные вам нужно захватить, и формат данных для этого в {то есть - массив объектов json} 2) Установите ссылку, которая обрабатывает prev / next, чтобы запустить метод сбора «измененных» вещей и помещения их в объекты и в скрытое поле.
3) При публикации формы анализируйте скрытое поле, извлекайте данные и получайте прибыль.

0 голосов
/ 03 декабря 2010

Разве вы не можете просто сохранить изменения обратно в базу данных, когда пользователь устанавливает флажки (используя jQuery):

$("input[type=checkbox]").click(function() {
     $.ajax({
          type: "POST",
          url: "/ControllerName/SaveInfo?id=" + {id},
          success: function(){
                alert("Data Saved: " + msg);
          }
     });
});
...