如何让 cellWidgets 中的 dojo gridx dojo 小部件自动写入商店？

Posted 2023-02-26

【中文标题】如何让 cellWidgets 中的 dojo gridx dojo 小部件自动写入商店？

【英文标题】：How do I get my dojo gridx dojo widgets residing in cellWidgets to write to the store automatically?

【发布时间】：2015-05-13 13:34:15

【问题描述】：

在具有editable: true 的文本单元格上，我没有问题写入商店 - 单元格会自动写入商店，但我的任何 cellWidgets 都没有写入商店。

这是我的代码的 sn-p（注释掉的最上面的 2-5 行是我没有运气尝试过的其他内容）：

             id: 'identColumnId', field: 'identColumn', name: 'Ident', width: '77px',
                // editable: true,
                // editor: 'dijit/form/ComboButton',
                // editorArgs:
                //     props:'store: identMemStore'
                // ,
                widgetsInCell: true,
                navigable: true,
                setCellValue: function(one,two,cellWidget)
                    var rowIndex = cellWidget.cell.row.id;
                    var toggle = identMemStore.get(rowIndex).identColumn;
                    if (toggle)
                    
                        this.identColumn.set('label', "Override");
                        this.identColumn.set("checked",false);
                    else
                    
                        this.identColumn.set('label', "Use Input");
                        this.identColumn.set("checked",true);
                    
                ,
                getCellWidgetConnects: function(cellWidget, cell)
                    // return an array of connection arguments
                    return [
                        [cellWidget.identColumn, 'onClick', function(e)
                            var rowIndex = cellWidget.cell.row.id;
                            var curValue = identMemStore.get(rowIndex).identColumn;

                            if (curValue === true)
                                cellWidget.identColumn.set('label', "Use Input");
                                cellWidget.identColumn.set("checked",true);
            // Write to store manually...
                                // identMemStore.data[rowIndex-1].identColumn = false;
                             else if (curValue === false)
                                cellWidget.identColumn.set('label', "Override");
                                cellWidget.identColumn.set("checked",false);
            // Write to store manually...
                                // identMemStore.data[rowIndex-1].identColumn = true;
                             else 
                                console.log("ERROR");
                                                                
                        ]
                    ];
                ,
                decorator: function()
                    return "<button data-dojo-type='dijit/form/ToggleButton' data-dojo-attach-point='identColumn' ></button>";
                
            ,

我还设置了代码以在将数据写入存储后捕获单元格编辑的更改。同样，我的文本单元格工作得很好，并且执行了以下代码，但是我的其他 dojo 小部件不会写入存储，因此不会触发在编辑完成并且存储已完成后执行的以下代码写给。

identGridx.edit.connect(identGridx.edit, "onApply", function(cell, success) 
    var item = cell.row.data();
    var id = cell.row.id;
    console.log('Row with ID ' + id + ' is modified. New value: ' + item);
);

如何让 cellWidgets 中的 dojo 小部件写入 gridx 存储？？

【问题讨论】：

您尝试手动写入存储的注释代码是否有问题？

我正在尝试让我的 cellWidget 中的 dojo 小部件自动写入商店。我发现答案似乎在于编辑模块（靠近顶部的注释掉的代码）。我目前正在尝试修改我的代码以让我的 cellWidget 自动写入商店。

我无法让它工作......

你能做一个小提琴让我看到你所有的代码吗？

@Richard 再次感谢您的帮助，但我将继续前进。我以不同的方式解决了它。我将发布一个答案，显示有关编辑模块的信息是解决它的正确方法。

【参考方案1】：

通过正确设置编辑模块，您可以将任何 cellWidget 自动保存到商店。请参阅此文档：Dojo Edit Module

当网格包含编辑模块时，这并不意味着所有单元格都可以立即编辑。相反，我们必须告诉网格哪些列包含可编辑字段。为此，我们将名为 editable 的列属性设置为 true。默认值为 false，这意味着该列中的单元格不可编辑。

当要编辑单元格时，会在屏幕上单元格的位置创建一个新的 Dojo 小部件 (Dijit) 实例。这个小部件负责显示当前值并允许用户更改该值。默认情况下，使用的小部件是 dijit.form.TextBox 的一个实例，但是可以使用不同的小部件类型。应将名为 editor 的属性设置为要使用的 Dijit 类的字符串名称。如果使用，请记住定义此类类型的 AMD 包含。另一个名为 editorArgs 的列属性可用于为在编辑器中命名的小部件提供属性。 editorArgs 属性是一个具有以下属性的对象：

props (String) - Dijit 小部件上定义的一组属性 fromEditor (function(storeData, gridData)) toEditor (function(storeData, gridData, cell, editor)) - 调用函数来填充编辑器小部件。 editor 参数是对用于编辑单元格的 Dijit 小部件的引用。 constraints (Object) - 传递给编辑器的附加属性。 useGridData (Boolean) - 应该为编辑器提供来自 Store 还是来自 Grid 的数据？默认为 false，表示使用存储数据。如果提供了 toEditor，则不使用此属性。 valueField (String) - 保存值的编辑器的属性。这通常是默认值。

当单元格的编辑完成后，输入的数据将被写回到存储中。我们可以通过提供一个要调用的函数来使用我们自己的逻辑来应用更改来更改实现此目的的方式。其属性是 customApplyEdit，它是一个带有签名函数（单元格，值）的函数。将单元格的值设置为作为参数传入的值是代码的责任。

查看这个 jsfiddle：Working example