0

我想使用 TextExt 在 SlickGrid 中实现一个自定义编辑器,但我在这样做时遇到了麻烦。

我有两个不同的列表args.column.names和`args.column.values。我希望标签显示选定的名称,但要发布相应 ID 的列表。

这是初稿,我真的不知道如何管理它。

有人可以帮我弄清楚在这些函数中写什么来匹配我想要做的事情吗?

function AutoCompletedTextField(args) {
    var $input;
    var defaultValue;
    var scope = this;

    this.init = function () {
        $input = $("<textarea class='textarea' rows='1'></textarea>")
            .appendTo(args.container)
            .bind("keydown.nav", function (e) {
                if (e.keyCode === $.ui.keyCode.LEFT || e.keyCode === $.ui.keyCode.RIGHT) {
                    e.stopImmediatePropagation();
                }
            })
            .focus()
            .select();

        $('.textarea').textext({
            plugins: 'tags autocomplete arrow'
        }).bind('getSuggestions', function (e, data) {
            var list = args.column.names,
                textext = $(e.target).textext()[0],
                query = (data ? data.query : '') || '';
            $(this).trigger('setSuggestions', { result: textext.itemManager().filter(list, query) });
        });

    };

    this.destroy = function () {
        $input.remove();
    };

    this.focus = function () {
        $input.focus();
    };

    this.getValue = function () {
        return $input.textext()[0].hiddenInput().val();
    };

    this.setValue = function (val) {
        $input.textext()[0].hiddenInput().val(val)
    };

    this.loadValue = function (item) {
        $input[0].defaultValue = item[args.column.field];
        $input.select();
    };

    this.serializeValue = function () {
        return $input[0].defaultValue;
    };

    this.applyValue = function (item, state) {
        item[args.column.field] = state;
    };

    this.isValueChanged = function () {
        return (!($input.textext()[0].hiddenInput().val() == "" && defaultValue == null)) && ($input.textext()[0].hiddenInput().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();
}
4

1 回答 1

0

您可能想试试我的 repo,它已针对最新的 jQuery 进行了更新,并且有很多修复和增强功能。

这些增强功能之一是Select2编辑器,它与您尝试做的非常相似。我认为,如果您检查一下,就会清楚需要什么。
这里有一个例子

作为奖励,还有一种机制允许某些键码冒泡到网格中,而不是被编辑器捕获。这对于向上箭头等很有用。这不在 MLeibman 分支中。

于 2017-04-01T22:20:00.543 回答