【问题标题】:Slickgrid editor finish eventSlickgrid 编辑器完成事件
【发布时间】:2018-11-11 16:39:55
【问题描述】:

我已设置Editors.Text 或编辑。

 {id: "label", name: "name", field: "label",editor: Editors.Text,width: 80},

这可以在浏览器上编辑字段。

但是我怎样才能捕捉到编辑完成的时候呢??

我正在检查 slickgrid 的事件list

但是找不到合适的事件。

编辑栏目后如何捕捉事件?

【问题讨论】:

    标签: javascript slickgrid


    【解决方案1】:

    似乎没有通用的事件 - 添加一个可能不是一个坏主意。我怀疑您应该编写一个自定义编辑器并将事件直接添加到该编辑器中,而不是将其添加到网格中。

    我假设您想在编辑完成后更新一些相关数据或 UI?

    [编辑]

    编辑器为此封装了事件 - 网格使用带有loadValueapplyValue 的插件模型来读取/写入数据源。我将在此处发布我的个人文本编辑器的示例,因为它可能会有所帮助。请注意,我已经为我的个人网格编写了一个数据提供程序,以允许它与多个自定义数据对象接口 - 这不是您应该使用的标准,即here

    function TextEditor(args) {
        var $input;
        var defaultValue;
        var scope = this;
    
        this.init = function () {
            $input = $("<INPUT type=text class='editor-text' />")
          .appendTo(args.container)
          .on("keydown.nav", function (e) {
              if (e.keyCode === $.ui.keyCode.LEFT || e.keyCode === $.ui.keyCode.RIGHT) {
                  e.stopImmediatePropagation();
              }
          })
          .focus()
          .select();
            $input.width(args.container.clientWidth); /* mod */
        };
    
        this.destroy = function () {
            $input.remove();
        };
    
        this.focus = function () {
            $input.focus();
        };
    
        this.getValue = function () {
            return $input.val();
        };
    
        this.setValue = function (val) {
            $input.val(val);
        };
    
        this.loadValue = function () {
            defaultValue = args.grid.getDataProvider().getValueByColName(args.rowIndex, args.column.field);
            defaultValue = defaultValue || "";
            $input.val(defaultValue);
            $input[0].defaultValue = defaultValue;
            $input.select();
        };
    
        this.serializeValue = function () {
            return $input.val();
        };
    
        this.applyValue = function (state) {
            args.grid.getDataProvider().setValueByColName(args.rowIndex, args.column.field, state);
        };
    
        this.isValueChanged = function () {
            return (!($input.val() == "" && defaultValue == null)) && ($input.val() != defaultValue);
        };
    
        this.validate = function () {
            if (args.column.validator) {
                var validationResults = args.column.validator($input.val());
                if (!validationResults.valid) {
                    return validationResults;
                }
            }
    
            return {
                valid: true,
                msg: null
            };
        };
    
        this.init();
    }
    

    【讨论】:

    • 是的,我想根据浏览器上的编辑更新数据库实体。我很惊讶编辑完成后没有回调。(如果是,他们如何更新数据库???,添加“更新”按钮??看起来很尴尬。)
    • 我从 slickgrid 源复制并粘贴 TextEditor 函数并将其命名为 myTextEditor 然后,将 Ajax 用于更改 this.isValueChanged 函数中的数据。它按我的意图工作。非常感谢。
    猜你喜欢
    • 1970-01-01
    • 2012-08-22
    • 2011-03-13
    • 1970-01-01
    • 2020-02-20
    • 2012-02-16
    • 2012-08-10
    • 1970-01-01
    • 2015-08-14
    相关资源
    最近更新 更多