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)

      

  • 相关阅读:
    总结c#和javascript中常见的相关的"空"
    javascript从未如此流行(JavaScript has never been so popular .)
    解决ajax调用中ie的缓存问题
    《.NET框架程序设计》第5章 基元类型、引用类型与值类型
    DataTable复制到新的DataTable并筛选
    《.NET框架程序设计》第1章 .NET开发平台体系架构 读后感
    《.NET框架程序设计》第4章 类型基础 读后感
    《.NET框架程序设计》第2章 第3章 读后感
    《道德经》程序员版第四十二章
    数据库设计总结
  • 原文地址:https://www.cnblogs.com/wang-jing/p/4656320.html
Copyright © 2011-2022 走看看