0

jqgridで表示される行のソートを実装したいのですが、jqgridのデフォルトの動作はすべてのレコードをソートすることです。私はサーバー側でそれを処理しましたが、問題は、ソートを行うと、ページ2またはその他の場合でも常にページが1になることです。以下は、私も試したコードです.loadComplete &onPagingメソッド.

 $(document).ready(function () {
        $("#grid").jqGrid({
            emptyrecords: "No records to view",
            ignoreCase: true,
            datatype: "json",
            url: '@Url.Action("LoadData", "Home")',
            mtype: "GET",
            height: 'auto',
            rowNum: 5,
            rowList: [5, 10, 15, 20],
            colNames: ['EmployeeId', 'EmployeeCity', 'EmployeeName'],
            colModel: [
            { name: 'EmployeeId', index: 'EmployeeId', key: true, width: 200, sorttype: 'int' },
            { name: 'EmployeeName', index: 'EmployeeName', width: 200, sorttype: 'text' },
            { name: 'EmployeeCity', index: 'EmployeeCity', width: 200, sorttype: 'text' }
            ],
            pager: '#pager',
            sortname: 'EmployeeId',
            viewrecords: true,
            sortorder: "asc",
            caption: "jqGrid Example"
        }).navGrid("#pager",
        { search: false, refresh: false, add: false, edit: false, del: false },
        {},
        {},
        {}
        );
    });

そして、私のサーバー側のコードは、

public ActionResult LoadData(int page, int rows, string sidx, string sord)
    {
        List<Employee> employeeList = new List<Employee>();
        for (int i = 1; i < 18; i++)
        {
            employeeList.Add(
        new Employee() { EmployeeId = i, EmployeeCity = "Mumbai_" + i, EmployeeName = "Jason_" + i }
        );
        }
        var totalRecords = 0;
        var totalPages = 0;
        var griddata = new List<Employee>();
        if (employeeList != null)
        {
            griddata = employeeList.Skip((page - 1) * rows).Take(rows).ToList();
            switch (sidx.ToLower())
            {
                case "employeeid":
                    if (sord.ToLower() == "asc")
                        griddata.OrderBy(x => x.EmployeeId).ToList();
                    else
                        griddata.OrderByDescending(x => x.EmployeeId).ToList();
                    break;
                default:
                    griddata.OrderByDescending(x => x.EmployeeName).ToList();
                    break;
            }
            totalRecords = employeeList.Count;
            totalPages = (int)Math.Ceiling((double)totalRecords / (double)rows);
        }
        var employeeListData = new
        {
            total = totalPages,
            page = page,
            records = totalRecords,
            rows = griddata,
        };
        return Json(employeeListData, JsonRequestBehavior.AllowGet);
    }
4

2 に答える 2

1

ページングを取得した後、サーバー側でデータを注文しています。私はこのセクションを意味します:

griddata = employeeList.Skip((page - 1) * rows).Take(rows).ToList();
switch (sidx.ToLower())
{
    case "employeeid":
        if (sord.ToLower() == "asc")
            griddata.OrderBy(x => x.EmployeeId).ToList();
        else
            griddata.OrderByDescending(x => x.EmployeeId).ToList();
        break;
    default:
        griddata.OrderByDescending(x => x.EmployeeName).ToList();
        break;
}

次のように順序を変更するだけです。

switch (sidx.ToLower())
{
    case "employeeid":
        if (sord.ToLower() == "asc")
           employeeList = employeeList.OrderBy(x => x.EmployeeId).ToList();
        else
           employeeList = employeeList.OrderByDescending(x => x.EmployeeId).ToList();
        break;
    default:
           employeeList = employeeList.OrderByDescending(x => x.EmployeeName).ToList();
        break;
}
griddata = employeeList.Skip((page - 1) * rows).Take(rows).ToList();
于 2015-01-21T19:55:03.950 に答える
0

はい、最終的に簡単な方法で完了しました。非表示フィールドを 1 つ追加しました。

<input type="hidden" id="exampleGrid" value="" />

jqgrid を次のように変更

$(document).ready(function () {
        $("#grid").jqGrid({
            emptyrecords: "No records to view",
            ignoreCase: true,
            datatype: "json",
            url: '@Url.Action("LoadData", "Home")',
            mtype: "GET",
            height: 'auto',
            rowNum: 5,
            rowList: [5, 10, 15, 20],
            colNames: ['EmployeeId', 'EmployeeName', 'EmployeeCity'],
            colModel: [
            { name: 'EmployeeId', index: 'EmployeeId', key: true, width: 200, sorttype: 'int' },
            { name: 'EmployeeName', index: 'EmployeeName', width: 200, sorttype: 'text' },
            { name: 'EmployeeCity', index: 'EmployeeCity', width: 200, sorttype: 'text' }
            ],
            pager: '#pager',
            sortname: 'EmployeeId',
            viewrecords: true,
            loadComplete: function () {
                var page = $('#grid').jqGrid('getGridParam', 'page');
                $("#exampleGrid").val(page);
            },
            onSortCol: function (index, iCol, sortOrder) {
                $('#grid').jqGrid('setGridParam', {
                    page: $("#exampleGrid").val()
                });
            },
            sortorder: "asc",
            caption: "jqGrid Example"
        }).navGrid("#pager",
        { search: false, refresh: false, add: false, edit: false, del: false },
        {},
        {},
        {}
        );
    });
于 2015-01-23T12:44:06.873 に答える