Docs
API
  • Methods

    
    var grid = new FancyGrid({
      ...
    })
    

    add

    (config: Object)

    insert data item on last position.

    Values: add.

    
    grid.add({
      id: 25, // not required
      name: 'John', // not required
      someProperty: 1, // not required
    });
    

    clearSelection

    ()
    Clear all selection.
    Grid auto clear selection in all needed cases,
    usually this method is not used.
    
    grid.clearSelection();
    

    destroy

    ()

    destroy grid.

    
    grid.destroy();
    

    each

    (fn: Function, [scope: Object])

    Goes throw all displayed items.

    
    grid.each(function(item){
      ...
    });
    

    find

    (key: String, value: Mixed): Array

    Finds items by value and returns data items row indexes.

    
    grid.find('name', 'Tom'); // [1, 5]
    

    findItem

    (key: String, value: Mixed): Array

    Finds items by value and returns data items.

    
    grid.find('name', 'Tom'); // [{id: 2, age: 35,...}, {id: 5, age: 25, ...}]
    

    get

    ([rowIndex: Number], [key: String]): Array/Model/Mixed

    If params are empty than returns array of data items(Models).

    If rowIndex is defined than returns data item(Model) at rowIndex.

    If both rowIndex and key are defined than returns data item key value(Mixed) at rowIndex.

    
    grid.get();//return array of items:Models
    
    
    grid.get(10);//return data item: Model
    
    
    grid.get(10, 'age');//return data item key value.
    

    getById

    (id: Number): Model

    returns data item: Model.

    
    grid.getById(10);//return data item(Model)
    

    getData

    (): Array

    returns data.

    
    grid.getData();
    

    getDataView

    (): Array

    returns displayed data.

    
    grid.getDataView();
    

    getSelection

    ():Array
    Returns models of selected rows.
    It works only if selModel is row or rows, in other cases it returns empty array.
    
    grid.getSelection();
    

    getSubTitle

    (): String

    returns sub title text value.

    
    var subTitle = grid.getSubTitle();
    

    getTitle

    (): String

    returns title text value.

    
    var title = grid.getTitle();
    

    getTotal

    (): Number

    returns total data count.

    
    var total = grid.getTotal();
    

    insert

    (config: Object)
    insert data item on row with index 0.

    Values: add.

    
    grid.insert({
      id: 25, // not required
      name: 'John', // not required
      someProperty: 1, // not required
    });
    

    insert

    (index: Number, config: Object)

    insert data item on index.

    
    grid.insert(1, {
      id: 25, // not required
      name: 'John', // not required
      someProperty: 1, // not required
    });
    

    hide

    ()

    hide grid.

    
    grid.hide();
    

    load

    ()

    load data if auto load was disabled.

    data.proxy.autoLoad

    
    grid.load();
    

    on

    (eventName: String, handler: Function, scope: [Object])

    setting handler on grid event.

    
    grid.on('cellclick', function(o){
      
    });
    

    remove

    (id: String)

    removing data item by id.

    
    grid.remove(2);
    

    remove

    (config: Object)

    removing data item by id.

    
    grid.remove({
      id: 2
    });
    

    remove

    (items: Array)

    removing data items by id-s.

    
    grid.remove([2, 5]);
    
    
    grid.remove([{
      id: 2
    },{
      id: 5
    }]);
    

    removeAt

    (rowIndex: Number)

    removing data item by rowIndex.

    
    grid.removeAt(2);
    

    save

    ()

    save changes to server data if auto save was disabled.

    data.proxy.autoSave

    
    grid.save();
    

    selectRow

    (rowIndex: Number)

    select row at rowIndex.

    
    grid.selectRow(0);
    

    selectColumn

    (key: String)

    select column by index(key).
    It requires selModel to be column or columns

    
    grid.selectColumn('name');
    

    set

    (rowIndex: Number, key: String, value: Mixed)

    change data item value at rowIndex.

    
    grid.set(7, 'age, '35');
    

    setHeight

    (value: Number)

    Set grid height.

    
    grid.setHeight(400);
    

    setSelModel

    (selModel: String)

    Set selection model.

    Possible values: cell, cells, row, rows, column, columns.

    
    grid.setSelModel('rows');
    

    setSubTitle

    (value: String)

    Set new sub title text.

    
    grid.setSubTitle('New Sub Title');
    

    setTitle

    (value: String)

    Set new title text.

    
    grid.setTitle('New Title');
    

    setTrackOver

    (trackType: String, enabled: Boolean)

    Enables|disables track type.

    Possible values of trackType: cell, row, column.

    
    grid.setTrackOver('column', true);
    

    setWidth

    (value: Number)

    Set grid width.

    
    grid.setWidth(400);
    

    show

    ()

    show grid if it was hidden.

    
    grid.show();
    

    stopEditor

    ()

    Stops showing editor once on click edit event.

    It is rare used method for advanced usage.

    
    events: [{
      cellclick: function(grid){
        grid.stopEditor();
        ...
      }
    ...
    

    un

    (eventName: String, handler: Function)

    unset handler on grid event.

    
    function onCellClick(grid, o){
      ...
    }
    
    grid.on('cellclick', onCellClick);
    ...
    
    grid.un('cellclick', onCellClick);
    

    update

    ()

    if in grid data there is changes but item data(Model) or other that
    was not rendered than running method update will render changes.

    
    grid.update();