首页
学习
活动
专区
圈层
工具
发布
社区首页 >问答首页 >Slickgrid -更改单个单元格的编辑器,而不是整列

Slickgrid -更改单个单元格的编辑器,而不是整列
EN

Stack Overflow用户
提问于 2015-01-07 11:06:25
回答 1查看 2.2K关注 0票数 0

下面是一个场景:

  • 有许多行可选择的数据。
  • 一列(#1)有带有两个选项的下拉编辑器
  • 下一列(#2)可以有文本编辑器,也可以有下拉编辑器-取决于在第一个下拉列表中选择的选项,请参见示例: _________Column #1_________|_________Column #2_________ 1     select opt 1      |      *dropdown editor*成品率 2     select opt 1      |      *dropdown editor*成品率 3     select opt 1      |      *dropdown editor*成品率 4     select opt 2      |      *text editor*-这可能吗? 5     select opt 1      |      *dropdown editor*成品率 6     select opt 1      |      *dropdown editor*成品率

是否可以根据另一个单元格的输入/更改来更改单个单元格的编辑器?您似乎不能在单元格级别上更改编辑器,但只能在列级别上更改编辑器。

任何帮助都是非常感谢的,已经花了很多时间在这个问题上,而且还没有找到解决办法,甚至也没有找到类似的问题。谢谢

更新

这可能是近在咫尺:

代码语言:javascript
复制
var currentRowIndex = object.grid.getActiveCell().row,
    nextCellIndex = object.grid.getActiveCell().cell + 1;
object.grid.setActiveCell(currentRowIndex, nextCellIndex);
object.grid.editActiveCell(this.editors.textEditor);

但这并不能确保编辑器保持不变;例如,^文本编辑器。当更改第一列(#1)中的值并启用上面第2列中的文本编辑器时(在进行此编辑之后),原始编辑器仍在第2列中。

我希望编辑器保持不变--但无法找到如何在单元格级而不是列级别上执行此操作。谢谢

EN

回答 1

Stack Overflow用户

发布于 2015-01-07 17:47:58

浏览来源 (getEditor第1381行),涉及编辑器的检索,揭示了几个不同的选项可用。

考虑到您需要行内的一个不同的列值,我将使用列元数据来处理这个问题,因为它接收rowIndex作为参数。

代码语言:javascript
复制
var viewModel = {options: ['LongText', 'Text', 'Checkbox']}
 
function apply() {
    var grid, data = [];
        
    var options = {
        editable: true,
        enableCellNavigation: true,
        asyncEditorLoading: false,
        autoEdit: true,
        forcefitColumns: false
         
    };

    var columns = [{
        id: "data",
        name: "Editor Type",
        field: "type",
        width: 120,
        cssClass: "cell-title" ,
        formatter: function(row){ 
            var key = 'input'+row;
            
            if(!viewModel[key]){
              viewModel[key] = ko.observable();
              viewModel[key].subscribe(function(nv){
              
              data[row].type = nv
            })
           }
             
            setTimeout(function(){ ko.applyBindings(viewModel, document.getElementById(key))  }, 250);
            return '<select id="'+key+'", data-bind="options: options, value: '+key+'"></select>'
        }
       },
       {
        id: "other",
        name: "Other",
        field: "other",
        width: 120,
        cssClass: "cell-title",
         
    }];

    for (var i = 0; i < 5; i++) {
        var d = (data[i] = {});

        d["type"] =  "";
        d["other"] = "Default " + i;
    }

    grid = new Slick.Grid("#myGrid", data, columns, options);
    //ko.applyBindings(viewModel)

    data.getItemMetadata=function(row){
    
        var rowData = data[row]
        //console.log(rowData)
        var metaData = {columns:{other: {}}}
        metaData.columns.other.editor = Slick.Editors[rowData.type]
         
        return metaData
    }
   
}

apply()
代码语言:javascript
复制
<script src="https://cdnjs.cloudflare.com/ajax/libs/knockout/3.2.0/knockout-min.js"></script>
<link rel="stylesheet" type="text/css" href="http://JLynch7.github.io/SlickGrid/slick.grid.css">
<script src="http://code.jquery.com/jquery-2.1.1.min.js"></script>
<script src="http://code.jquery.com/ui/1.11.0/jquery-ui.min.js"></script>
<script src="http://JLynch7.github.io/SlickGrid/slick.dataview.js"></script>
<script src='http://mleibman.github.io/SlickGrid/lib/jquery.event.drag-2.2.js'></script>
<script src='http://JLynch7.github.io/SlickGrid/slick.core.js'></script>
<script src='http://JLynch7.github.io/SlickGrid/slick.grid.js'></script>
<script src='http://JLynch7.github.io/SlickGrid/slick.formatters.js'></script>
<script src='http://JLynch7.github.io/SlickGrid/slick.editors.js'></script>

<div id='container'>
    <div id="myGrid" style="width:600px;height:300px;"></div>
</div>

票数 1
EN
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接:

https://stackoverflow.com/questions/27818057

复制
相关文章

相似问题

领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档