Встроенное редактирование jqGrid: странное поведение с автозаполнением столбца

У меня есть jqGrid (используя встроенное редактирование) с автозаполнением столбца. Когда пользователь выбирает значение из столбца автозаполнения, обработчик события устанавливает значение в другом столбце, а также устанавливает значение в столбце автозаполнения в нечто иное, чем label возвращается из источника автозаполнения. Определения двух столбцов (полный пример jsFiddle здесь):

{
    name: 'cartoonId',
    index: 'cartoonId',
    width: 90,
    editable: false},
{
    name: 'cartoon',
    index: 'cartoon',
    width: 200,
    editable: true,
    edittype: 'text',
    editoptions: {
        dataInit: function(elem) {
            $(elem).autocomplete({
                source: autocompleteSource,
                select: function(event, ui){
                    var rowId = $("#inlineGrid").jqGrid('getGridParam', 'selrow');
                    if(ui.item){
                        $("#inlineGrid").jqGrid('setCell', rowId, 'cartoonId', ui.item.CartoonId);
                        $("#inlineGrid").jqGrid('setCell', rowId, 'cartoon', ui.item.Name);                            
                    }
                    return false;
                }
            });
        }
    }},

Проблема состоит в том, что всякий раз, когда пользователь выбирает значение из автозаполнения, щелкая его или используя стрелки и нажимая клавишу табуляции, эта ячейка больше не редактируется, и сетка, по-видимому, теряет фокус полностью. Если я закомментирую строку, которая устанавливает cartoon значение ячейки, оно ведет себя нормально. Есть ли способ, которым я могу обойти это поведение? Мне нужно, чтобы вся строка оставалась в режиме редактирования, включая cartoon столбец, пока пользователь не завершит редактирование.

jqGrid 4.4.1
JQuery 1.7.2
JQuery UI 1.8.18

1 ответ

Решение

Вы должны переименовать Name свойство предметов из autocompleteSource в value потому что JQuery UI Autocomplete исследует label а также value по умолчанию (см. документацию).

Вы не можете использовать setCell из 'cartoon' столбец, который в данный момент находится в режиме редактирования. Вы должны удалить return false; от select Обратный звонок тоже. Так что код может выглядеть примерно следующим

dataInit: function (elem) {
    $(elem).autocomplete({
        source: autocompleteSource,
        select: function (event, ui) {
            var rowId = $("#inlineGrid").jqGrid('getGridParam', 'selrow');
            if (ui.item) {
                $("#inlineGrid").jqGrid('setCell', rowId, 'cartoonId',
                    ui.item.CartoonId);
            }
        }
    });
}

Смотрите http://jsfiddle.net/27dLM/38/

Другие вопросы по тегам