zoukankan      html  css  js  c++  java
  • handsontable-developer guide-load and save

    不过handsontable不能用jquery取对象
    var
      $$ = function(id) {
        return document.getElementById(id);
      },
      container = $$('example1'),
      exampleConsole = $$('example1console'),
      autosave = $$('autosave'),
      load = $$('load'),
      save = $$('save'),
      autosaveNotification,
      hot;
    
    hot = new Handsontable(container, {
      startRows: 8,
      startCols: 6,
      rowHeaders: true,
      colHeaders: true,
      afterChange: function (change, source) {
        if (source === 'loadData') {
          return; //don't save this change
        }
        if (!autosave.checked) {
          return;
        }
        clearTimeout(autosaveNotification);
        ajax('scripts/json/save.json', 'GET', JSON.stringify({data: change}), function (data) {
          exampleConsole.innerText  = 'Autosaved (' + change.length + ' ' + 'cell' + (change.length > 1 ? 's' : '') + ')';
          autosaveNotification = setTimeout(function() {
            exampleConsole.innerText ='Changes will be autosaved';
          }, 1000);
        });
      }
    });
    
    Handsontable.Dom.addEvent(load, 'click', function() {
      ajax('scripts/json/load.json', 'GET', '', function(res) {
        var data = JSON.parse(res.response);
    
        hot.loadData(data.data);
        exampleConsole.innerText = 'Data loaded';
      });
    });
    
    Handsontable.Dom.addEvent(save, 'click', function() {
      // save all cell's data
      ajax('scripts/json/save.json', 'GET', JSON.stringify({data: hot.getData()}), function (res) {
        var response = JSON.parse(res.response);
    
        if (response.result === 'ok') {
          exampleConsole.innerText = 'Data saved';
        }
        else {
          exampleConsole.innerText = 'Save error';
        }
      });
    });
    
    Handsontable.Dom.addEvent(autosave, 'click', function() {
      if (autosave.checked) {
        exampleConsole.innerText = 'Changes will be autosaved';
      }
      else {
        exampleConsole.innerText ='Changes will not be autosaved';
      }
    });
    

    把数据保存在本地

    可在初始化或更新方法中设置persistentState为true:persistentStateSave, persistentStateLoad(把value存在valuePlaceholder.value), persistentStateReset,

    为什么要使用persistentState?可以把多个实例存储的数据分隔开。

    还不知道怎么用。

  • 相关阅读:
    linux命令行 238
    C语言语法分析器 238
    有穷自动机的构造与识别 238
    简单词法分析实验报告238许锦沛 238
    javascript获得鼠标的坐标值
    滚动条颜色设置(IE、chrome浏览器)
    获取元素的页面位置,兼容各浏览器
    js闭包的作用
    javascrpt绑定事件之匿名函数
    javascript 函数及作用域
  • 原文地址:https://www.cnblogs.com/wang-jing/p/4656303.html
Copyright © 2011-2022 走看看