Excel像SlickGrid一样的行为 [英] Excel like behavior with SlickGrid

问题描述

我想用SlickGrid模仿电子表格的特定行为.用户:

1. 点击一个单元格将其激活
2. 输入=sum(或任何公式
3. 原始单元格地址已保存
4. 用户选择单元格范围(假设原始单元格关闭了编辑器)
5. 焦点返回到原始单元格，并附加了新的单元格范围.即= sum(r1c1，r2c2).

让我烦恼的是需要改变焦点.

var cell_with_formula = null;
grid = new Grid($("#myGrid"), data, columns, options);

// save original cell address, but there is no onBlur event
grid.onBlur = function(args){
  cell_with_formula = args; // save address
}; 

grid.onCellRangeSelected = function(){
  if(cell_with_formula){
    // check if cell_with_formula has `=` at begining
    // if so, append selected range    
    cell_with_formula = null;
  }
}; 

提前谢谢！

解决方案

在SlickGrid 1.4.x中这是不可能的，但是当前仍在积极开发中的2.0版本将支持该功能. Alpha托管在GitHub上的一个单独分支中- https://github.com/mleibman/SlickGrid/tree/v2.0a ，我只是通过示例检入了支持此功能的初步代码.请参阅 https://github.com/mleibman/SlickGrid/commit/17b1bb8f3c43022ee6aec89dcab185cd368b878. /p>

这是基本的公式编辑器实现:

function FormulaEditor(args) {
    var _self = this;
    var _editor = new TextCellEditor(args);
    var _selector;

    $.extend(this, _editor);

    function init() {
        // register a plugin to select a range and append it to the textbox
        // since events are fired in reverse order (most recently added are executed first),
        // this will override other plugins like moverows or selection model and will
        // not require the grid to not be in the edit mode
        _selector = new Slick.CellRangeSelector();
        _selector.onCellRangeSelected.subscribe(_self.handleCellRangeSelected);
        args.grid.registerPlugin(_selector);
    }

    this.destroy = function() {
        _selector.onCellRangeSelected.unsubscribe(_self.handleCellRangeSelected);
        grid.unregisterPlugin(_selector);
        _editor.destroy();
    };

    this.handleCellRangeSelected = function(e, args) {
        _editor.setValue(_editor.getValue() + args.range);
    };


    init();
}

I'd like to mimic a particular behavior of spreadsheets with SlickGrid. The user:

1. clicks on a cell to activate it
2. enters =sum(, or whatever formula,
3. the original cell address is saved
4. the user selects the cell range (I assume that the original cell closes the editor)
5. focus is returned to the original cell with the new cell range appended. i.e. =sum(r1c1,r2c2).

What's throwing me off is the need to change focus.

var cell_with_formula = null;
grid = new Grid($("#myGrid"), data, columns, options);

// save original cell address, but there is no onBlur event
grid.onBlur = function(args){
  cell_with_formula = args; // save address
}; 

grid.onCellRangeSelected = function(){
  if(cell_with_formula){
    // check if cell_with_formula has `=` at begining
    // if so, append selected range    
    cell_with_formula = null;
  }
}; 

Thanks in advance!

解决方案

This is not possible in SlickGrid 1.4.x, but is going to be supported in the version 2.0 that is currently still under active development. The alpha is hosted in a separate branch on GitHub - https://github.com/mleibman/SlickGrid/tree/v2.0a, and I just checked in preliminary code that supports this with an example. Please see https://github.com/mleibman/SlickGrid/commit/17b1bb8f3c43022ee6aec89dcab185cd368b8785.

Here's a basic formula editor implementation:

function FormulaEditor(args) {
    var _self = this;
    var _editor = new TextCellEditor(args);
    var _selector;

    $.extend(this, _editor);

    function init() {
        // register a plugin to select a range and append it to the textbox
        // since events are fired in reverse order (most recently added are executed first),
        // this will override other plugins like moverows or selection model and will
        // not require the grid to not be in the edit mode
        _selector = new Slick.CellRangeSelector();
        _selector.onCellRangeSelected.subscribe(_self.handleCellRangeSelected);
        args.grid.registerPlugin(_selector);
    }

    this.destroy = function() {
        _selector.onCellRangeSelected.unsubscribe(_self.handleCellRangeSelected);
        grid.unregisterPlugin(_selector);
        _editor.destroy();
    };

    this.handleCellRangeSelected = function(e, args) {
        _editor.setValue(_editor.getValue() + args.range);
    };


    init();
}

这篇关于Excel像SlickGrid一样的行为的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！