Question

嗨我有一个在IE8中完美运行的slickgrid表，在IE10中，Tab键断开。

在页面上有一个表单，用作过滤器来更改Slick Grid显示的内容。它有许多文本框。

如果我单击可编辑单元格并输入值，然后按Tab键。下一列按预期突出显示，但光标会跳到表单的第一个文本框。

我已将Slick Grid更新为最新版本

我的列定义如下

var columns = [
        { id: 'ParameterOrder', name: 'Order', field: 'ParameterOrder', width: 50 },
        { id: 'CanEnableManualChange', name: 'Enable Manual Change', field: 'CanEnableManualChange', cssClass: 'center', formatter: Slick.Formatters.Checkbox, editor: Slick.Editors.Checkbox, width: 100 },
        { id: 'Name', name: 'Parameter Name', field: 'Name', editor: Slick.Editors.Text, width: 185},
        { id: 'ParameterType', name: 'Parameter Type', field: 'ParameterType', editor: Slick.Editors.Text, width: 185},
        { id: 'LowSpecLimit', name: 'Low Spec Limit', field: 'LowSpecLimit', editable: isEipEditable, focusable:true , editor: Slick.Editors.DecimalEditor, width: 115, valueChangedEvent: trackChangesFunction },
        { id: 'LowControlLimit', name: 'Low Control Limit', field: 'LowControlLimit', editable: isEipEditable, focusable:true, editor: Slick.Editors.DecimalEditor, width: 115, valueChangedEvent: trackChangesFunction },
        { id: 'NominalValue', name: 'Nominal Value', field: 'NominalValue', editable: isEipEditable, editor: Slick.Editors.DecimalEditor, width: 115, valueChangedEvent: trackChangesFunction },
        { id: 'HighControlLimit', name: 'High Control Limit', field: 'HighControlLimit', editable: isEipEditable, editor: Slick.Editors.DecimalEditor, width: 115, valueChangedEvent: trackChangesFunction },
        { id: 'HighSpecLimit', name: 'High Spec Limit', field: 'HighSpecLimit', editable: isEipEditable, editor: Slick.Editors.DecimalEditor, width: 115, valueChangedEvent: trackChangesFunction },
        { id: 'ParameterCategoryId', name: 'Parameter Category', field: 'ParameterCategoryId', options: Slick.OptionArray.MakeFromHtmlSelectList($("#DefineParameter_ParameterCategoryId")), formatter: Slick.Formatters.SelectList, editor: Slick.Editors.SelectCellEditor, width: 115 }
    ];

修改这是我正在研究的项目中找到的slickGrid的扩展

$.extend(true, window, {
mySlick: {
    getGrid: function (container, data, columns, options) {
        var editOptions = mySlick.refreshEditOption(columns, options.editable);
        options.actualGridEdit = options.editable;
        options.editable = editOptions.isGridEditable;

        return new Slick.Grid(container, data, editOptions.columns, options);
    },

    refreshEditOption: function (columns, isGridEditable) {
        var editableColumns = _.filter(columns, function (item) { return item.editable != null && item.editable; });

        var nonEditableColumns = _.filter(columns, function (item) { return (item.editable == null || !item.editable) && !isGridEditable; });

        if (editableColumns.length > 0 && !isGridEditable) {
            // make the grid editable
            isGridEditable = true;

            // sets non editable columns to readonly by removing Editor property
            _.each(columns, function (item) {
                if (item.editable == null || !item.editable) {
                    delete item.editor;
                }
            });
        }

        if (nonEditableColumns.length > 0) {
            // sets non editable columns to readonly by removing Editor property
            _.each(columns, function (item) {
                if (item.editable == null || !item.editable) {
                    delete item.editor;
                }
            });
        }
        return { columns: columns, isGridEditable: isGridEditable };
    }
}
});

这叫做

var data = JSON.parse($('#DefineParameter_ParametersObject').val() || null) || [];

var options = {
        editable: isGridEditable,
        enableCellNavigation: true,
        autoEdit: true,
        enableColumnReorder: false,
        orderField: 'ParameterOrder'
    };

grid = mySlick.getGrid('#DefineParametersGrid', data, columns, options);

Answer 1

嗨，在将我们的JQuery版本更新到最新版本之后，这个问题似乎已经解决了。我不确定是什么导致它或为什么会发生但现在已经修复了。

在IE10 Slickgrid标签中断

1 个答案: