Question

我正在使用 Ignite UI网格。当特定编辑器专注于新行插入或更新时，我必须打开一个对话框。编辑模式为“行”。

我可以打开对话框，我正在使用 editCellStarted 事件并将编辑器绑定到焦点事件。代码如下：

             $("#Grid").igGrid({
                       primaryKey: "keyCode",                           
                       autoCommit: true,
                       columns: _getColumnsResult,                           
                       features: [
                        {
                            name: 'Updating',                               
                            columnSettings: updateColSettings,                                
                            editMode: 'row',                                
                            editCellStarted: function (evt, ui) {
                              if(ui.columnKey=="Demo")
                             { 
                               $("#" + ui.columnkey + " input").bind('focus', { id: ui.columnIndex}, function (e) {                                          
                                $("dialog1").dialog();                                            
                               });                                  
                             }                                                                   
                            },          
                        }, //Updating feature ended                  
                        {
                            name: "Sorting",
                            type: "local",
                        },
                        {
                            name: "Selection",
                            mode: "row",
                            rowSelectionChanged: function (evt, ui) { Selectedrow = ui.row.index }
                        }]
                    });

问题： 单击add new时，如果该特定列是第一列，焦点将转到对话框并返回到编辑器。焦点不会保留在对话框中。

但是如果列不是第一列，则代码工作正常。

请帮助完成此任务。提前谢谢。

这里是fiddle。

Answer 1

我无法在这里测试，如果你能提供一个jsFiddle作为一个例子会很好但是可能是其他东西绑定到那个将焦点返回到行的事件，你可以尝试更改代码要添加的if子句：

$("#" + ui.columnkey + " input").bind('focus', { id: ui.columnIndex}, function (e) {                                          
    e.stopPropagation();
    $("dialog1").dialog();
});

停止焦点事件触发任何其他处理程序。

否则你将不得不弄清楚什么导致焦点回到那一行。

编辑

好的，所以看起来焦点实际上是在那里（在对话框事件触发之前），不确定为什么对话框没有保持焦点 - 也许它是异步的，那里有一个计时问题，但是你可以修复它只是强迫焦点到对话框。我在您的输入中添加了一个ID，然后在事件处理程序中使用它：

$("#" + ui.columnKey + " input").bind('focus', function (e) {
    $("#dialog").dialog();
    $("#dia_inputbox").focus();
});

工作小提琴here

另外，我原本以为你不需要绑定到focus，而只是直接在editCellStarted的处理程序中弹出对话框 - 这有效但你无法移动焦点返回，如果停止传播，则单元格无法正确编辑。我也试过editCellStarting。上面的解决方案有效，但感觉有点像黑客，应该有一种方法可以更干净地做到这一点，但我不确定它是什么。

Answer 2

作为替代方案，由于您提供编辑器选项，如果仅在一个字段上需要此对话框，则可能会处理某些editor events而不是？像这样：

//...
 {
    columnKey: "Name",
    editorOptions: {
        id: "Name",
        type: 0,
        focus: function (evt) {
            $("#dialog").dialog().children("input").focus();
        }
    }
}
//...

Fiddle

在所有编辑器上处理焦点事件（并将其删除）使它们无法编辑，从而破坏了它们的目的。它几乎就像使用row edit template一样，如果这就是你所追求的（是的，你仍然可以使用编辑器事件在那里弹出一个对话框）。如果你让我更深入地了解对话背后的想法，我可能会提供更多的方法来实现它：）

如何在iggridupdating编辑器焦点上打开一个jquery对话框

2 个答案: