在jqGrid中内联编辑行时排序列问题 [英] Issue with sorting column while editing rows inline in jqGrid

问题描述

我对网格的使用涉及到排序，同时在行内编辑模式下有几行.

My use of the grid involves sorting while having a few rows in inline edit mode.

问题可能是:

1. 在内联编辑一个或多个行时，有什么方法可以执行排序?

1. Is there any way to execute sorting, while inline editing one or more rows?

如果不是，那么在内联编辑一个或多个行时单击列标题时是否会发生跳跳事件?(在对内容进行排序之前，我可以删除编辑内容的事件)

If not, is there an event that will jump when I click the column headers while inline editing one or more rows?(an event where I can maybe remove the editing, before sorting the contents)

谢谢，卡塔琳

推荐答案

一个有趣的问题！向我+1.

An interesting question! +1 from me.

对编辑行或单元格进行排序的问题在于对编辑单元格包含的访问. jqGrid的当前代码不执行此操作，因此在列标题的click事件处理程序内部，测试网格中是否有任何编辑行.如果存在一些编辑行，则排序将停止而停止，以调用onSortCol回调.

The problem with sorting of editing rows or cells consists in the access to the contain of the editing cells. The current code of jqGrid don't do this and so inside of the click event handler on the column headers there are test whether there are any editing line in the grid. If some editing line/lines exist then the sorting will be stopped without to call of onSortCol callback.

因此，只有第二种方法可以在排序之前保存或恢复编辑单元格.要实现这一点，有一个小问题.如果在列标题上绑定了另一个click事件，它将在jqGrid的上一个绑定标准处理程序之后称为.因此，无法保存或放弃在单击事件发生前 所做的更改.一个人可以通过两种方式解决该问题:要么可以从新事件处理程序中调用sortData函数，要么应该更改与click事件的绑定顺序.以下代码演示了第二种方法:

So only the second way where one save or restore the editing cells before sorting is possible. To implement this there are one small problem. If one bind additional click event on the column headers it will be called after the previous bound standard handler of jqGrid. So one can't save or discard the editing changed before the click event will be processed. One can fix the problem in two ways: either one can call sortData function of from the new event handler or one should change the order of bindings to the click event. The following code demonstrate the second approach:

$.each($grid[0].grid.headers, function () {
    var $th = $(this.el), i, l, clickHandler, clickHandlers = [],
        currentHandlers = $th.data('events'),
        clickBinding = currentHandlers.click;

    if ($.isArray(clickBinding)) {
        for (i = 0, l = clickBinding.length; i < l; i++) {
            clickHandler = clickBinding[i].handler;
            clickHandlers.push(clickHandler);
            $th.unbind('click', clickHandler);
        }
    }
    $th.click(function () {
        var p = $grid[0].p, savedRow = p.savedRow, j, len = savedRow.length;
        if (len > 0) {
            // there are rows in cell editing or inline editing
            if (p.cellEdit) {
                // savedRow has the form {id:iRow, ic:iCol, name:nm, v:value}
                // we can call restoreCell or saveCell
                //$grid.jqGrid("restoreCell", savedRow[0].id, savedRow[0].ic);
                $grid.jqGrid("saveCell", savedRow[0].id, savedRow[0].ic);
            } else {
                // inline editing
                for (j = len - 1; j >= 0; j--) {
                    // call restoreRow or saveRow
                    //$grid.jqGrid("restoreRow", savedRow[j].id);
                    $grid.jqGrid("saveRow", savedRow[j].id);
                }
            }
        }
    });
    l = clickHandlers.length;
    if (l > 0) {
        for (i = 0; i < l; i++) {
            $th.bind('click', clickHandlers[i]);
        }
    }
});

其中，$grid被定义为var $grid = $("#list").您可以在以下示例中实时查看其工作原理.

where $grid are defined as var $grid = $("#list"). You can see live how it works on the following demo.

这篇关于在jqGrid中内联编辑行时排序列问题的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！