как закончить встроенное редактирование, начатое кнопкой действия редактирования форматера, если в jqgrid нажата другая строка

Question

Встроенное редактирование запускается с помощью кнопки действия edit formatter. Если щелкнуть по другой строке, старая строка останется в режиме встроенного редактирования.

Как завершить редактирование старой строки, если щелкнуть в другой строке.

Согласно http://www.trirand.com/blog/?page_id=393/bugs/wrong-hovering-effect-in-actions-formatter-of-jqgrid-4-1-0

выглядит так: это решено в 4.1.2, но на самом деле проблема сохраняется.

Обновление

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

// this is jqgrid custom_element property value:
function combobox_element(value, options, width, colName, entity, andmetp) {
    var elemStr;
    if (options.id === options.name)
    // form 
        elemStr = '<div>' +
           '<input class="FormElement ui-widget-content ui-corner-all" style="vertical-align:top" size="' +
                options.size + '"';
    else
        elemStr = '<div>' +
           '<input class="FormElement ui-widget-content " style="height:17px;vertical-align:top;width:' +
                width + 'px" '; 

    elemStr += ' value="' + value + '"' + ' id="' + options.id + '"/>';
    elemStr += '<button style="height:21px;width:21px;" tabindex="-1" /></div>';

    var newel = $(elemStr)[0];
    setTimeout(function () {
        $(newel).parent().css({ display: "inline-block" }).parent().css({ 'padding-bottom': 0 });
  // click in edit button in action input variable is undefined, newel does not contain input element:
   var input = $("input", newel);
    }, 500);
    return newel;
}

Update2

Я пытаюсь объяснить новую проблему более четко. Перед добавлением

                onEdit = @"function (id) {
                if (typeof (lastSelectedRow) !== 'undefined' && id !== lastSelectedRow) {
                   cancelEditing($('#grid'));
                   }
                 lastSelectedRow = id;
              }

Исключение обработчика события для пользовательского элемента не происходит. После добавления обработчика события onEdit ниже настраиваемые элементы редактирования больше не создаются. Поэтому пользовательские элементы редактирования не могут использоваться во встроенном редактировании, если присутствует этот обработчик onEdit. Я закомментировал отменить код редактирования, но проблема сохраняется. Похоже, этот обработчик события onEdit предотвращает создание пользовательского элемента редактирования.

Обновление 3

Я попробовал демо, предоставленное в ответе Олега. Если встроенное редактирование запускается двойным щелчком в строке, кнопки действий не меняются. В этом случае невозможно использовать кнопки сохранения и отмены.

Answer 1

Вы правы. Кажется, ошибка в formatter:"actions" текущей версии jqGrid. Если вы изучите исходный код , вы не найдете переменную, которая сохраняет информацию о последней строке редактирования. Поэтому в зависимости от реализации вашего кода, который использует formatter:"actions", вы можете иметь несколько строк редактирования:

или, по крайней мере, неправильные значки в старой строке редактирования

и вы больше не сможете редактировать предыдущий значок редактирования (потому что у вас нет значка действия "изменить").

В демоверсии Я предлагаю в качестве обходного пути отменить предыдущее редактирование несохраненных строк как в событии onSelectRow jqGrid, так и в событии onEdit formatter:'actions'. Соответствующий фрагмент кода выглядит следующим образом

var grid=$("#list"),
    lastSel,
    cancelEditing = function(myGrid) {
        var lrid;
        if (typeof lastSel !== "undefined") {
            // cancel editing of the previous selected row if it was in editing state.
            // jqGrid hold intern savedRow array inside of jqGrid object,
            // so it is safe to call restoreRow method with any id parameter
            // if jqGrid not in editing state
            myGrid.jqGrid('restoreRow',lastSel);

            // now we need to restore the icons in the formatter:"actions"
            lrid = $.jgrid.jqID(lastSel);
            $("tr#" + lrid + " div.ui-inline-edit, " + "tr#" + lrid + " div.ui-inline-del").show();
            $("tr#" + lrid + " div.ui-inline-save, " + "tr#" + lrid + " div.ui-inline-cancel").hide();
        }
    };

grid.jqGrid({
    // ...
    colModel:[
        {name:'act',index:'act',width:55,align:'center',sortable:false,formatter:'actions',
            formatoptions:{
                keys: true,
                delOptions: myDelOptions,
                onEdit: function (id) {
                    if (typeof (lastSel) !== "undefined" && id !== lastSel) {
                        cancelEditing(grid);
                    }
                    lastSel = id;
                }
            }},
        ...
    ],
    onSelectRow: function(id) {
        if (typeof (lastSel) !== "undefined" && id !== lastSel) {
            cancelEditing($(this));
        }
        lastSel = id;
    }
});

В демоверсии я использую встроенное редактирование при двойном щелчке по строке сетки в дополнение к форматеру действий. Это на самом деле не требуется, но оба могут работать вместе без каких-либо конфликтов.