how select content value cell when update row jqgrid

Question

I can edit jqgrid row as follows. When I edit inline, when click on cell when edit row .select content value cell or highlight cells content value this demo plaese see demo: https://jsfiddle.net/amir3164/dnfk8hmr/156/ i want this like imge

this my code when edit

  $grid.jqGrid({
        data: data,
        colModel: [
            { name: "act", template: "actions" },
            { name: "id", width: 50, template: "integer" },
            { name: "get", width: 50, template: "integer" },
            { name: "PackageCode", width: 110 , editable: true },
            { name: "Name", width: 200, editable: true }
        ],
 inlineNavOptions: {
            add: true,
            edit: true,
            addParams: {
                position: "last", //ردیف‌های جدید در آخر ظاهر می
                rowID: function (options) {
                    return 123 + $.jgrid.guid++;
                },
                useDefValues: true
            }
        }
    }).jqGrid("filterToolbar")
        .jqGrid("navGrid")
      .jqGrid("inlineNav");
});

Answer 1

One can use HTMLInputElement.select() method on the <input> element after inline editing will be started. The corresponding code could be the following:

inlineEditing: {
    focusField: "PackageCode",
    oneditfunc: function (rowid) {
        var $control = $("#" + $.jgrid.jqID(rowid + "_PackageCode"));
        if ($control.length > 0) {
            $control[0].select();
        }
    }
}

See https://jsfiddle.net/dnfk8hmr/159/

UPDATED: The select the input text onClick one need to call select() inside of onClick or onFocus event handler. For example, to make onClick binding for all editing fields you can use cmTemplate:

cmTemplate: {
    editoptions: {
        dataEvents: [ 
            {
                type: "click",
                fn: function () {
                        $(this).select();
                    }
            }
        ]
    }
}

See https://jsfiddle.net/OlegKi/dnfk8hmr/161/