0

オートコンプリート列を備えたjqGrid（インライン編集を使用）があります。ユーザーがオートコンプリート列から値を選択すると、イベントハンドラーは別の列に値を設定し、オートコンプリート列の値をlabelオートコンプリートソースから返された値以外に設定します。2つの列の定義（ここに完全な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;
                }
            });
        }
    }},

問題は、ユーザーがオートコンプリートから値をクリックするか、矢印を使用してTabキーを押すたびに値を選択すると、そのセルは編集できなくなり、グリッドが完全にフォーカスを失ったように見えることです。cartoonセル値を設定する行をコメントアウトすると、正常に動作します。この動作を回避する方法はありますか？cartoonユーザーが編集を完了するまで、列を含む行全体を編集モードのままにする必要があります。

jqGrid 4.4.1
jQuery 1.7.2
jQuery UI 1.8.18

4

1 に答える 1

2

jQuery UIオートコンプリートはデフォルトごとにとを検査するためName、アイテムのプロパティの名前をからに変更する必要があります（ドキュメントを参照）。autocompleteSourcevaluelabelvalue

現在編集モードになっている列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/を参照してください

于 2012-10-09T05:47:53.390 に答える