【问题标题】:how select content value cell when update row jqgrid更新行jqgrid时如何选择内容值单元格
【发布时间】:2018-02-02 06:05:11
【问题描述】:

我可以按如下方式编辑 jqgrid 行。当我编辑内联时,在编辑行时单击单元格。选择内容值单元格或突出显示单元格内容值 这个演示请看演示:https://jsfiddle.net/amir3164/dnfk8hmr/156/ 我想要这样的图片

这是我编辑时的代码

  $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");
});

【问题讨论】:

    标签: jqgrid


    【解决方案1】:

    在内联编辑开始后,可以在<input>元素上使用HTMLInputElement.select()方法。对应的代码如下:

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

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

    更新:选择输入文本 onClick 需要在 onClick 或 onFocus 事件处理程序中调用 select()。例如,要对所有编辑字段进行 onClick 绑定,您可以使用cmTemplate

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

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

    【讨论】:

    • 谢谢。但是我想在单击文本框时选择内容值。对于单击名称时的示例。内联编辑时选择内容值
    • @saeed3164:请参阅我的答案的更新部分。
    猜你喜欢
    • 2017-03-10
    • 2019-02-11
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2015-12-18
    • 2011-10-23
    • 1970-01-01
    • 1970-01-01
    相关资源
    最近更新 更多