zoukankan      html  css  js  c++  java
  • SlickGrid API

    Model API:

    Instead of passing SlickGrid an array of row objects, you can pass an object that holds (and updates!) all your rows. This object, which SlickGrid calls a Model, only needs to respond to a simple API:

    model.getItem(i) // Returns the ith row
    model.getLength() // Returns the number of items
    

    Row API

    If you modify the nth row, you will need to tell the grid that the row is invalid, and then call render() to update it:

    grid.invalidateRow(n)
    grid.render()
    

    You can also call grid.invalidateRows() to invalidate a lot of rows at once, and, if you just want to re-draw the whole grid, callgrid.invalidate() (which would do a render() automatically.)

    grid.scrollRowIntoView(rowIndex) - scroll the grid until a row is visible.

    grid.scrollRowIntoView(100)
    

    Column API

    grid.getColumnIndex(columnName) - Returns the numeric index of the given column. Useful when a column index is required by the API.

    grid.getColumnIndex('first_name')
    

    Column options:

    Booleans

    • sortable
    • resizable
    • rerenderOnResize
    • focusable
    • selectable

    Other

    • id A unique identifier for the column within the grid
    • name The display text
    • field The name of the data object property to pull content from
    • cssClass
    • headerCssClass
    • width
    • minWidth
    • maxWidth
    • toolTip

    Grid's Selection API

    Get the list of selected grid rows:

    grid.getSelectedRows() // returns [0,1] if the first two rows are selected.
    

    Set the rows at the following indexes as selected:

    grid.setSelectedRows([0,10])
    

    Cell API

    grid.setCellCssStyles(key, hash) - Sets CSS classes to specific grid cells. key is name for this set of styles so you can reference it later - to modify it or remove it, for example. hash is a per-row-index, per-column-name nested hash of CSS classes to apply.

    Since all that sounds complicated, and mleibman can probably explain it better, here is an example. Suppose you have a grid with columns:

    ["login", "name", "birthday", "age", "likes_icecream", "favorite_cake"]

    ...and you'd like to highlight the "birthday" and "age" columns for people whose birthday is today, in this case, rows at index 0 and 9. (The first and tenth row in the grid).

     .highlight{ background: yellow } 
    
    grid.setCellCssStyles("birthday_highlight", {
       0: {
            birthday: "highlight", 
            age: "highlight" 
           },
    
       1: {
             birthday: "highlight",
             age: "highlight"
           }
    })
    

    grid.addCellCssStyles(key, hash) - The add-only sibling to grid.setCellCssStyles(key, hash). Will throw an exception if you try to set the same key twice without calling removeCellCssStyles(). Use setColumnCssStyles() instead if you don't want that.

    grid.removeCellCssStyles(key) - Removes styles under key from the grid.

    Custom Field Accessor

    By default field values are access via item[columnDef.field]. To have a custom field accessor, overwrite the defaultdataItemColumnValueExtractor option.

    var options = {
    dataItemColumnValueExtractor: function(item, colDef) {
      return item.get(colDef.id);
    }
    };
  • 相关阅读:
    产生一个int数组,长度为100,并向其中随机插入1-100,并且不能重复。
    it人必进的几大网站
    可写可选dropdownlist(只测试过ie)
    Datatable转换为Json 的方法
    ref 和out的区别
    数据库事务
    Webservice 的安全策略
    【转】Zookeeper解析、安装、配置
    【转】activemq的几种基本通信方式总结
    【转】Java小应用:Eclipse中建立自己的类库,给不同的工程使用
  • 原文地址:https://www.cnblogs.com/zfc2201/p/2493544.html
Copyright © 2011-2022 走看看