Question

有人可以帮助我如何以编程方式为列中的每个单元格设置DataGrid（dojox / grid）单元格中的组合框吗？

结构参数：cellType起作用，但是列中的所有单元格都继承定义的类型。

使用格式化程序功能，我们可以返回Combobox对象，但其行为与插入cellType的Combobox不同。

我也在考虑onStartEdit函数，但是我不知道如何实现它。

我要实现的是，如果单元格中的值是文本，那么我想显示所有可能性的组合框。如果值是数字，那么我根本不想显示组合框。

示例代码：（Dojo版本1.9.11）

 require([
                        "dojo/data/ItemFileReadStore",
                        "dojo/store/Memory",
                        "dojox/grid/DataGrid",
                        "dojo/data/ObjectStore",
                        "dojo/dom",
                        "dojo/dom-construct",
                        "dijit/form/ComboBox", 
                        "dojox/grid/cells/dijit",
                        "dojo/dom-style",
                        "dojo/domReady!"],
                function(ItemFileReadStore, Memory, DataGrid, ObjectStore, dom, domConstruct, ComboBox, dijit, domStyle){

                    var dataArray = [];
                    var dataMemory = new Memory({data:dataArray});

                    var gridStruc = [];                             
                    gridStruc.push({name: 'Name', field: 'col1', width: '100px', editable: false});
                    gridStruc.push({name: 'Type', field: 'col2', width: '100px', editable: false});
                    gridStruc.push({name: 'Value (cellType)', field: 'col3', width: '100px', editable: true, cellType: 'dojox.grid.cells.ComboBox', options: ["Test1","Test2"]});
                    gridStruc.push({name: 'Value (formatter)', field: 'col4', width: '100px', editable: true, formatter: formatterCb});                 

                    var columnObj0 = {};
                    columnObj0["col1"] = "Voltage";
                    columnObj0["col2"] = "Number";
                    columnObj0["col3"] = "5";   
                    columnObj0["col4"] = "5";                       
                    dataMemory.put(columnObj0);
                    var columnObj1 = {};
                    columnObj1["col1"] = "Type";
                    columnObj1["col2"] = "Text";
                    columnObj1["col3"] = "THT"; 
                    columnObj1["col4"] = "THT";                     
                    dataMemory.put(columnObj1);
                    var columnObj2 = {};
                    columnObj2["col1"] = "Num. Reflow";
                    columnObj2["col2"] = "Number";
                    columnObj2["col3"] = "3";   
                    columnObj2["col4"] = "3";                       
                    dataMemory.put(columnObj2);
                    var columnObj3 = {};
                    columnObj3["col1"] = "Series";
                    columnObj3["col2"] = "Text";
                    columnObj3["col3"] = "CBK34";   
                    columnObj3["col4"] = "CBK34";                       
                    dataMemory.put(columnObj3);

                    var dataStore = new ObjectStore({ objectStore: dataMemory});

                    grid = new DataGrid({
                        store: dataStore,
                        structure: gridStruc
                    },"gridDiv");

                    grid.startup();                                 

                    function formatterCb(value, rowIndex, rowItem)
                    {                               
                        var storeItems=[];
                        storeItems.push({name: "Test1", value: "test1"});
                        storeItems.push({name: "Test2", value: "test2"});

                        var store = new ItemFileReadStore({data: {identifier:"name", items: storeItems}});

                        var w = new ComboBox({
                            label: "Use Input",
                            store: store,
                            value: value
                        });
                        w._destroyOnRemove = true;
                        return w;
                    }
                });

Answer 1

我认为定义格式化程序功能可能会有所帮助。看看文档中的this example

function formatCell(value){
    //perform your logic here
}

var layout = [
    {
        name: 'Cell1', 
        field: 'id'
    },
    {
        name: 'Cell2', 
        field: 'date',
        formatter: formatCell
    }
];

在您的情况下，它将在这里：

gridStruc.push({name: 'Name', formatter: formatCell, field: 'col1', width: '100px', editable: false});

我不知道为什么要使用array.push，但是在这种情况下没关系。

还要检查this tutorial，这里有一个示例如何将小部件放在单元格中。可能会有帮助。

在dojo datagrid单元中根据值类型设置组合框

1 个答案: