LigerUI编辑表格组件单元格校验问题
这几天在使用LigerUI(版本为1.2.2)编辑表格组件的时候,遇到几个小问题,从官方demo和api中没有找到解决的办法
问题1、从数据库查询出来的主键单元格不可编辑问题
主键单元格已经保存之前编辑的数据,由于是主键,因此一旦保存就不需要再进行修改
找到了一点儿线索,核心代码如下:
onBeforeEdit: function (e){
if (e.record.editTime) {
e.record.id.enabledEdit = false;
//dataGrid.reRender();
}
return true;
}
其中,reRender()函数是从http://www.tuicool.com/articles/ZZnyu2F找到的,新版本没有这个函数,虽然重新设置了单元格的enabledEdit属性为false,但是不知道如何阻止编辑单元格,于是这个问题只能通过变通的方式解决
变通的解决方式为,在编辑完成后判断当前记录是否已经保存过,比如已经有保存时间等属性,如果已经保存,就自动恢复成编辑之前的数据,核心代码如下:
onBeforeSubmitEdit: function (e) {
//查询出来的数据id不能修改
if (e.column.name == "id" && e.record.editTime) {
return false;
}
}
虽然,变通解决了不能修改的问题,但是理想的效果是单元格不可编辑
问题2:单元格校验问题
可编辑的表格,其中的数据有些是需要进行格式、业务校验的,虽然有人在ligerGrid的columns中写了validate属性,但是不知道如何触发其中的校验规则,设置的校验不能触发,肯定是不能起作用的,于是这个问题也需要找个变通的方式解决
变通的解决方式为,在保存之前,对每行的数据进行校验,遍历每行数据的核心代码
function validateGrid() {
var rows = dataGrid.rows;
for (var i = 0; i < rows.length; i++) {
if (rows[i].id.length == 0) {
$.ligerDialog.warn("第"+(i+1)+"行[编码]不能为空");
return false;
}
if (rows[i].name.length == 0) {
$.ligerDialog.warn("第"+(i+1)+"行[名称]不能为空");
return false;
}
}
return true;
}
虽然,解决了数据校验问题,但是校验不通过的单元格,显示效果和校验通过的一样,效果不是很好
LigerUI使用起来比较简单,作者也半年左右升级一次,api虽然已有在线版的http://api.ligerui.com/,但是api函数没有名称排序,找起来不是很方便,有些函数没有在api中体现出来,只能查看源码或者开发工具调试才能找到相关的调用方法,不过还是要赞一个,支持免费、开源的LigerUI
LigerUI编辑表格组件单元格校验问题的更多相关文章
- jquery操作表格 合并单元格
jquery操作table,合并单元格,合并相同的行 合并的方法 $("#tableid").mergeCell({ cols:[X,X] ///参数为要合并的列}) /** * ...
- 使用POI创建word表格合并单元格兼容wps
poi创建word表格合并单元格代码如下: /** * @Description: 跨列合并 */ public void mergeCellsHorizontal(XWPFTable table, ...
- 吴裕雄 Bootstrap 前端框架开发——Bootstrap 表格:为所有表格的单元格添加边框
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title> ...
- javascript生成表格增删改查 JavaScript动态改变表格单元格内容 动态生成表格 JS获取表格任意单元格 javascript如何动态删除表格某一行
jsp页面表格布局Html代码 <body onload="show()"> <center> <input type="text" ...
- Aspose.Word 操作word复杂表格 拆分单元格 复制行 插入行 文字颜色
private void button3_Click(object sender, EventArgs e) { object savePathWord =&q ...
- Swift - 给表格的单元格UITableViewCell添加图片,详细文本标签
表格UITableView中,每一单元格都是一个UITableViewCell.其支持简单的自定义,比如在单元格的内部,添加图片和详细文本标签. 注意UITableViewCell的style: (1 ...
- 将Word表格中单元格中的文字替换成对应的图片
示例 原文件结构: 替换后文档结构: 软件截图: 代码: using System;using System.Collections.Generic;using System.ComponentMod ...
- easyui表格,单元格合并
easyui的合并单元格比较麻烦,官网提供一下方法 $('#tt').datagrid({ onLoadSuccess:function(){ var merges = [{ index:2, row ...
- elementUI表格合并单元格
相信你肯定看了 ElementUI 官方文档了,没看的话先去看下表格各个属性的意义,方便下文阅读:传送门 但你会发现此例过于简单,死数据,但我们开发的时候往往都是后台传递过来的数据,导致我们 rows ...
随机推荐
- make -C M=
http://blog.sina.com.cn/s/blog_89fa41ef0100trjr.html Makefile:PWD = $(shell pwd)KERNEL_SRC = /usr/sr ...
- VMWare ESX/ESXi 虚拟机硬盘的厚置备(Thick Provision)与精简置备(Thin Provision)的转换
VMWare ESX/ESXi 有两种硬盘置备方式,厚制备(thick)和精简置备(Thin) 有时可能会由于性能问题或磁盘空间需要将虚拟机磁盘在两种模式间进行互转,虽然在虚拟机配置页面是没有办法修改 ...
- shell数组应用
引言 在Linux平台上工作,我们经常需要使用shell来编写一些有用.有意义的脚本程序.有时,会经常使用shell数组.那么,shell中的数组是怎么表现的呢,又是怎么定义的呢?接下来逐一的进行讲解 ...
- jetty 代码启动
jetty代码启动 jetty 版本为:jetty-distribution-8.1.16.v20140903 public class ServerStart extends Server { @T ...
- php类库安装xml
问题 报错:Call to undefined function dom_import_simplexml() yum install php-dom service restart httpd 参考 ...
- mybatis中的.xml文件总结——mybatis的动态sql
resultMap resultType可以指定pojo将查询结果映射为pojo,但需要pojo的属性名和sql查询的列名一致方可映射成功. 如果sql查询字段名和pojo的属性名不一致,可以通过re ...
- MyBatisBatchItemWriter Cannot change the ExecutorType when there is an existing transaction
但凡使用mybatis,同时与spring集成使用时,接下来要说的这个问题是躲不了的.众所周知,mybatis的SqlSessionFactory在获取一个SqlSession时使用默认Executo ...
- python pandas ---Series,DataFrame 创建方法,操作运算操作(赋值,sort,get,del,pop,insert,+,-,*,/)
pandas 是基于 Numpy 构建的含有更高级数据结构和工具的数据分析包 pandas 也是围绕着 Series 和 DataFrame 两个核心数据结构展开的, 导入如下: from panda ...
- Spring框架中InitializingBean执行顺序
本文转自:https://www.cnblogs.com/yql1986/p/4084888.html package org.test.InitializingBean; 2 3 import or ...
- JDK1.8 重识HashMap
摘要 JDK1.8相较于1.7对HashMap做了很大的优化,比如加入了新数据结构红黑树.Hash算法的优化和扩容的优化. 本篇结合这些区别,探索HashMap的结构实现和功能原理. 存储结构-字段 ...