handsontable 问题
碰到问题了,去官网上找community:http://docs.handsontable.com/0.16.1/tutorial-quick-start.html
1、
描述:把handson table放在bootstrap tab中,首次没有激活,table没有正常显示。
原因:这种情况下,table invisible,所以不会调用render(),不会正常显示
解决办法:
$('a[href="#data"]').on('shown.bs.tab', function (e) {
hsd.hot.render();
});
另一个问题
描述:在上面的基础上,fixedRowsTop无效
解决办法:添加这一句,重新更新。
hsd.hot.updateSettings({fixedRowsTop : 1});
注:直接更新就可,不用render()也行。
2、
频繁切换表格内容是,使用updateSetting,这样就不会出现数据显示异常。
3、
minSpareRows:1,
minSpareCols:1
在最后一行输入内容,enter后,会自动增加一行。
4、
给某行设置背景颜色:这一类问题都这样解决
cells:function(row, col, prop){
var cellProperties = {};
if(row === 0){
cellProperties.renderer = firstRowRenderer;
}
return cellProperties;
}
var firstRenderer = function firstRowRenderer(instance, td, row, col, prop, value, cellProperties) {
Handsontable.renderers.TextRenderer.apply(this, arguments);
td.style.background = '#eee';
}
5、
建空表是data:[[]];
6、
滚动到指定行
hsd.hot.selectCell(1, 0);
hsd.hot.deselectCell();
找了好久,原来确实没有默认的方法,只能自己解决了,hsd.hot是我自己定义的表
7、copy,paste,cut
demo--contextMenu中有例子,但是jsfiddle中,copy和paste显示有点不正常;cut,没有提到
8、
//----------初始化开始----------------------
//获取数据
$.get('json/handsontable.json', function(data){
// hsd.data = data;
hsd.init(data);
}); // 更新
$('#update').on('click', function(){
$.get('json/handsontable1.json', function(data){
// hsd.data = data;
// hsd.init();
hsd.hot.updateSettings({
data:data
})
});
}) //----------初始化结束---------------------- hsd.con = $('#con');
hsd.init = function(data){
// updateSettings 时不会执行这一句,
console.log('sfp')
hsd.hot = new Handsontable(hsd.con[0], {
data: data,
rowHeaders: true,
colHeaders: ['SLE', 'Control'],
contextMenu: true,
columnSorting: true,
manualColumnResize: true,
fixedRowsTop: 1,
fixedColumnsLeft: 1,
sortIndicator: true,
cells: function(row, col, prop){
// updateSetting时 会执行这一句
if(row === 0 && col === 0){
console.log(data[0][0]);
}
}
});
};
解决办法:init不传参数,获取到B之后,执行hsd.data = B, init中得数据用hsd.data
10、如何区分自动创建的row和通过contextmenu创建的row:http://jsfiddle.net/2oc2hb3e/18/
var flag = false;
afterRender: flag = true;
afterCreateRows: if(flag){ // }
如果有mincols,removeRows,会自动CreateRows,所以需要在removeRows:flag=false
注意:update和createtable时,都先要flag=false
handsontable 问题的更多相关文章
- handsontable组件和jqwidgets(jqxdragdrop组件)在一个页面产生调整宽高bug
修改handsontable.full.js handsontable绑定的"mouseup"事件,默认是window区域太大.引起冲突.
- Handsontable 学习笔记-Methods
Handson: 亲自实践 先给出数据源和基本配置: var data =[ ["A1","B1","C1","D1"] ...
- handsontable插件HOOK事件
Hook插件 afterChange (changes: Array, source: String):1个或多个单元格的值被改变后调用 changes:是一个2维数组包含row,prop,o ...
- handsontable的单元格操作方法
1.为handsontable添加钩子方法 addHook(key,callback):key为钩子方法名 <span style="font-size:18px;"> ...
- Handsontable Read-only cells
一,列只读
- Handsontable 新增一行 默认值
效果图:
- handsontable插件事件
Hook插件 afterChange (changes: Array, source: String):1个或多个单元格的值被改变后调用 changes:是一个2维数组包含row,prop,o ...
- handsontable的核心方法
1.为handsontable添加钩子方法 addHook(key,callback):key为钩子方法名 <span style="font-size:18px;"> ...
- Handsontable对单元格的操作
1.自动填充单元格数据 fillHandle:true/false //当值为true时,允许拖动单元格右下角,将其值自动填充到选中的单元格 2.合并单元格 mergeCells:[{row:起 ...
- 网页版仿Excel效果组件--handsontable拓展运用
引言(祝看官们新年万事大吉) 前段时间项目需要实现网页版的excel表格功能,瞬间就想到了handsontable,为什么呢?理由如下:该UI组件功能齐全多样,展示效果也更贴近bootstrap风格, ...
随机推荐
- mybatis3 @SelectProvider
mybatis3中增加了使用注解来配置Mapper的新特性,本篇文章主要介绍其中几个@Provider的使用方式,他们是:@SelectProvider.@UpdateProvider.@Insert ...
- python webdriver启动IE浏览器
from selenium import webdriverfrom selenium.webdriver.common.desired_capabilities import DesiredCapa ...
- 配置Tomcat 7 Gzip
<Connector URIEncoding="UTF-8" connectionTimeout="20000" port="8080" ...
- tf.equal()
equal( x, y, name=None ) 对输入的 x 和 y 两个 Tensor 逐元素(element-wise)做 (x == y) 逻辑比较,返回 bool 类型的 Tensor. 参 ...
- Asp.net中判断是否是指定页面请求的代码示例
//获取请求网址,非法请求,返回主页 if (Request.UrlReferrer != null) { string requstUrl = Request.UrlReferrer.Absolut ...
- TZOJ 4813 机器翻译(模拟数组头和尾)
描述 小晨的电脑上安装了一个机器翻译软件,他经常用这个软件来翻译英语文章. 这个翻译软件的原理很简单,它只是从头到尾,依次将每个英文单词用对应的中文含义来替换.对于每个英文单词,软件会先在内存中查找这 ...
- python连接redis,redis集群
python连接redis: import redis r = redis.Redis(host='192.168.50.181',port=6002) r.set('user_phone_14900 ...
- N皇后问题12 · N-Queens
[抄题]: n皇后问题是将n个皇后放置在n*n的棋盘上,皇后彼此之间不能相互攻击. 给定一个整数n,返回所有不同的n皇后问题的解决方案. 每个解决方案包含一个明确的n皇后放置布局,其中“Q”和“.”分 ...
- Spring框架的事务管理之基于AspectJ的XML方式(重点掌握)
1. 步骤一:恢复转账开发环境(转账开发环境见“https://www.cnblogs.com/wyhluckdog/p/10137283.html”) 2.步骤二:引入AOP的开发包3.步骤三:引入 ...
- 构建openssl debug版
一.简介 作为一种安全协议,openssl囊括了主要的密码算法.常用的密钥和证书封装管理功能以及SSL协议,并提供了丰富的应用程序供测试或其它目的使用. 参考: http://www.linuxidc ...