Arhn - архитектура программирования

MVC 3 WebGrid с фильтром флажков

Я разрабатываю веб-приложение с использованием MVC 3 RTM. В представлении у меня есть WebGrid, который отлично работает с сортировкой и пейджингом. Однако мне также требовалась поддержка фильтрации на странице, поэтому я добавил текстовое поле и флажок. Код просмотра выглядит так:

@using (Html.BeginForm("Index", "Customer", FormMethod.Get))
{
    <fieldset>
        <legend>Filter</legend>
        <div class="display-label">
            Search for</div>
        <div class="display-field">@Html.TextBox("filter", null, new { onchange = "$('form').submit()" })</div>
        <div class="display-label">
            Show inactive customers?
        </div>
        <div class="display-field">
            @Html.CheckBox("showInactive", false, new { onchange = "$('form').submit()" })
        </div>
    </fieldset>

    var grid = new WebGrid(canPage: true, canSort: true, ajaxUpdateContainerId: "grid", rowsPerPage: 10, defaultSort: "Name");
    grid.Bind(Model, rowCount: Model.Count, autoSortAndPage: false);
    grid.Pager(WebGridPagerModes.All);
    @grid.GetHtml(htmlAttributes: new { id = "grid" },
                  columns: grid.Columns(
                    grid.Column("Name", "Name"),
                    grid.Column("Address", "Address"),
                    grid.Column("IsActive", "Active", (item) => item.IsActive ? "Yes" : "No")));

}

Это работает нормально, за исключением случаев, когда я устанавливаю флажок. Когда я загружаю страницу в первый раз, флажок не установлен. Сортировка и разбиение по страницам работают, и я могу ввести какой-то текст в качестве фильтра, и он фильтрует мой результат, и после этого сортировка и разбиение по страницам все еще работают. Однако, если я устанавливаю флажок, он обновляет результат, но сортировка больше не работает. Однако фильтр все еще работает, поэтому, если я ввожу какой-либо текст, он правильно фильтрует результат и по-прежнему учитывает флажок.

Я попытался установить точку останова в своем контроллере, и там нет проблем. Запрос отправляется, когда я пытаюсь отсортировать, и контроллер корректно возвращает представление с результатом в качестве модели. Но не похоже, что WebGrid обновляется.

Кто-нибудь еще сталкивался с этим или у кого-нибудь есть хороший совет о том, что искать?

Спасибо!

checkbox filter asp.net-mvc-3 webgrid
24.03.2011

Ответы:


1

Обычно я добавляю форму (над моей WebGrid), которая содержит текстовое поле под названием «Ключевые слова» и флажок «IsActive», а при нажатии кнопки «Перейти» он перезагружает WebGrid, добавляя параметры «Ключевые слова» и «IsActive» к Строка запроса.

Вы можете добавить в форму дополнительные элементы, и их значения будут отправлены всем.

Используйте следующий вспомогательный скрипт — webgrid.helper.js:

function reloadGrid(form) {
    var grid = form._grid ? form._grid.value : "grid";
    var args = {};
    updateQueryParams(args, grid + " th a");
    args.sort = "";
    args.sortdir = "";
    updateQueryParams(args, grid + " tfoot a");
    args.page = 1;

    for (var i = 0; i < form.elements.length; i++) {
        var el = form.elements[i];
        if (el.type == "text" || el.type == "select" || (el.type == "radio" && el.checked))
            args[el.name] = el.value;
        else if (el.type == "checkbox")
            args[el.name] = el.checked;
    }

    //get controller name
    var s = $("#grid th a")[0].onclick.toString();
    s = s.substring(s.indexOf("/"));
    var controller = s.substring(0, s.indexOf("?"));

    var queryString = "";
    for (var key in args)
        queryString += "&" + key + "=" + escape(args[key]);

    var url = controller + "?" + queryString.substring(1);
    $("#" + grid).load(url + " #" + grid);
}


function updateQueryParams(args, path) {
    var links = $("#" + path);
    if (links.length == 0)
        return;

    var s = links[0].onclick.toString();
    s = s.substring(s.indexOf("?") + 1);
    s = s.substring(0, s.indexOf(" #"));

    var a = /\+/g;  // Regex for replacing addition symbol with a space
    var r = /([^&=]+)=?([^&]*)/g;
    var d = function (s) { return decodeURIComponent(s.replace(a, " ")); };
    var q = s;

    while (e = r.exec(q))
        args[d(e[1])] = d(e[2]);
}

Затем прямо над моей веб-сеткой у меня есть следующий частичный файл — *_ListFilter.cshtml*

@using (Html.BeginForm(null, null, FormMethod.Get))
{ 
    <div id="filter">
    <table width="600">
    <tr>
    <td>@Html.TextBoxFor(c => c.Keywords, new { size = 50, placeholder = Strings.SearchByKeywords, title = Strings.SearchByKeywords })</td>

    <td>&nbsp
24.03.2011
  • @Gunder: мой ответ продолжает отклоняться сервером 24.03.2011
  • Спасибо за ваш ответ @Tawani. Я должен быть честным с вами и сказать, что я не пробовал ваш опубликованный код, поэтому я не знаю, решит ли он мою проблему с WebGrid. Но я уверен, что это я где-то допустил ошибку, поэтому я принимаю ваш ответ, поскольку это хороший пример того, как публиковать дополнительные параметры, чего я и хотел. Однако я решил отказаться от WebGrid, так как он запрашивал всю страницу, а не только данные для сетки. Вместо этого я переключился на jqGrid. Он без проблем поддерживает дополнительные параметры, и с тех пор я не оглядывался назад. 04.04.2011
    • Новые материалы
    Коллекции публикаций по глубокому обучению
    Последние пару месяцев я создавал коллекции последних академических публикаций по различным подполям глубокого обучения в моем блоге https://amundtveit.com - эта публикация дает обзор 25..
    Представляем: Pepita
    Фреймворк JavaScript с открытым исходным кодом Я знаю, что недостатка в фреймворках JavaScript нет. Но я просто не мог остановиться. Я хотел написать что-то сам, со своими собственными..
    Советы по коду Laravel #2
    1-) Найти // You can specify the columns you need // in when you use the find method on a model User::find(‘id’, [‘email’,’name’]); // You can increment or decrement // a field in..
    Работа с временными рядами спутниковых изображений, часть 3 (аналитика данных)
    Анализ временных рядов спутниковых изображений для данных наблюдений за большой Землей (arXiv) Автор: Рольф Симоэс , Жильберто Камара , Жильберто Кейрос , Фелипе Соуза , Педро Р. Андраде ,..
    3 способа решить квадратное уравнение (3-й мой любимый) -
    1. Методом факторизации — 2. Используя квадратичную формулу — 3. Заполнив квадрат — Давайте поймем это, решив это простое уравнение: Мы пытаемся сделать LHS,..
    Создание VR-миров с A-Frame
    Виртуальная реальность (и дополненная реальность) стали главными модными терминами в образовательных технологиях. С недорогими VR-гарнитурами, такими как Google Cardboard , и использованием..
    Демистификация рекурсии
    КОДЕКС Демистификация рекурсии Упрощенная концепция ошеломляющей О чем весь этот шум? Рекурсия, кажется, единственная тема, от которой у каждого начинающего студента-информатика..