zoukankan      html  css  js  c++  java
  • handsontable-developer guide-cell function

    renderer

    展示的数据不是来自于数据源,而是先把DOM和其他信息传给renderer,然后展示。

    //五种展示函数
    TextRenderer: default
    NumericRenderer
    AutocompleteRenderer
    CheckboxRenderer
    PasswordRenderer
    

    自己不能给cell加listener的原因:1、一个cell会多次调用renderer,可能会导致它有多个相同事件监听器;2、cell CRUD scrolling,可能导致cell和listener绑定错误。如果一定要这样做,需要把cell content放在div中,给div加监听器

    renderer函数 尽可能的快和简洁

    editor

    validator

    可以是函数或者regex;与renderer和editor相比,validator不需要为每个元素都定义。

    renderer,editor,validator是相互联系的

    handsontable定义了一些type,来系列化这三个函数,好处如下:

    var hot = new Handsontable(document.getElementById('container'), {
      columns: [
        {
          renderer: Handsontable.NumericRenderer,
          editor: Handsontable.editors.TextEditor,
          validator: Handsontable.NumericValidator
        }
      ]
    });
    
    var hot = new Handsontable(document.getElementById('container'), {
      columns: [
        {
          type: 'numeric'
        }
      ]
    });
    

    预定义的类型

    text
    numeric
    date
    checkbox
    password
    select
    dropdown
    autocomplete
    handsontable
    
    //function的优先级高于type
    var hot = new Handsontable(document.getElementById('container'), { columns: [ { type: 'numeric', validator: customValidator // validator function defined elsewhere } ] });
    //type='password'没有定义validator,比函数更特殊。
    var hot = new Handsontable(document.getElementById('container'), { validator: customValidator, // validator function defined elsewhere columns: [ { type: 'password' }, {} ] }); 相当于 var hot = new Handsontable(document.getElementById('container'), { columns: [ { renderer: Handsontable.PasswordRenderer, editor: Handsontable.editors.PasswordEditor, validator: undefined } { renderer: Handsontable.TextRenderer, // text cell type is the default one editor: Handsontable.editors.TextEditor, // text cell type is the default one validator: customValidator } ] });
    //通过function定义的才可以,如果通过type定义的,则返回undefined
    var cellProperties = $('#container').handsontable('getCellMeta', 0, 0); // get cell properties for cell [0, 0] cellProperties.renderer; // get cell renderer cellProperties.editor; // get cell editor cellProperties.validator; // get cell validator
    //通过function或者type定义的都可以
    getCellRenderer(row, col) getCellEditor(row, col) getCellValidator(row, col)

      

  • 相关阅读:
    [LOJ#6068]. 「2017 山东一轮集训 Day4」棋盘[费用流]
    [BZOJ4842]Delight for a Cat[费用流]
    [HNOI2018]转盘[结论+线段树]
    [LOJ#6066]. 「2017 山东一轮集训 Day3」第二题[二分+括号序列+hash]
    [CF963E]Circles of Waiting[高斯消元网格图优化+期望]
    [CF966F]May Holidays[分块+虚树]
    【JZOJ5088】【GDOI2017第四轮模拟day2】最小边权和 排序+动态规划
    【JZOJ5086】【GDOI2017第四轮模拟day1】数列 折半搜索
    GDOI2017第四轮day1总结
    【51nod1563】坐标轴上的最大团 贪心
  • 原文地址:https://www.cnblogs.com/wang-jing/p/4656320.html
Copyright © 2011-2022 走看看