将新值添加到 SlickGrid 中的下拉单元编辑器答案

【问题标题】：Add new values to dropdown cellEditor in SlickGrid将新值添加到 SlickGrid 中的下拉单元编辑器
【发布时间】：2018-04-05 08:23:42
【问题描述】：

我想复制 JQuery UI combobox 并可以即时添加新选择。

用例是从一列中已经存在的内容中进行选择，同时能够键入一个新值并将其添加到我在同一列中编辑的下一个单元格的菜单中（非常类似于Alt + Arrow Down在 Excel 文件中。

我已经有以下代码定义选择单元格编辑器。每列的选项在grid 初始化时存储为"Option1,Option2,Option3"string。它们存储在全局变量中。如果用户手动输入列表中没有的内容，我该如何添加添加到这些选项的可能性？

    var SelectCellEditor = function(args) {
    var $select;
    var defaultValue;
    var scope = this;

    this.init = function() {

        if(args.column.options){
          opt_values = args.column.options.split(',');
        } else {
          opt_values ="".split(',');
        }
        option_str = "";
        for( i in opt_values ){
          v = opt_values[i];
          option_str += "<OPTION value='"+v+"'>"+v+"</OPTION>";
        }
        $select = $("<INPUT type='text' list='myoptions' tabIndex='0' class='editor-select' /><datalist id='myoptions'>"+ option_str +"</datalist>");
        $select.appendTo(args.container);
        $select.focus();
    };

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

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

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

    this.serializeValue = function() {
        if(args.column.options){
          return $select.val();
        }else{
          return ($select.val() == "");
        }
    };

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

    this.isValueChanged = function() {
        return ($select.val() != defaultValue);
    };

    this.validate = function() {
        return {
            valid: true,
            msg: null
        };
    };

    this.init();
}

【问题讨论】：

标签： javascript slickgrid

【解决方案1】：

从 Slickgrid 的角度来看，只需确保您已在“引导、动态网格和第三方组件编辑器”部分签出 examples。这些是很好的模板，可以用作起点。

但是，您的问题与 jQueryUI 自动完成有关。应该有几种方法可以通过 Autocomplete API 做到这一点。试试here 和here

【讨论】：

好的，谢谢你看看。是不是有一个事件在修改后给我返回单元格的值，以便我可以检查它是否存在于我的选项列表中，并在需要时添加到列表中？
我知道 SlickGrid 但不知道 jQueryUI 自动完成。我认为这些链接可以回答这个问题。这在一定程度上取决于您用于添加值的机制。那里也有讨论。