jqgrid 编辑添加功能详细解析


Posted in Javascript onNovember 08, 2013

ColModel 是jqGrid里最重要的一个属性,设置表格列的属性。

用法:

Java代码 :

jQuery("#gridid").jqGrid({   
...   
   colModel: [ {name:'name1', index:'index1'...}, {...}, ... ],   
..   
}); 

属性  数据类型  备注  默认值 
align  string  定义单元格对齐方式;可选值:left, center, right.  left 
classes  string  设置列的css。多个class之间用空格分隔,如:'class1 class2' 。表格默认的css属性是ui-ellipsis  empty string 
datefmt  string  对日期列进行格式化。”/”, ”-”, and ”.”都是有效的日期分隔符。y,Y,yyyy 年YY, yy 月m,mm for monthsd,dd 日.  ISO Date (Y-m-d) 
defval  string  查询字段的默认值  空 
editable  boolean  单元格是否可编辑  false 
editoptions  array  对列进行编辑时设置的一些属性  empty array 
editrules  array  对于可编辑单元格的一些额外属性设置  empty array 
edittype  string  可以编辑的类型。可选值:text, textarea, select, checkbox, password, button, image and file.  text 
fixed  boolean  列宽度是否要固定不可变  false 
formoptions  array  对于form进行编辑时的属性设置  empty 
formatoptions  array  对某些列进行格式化的设置  none 
formatter  mixed  对列进行格式化时设置的函数名或者类型  none 
hidedlg  boolean  是否显示或者隐藏此列  false 
hidden  boolean  在初始化表格时是否要隐藏此列  false 
index  string  当排序时定义排序字段名称的索引,参数名为sidx  empty string 
jsonmap  string  定义了返回的json数据映射  none 
key  boolean  当从服务器端返回的数据中没有id时,将此作为唯一rowid使用,默认只能有一个id属性  false 
label  string  如果colNames为空则用此值来作为列的显示名称,如果都没有设置则使用name 值  none 
name  string  必输项,表格列的名称,所有关键字,保留字都不能作为名称使用包括subgrid, cb and rn.  Required 
resizable  boolean  是否可以被resizable  true 
search  boolean  在搜索模式下,定义此列是否可以作为搜索列  true 
searchoptions  array  设置搜索参数  empty 
sortable  boolean  是否可排序  true 
sorttype  string  用在当datatype为local时,定义搜索列的类型,可选值:int/integer - 对integer排序float/number/currency - 排序数字date - 排序日期text - 排序文本  text 
stype  string  定义搜索元素的类型  text 
surl  string  搜索数据时的url  empty string 
width  number  默认列的宽度,只能是象素值,不能是百分比  150 
xmlmap  string  定义当前列跟返回的xml数据之间的映射关系  none 
unformat  function  ‘unformat'单元格值  null 

源码中添加

editurl:'index.php?do=do_edit',
     addurl:'index.php?do=do_add',
                    datatype: 'xml',
                    mtype: 'GET',
                    colNames:['ID', '任务名称', '所属类'
                    colModel :[
                        {name:'taskid', index:'taskid', width:100,align:'center',searchoptions:{sopt:['eq','ne','lt','le','gt','ge']}},
      {name:'taskname', index:'taskname', width:100, align:'center',editable:true},
      {name:'classid', index:'classid', width:100, align:'center',editable:true,edittype:'select',editoptions: {
       value: '1:事务;2:非事务'},editselected:'classid' },
                    ],

添加editable后 添加也是同样有效的;

搜索
eq 等于( = )
ne 不等于( <> )
lt 小于( < )
le 小于等于( <= )
gt 大于( > )
ge 大于等于( >= )
bw 开始于 ( LIKE val% )
bn 不开始于 ( not like val%)
in 在内 ( in ())
ni 不在内( not in ())
ew 结束于 (LIKE %val )
en 不结束于
cn 包含 (LIKE %val% )
nc 不包含

Javascript 相关文章推荐
javascript 弹出层组件(升级版)
May 12 Javascript
JavaScript自定义方法实现trim()、Ltrim()、Rtrim()的功能
Nov 03 Javascript
js全选实现和判断是否有复选框选中的方法
Feb 17 Javascript
百度地图api如何使用
Aug 03 Javascript
jQuery超赞的评分插件(8款)
Aug 20 Javascript
基于Jquery实现万圣节快乐特效
Nov 01 Javascript
深入解析Backbone.js框架的依赖库Underscore.js的作用
May 07 Javascript
javascript实现抽奖程序的简单实例
Jun 07 Javascript
JavaScript实现移动端滑动选择日期功能
Jun 21 Javascript
自己封装的一个原生JS拖动方法(推荐)
Nov 22 Javascript
vue-router路由参数刷新消失的问题解决方法
Jun 17 Javascript
微信小程序实现列表的横向滑动方式
Jul 15 Javascript
动态加载JS文件的三种方法
Nov 08 #Javascript
JQGrid的用法解析(列编辑,添加行,删除行)
Nov 08 #Javascript
jQuery 获取和设置select下拉框的值实现代码
Nov 08 #Javascript
jqGrid增加时--判断开始日期与结束日期(实例解析)
Nov 08 #Javascript
JavaScript中this的使用详解
Nov 08 #Javascript
jqGrid日期格式的判断示例代码(开始日期与结束日期)
Nov 08 #Javascript
JQuery验证jsp页面属性是否为空(实例代码)
Nov 08 #Javascript
You might like
在字符串中把网址改成超级链接
2006/10/09 PHP
ThinkPHP3.1的Widget新用法
2014/06/19 PHP
php简单计算页面加载时间的方法
2015/06/19 PHP
PHP实现HTML页面静态化的方法
2015/11/04 PHP
js中有关IE版本检测
2012/01/04 Javascript
情人节专属 纯js脚本1k大小的3D玫瑰效果
2012/02/11 Javascript
Jquery 动态循环输出表格具体方法
2013/11/23 Javascript
angularjs基础教程
2014/12/25 Javascript
jquery validate和jquery form 插件组合实现验证表单后AJAX提交
2015/08/26 Javascript
详解JavaScript语言的基本语法要求
2015/11/20 Javascript
详解Jquery实现ready和bind事件
2016/04/14 Javascript
JavaScript实现显示函数调用堆栈的方法
2016/04/21 Javascript
js实现模糊匹配功能
2017/02/15 Javascript
bootstrap table表格使用方法详解
2017/04/26 Javascript
微信小程序实现页面跳转传值的方法
2017/10/12 Javascript
jQuery中元素选择器(element)简单用法示例
2018/05/14 jQuery
layer.js open 隐藏滚动条的例子
2019/09/05 Javascript
Vue2.0 ES6语法降级ES5的操作
2020/10/30 Javascript
Python实现网站文件的全备份和差异备份
2014/11/30 Python
Python Web框架Flask中使用七牛云存储实例
2015/02/08 Python
Python 专题六 局部变量、全局变量global、导入模块变量
2017/03/20 Python
selenium python浏览器多窗口处理代码示例
2018/01/15 Python
Python实现的随机森林算法与简单总结
2018/01/30 Python
python程序封装为win32服务的方法
2021/03/07 Python
Python实现的爬取豆瓣电影信息功能案例
2019/09/15 Python
基于Pycharm加载多个项目过程图解
2020/01/19 Python
利用python在excel中画图的实现方法
2020/03/17 Python
TensorFlow的reshape操作 tf.reshape的实现
2020/04/19 Python
校园联欢晚会主持词
2014/03/17 职场文书
《搭石》教学反思
2014/04/07 职场文书
股东合作协议书
2014/04/14 职场文书
党员对照检查材料思想汇报
2014/09/16 职场文书
党的群众路线教育实践活动对照检查材料(教师)
2014/09/24 职场文书
2016年大学自主招生自荐信范文
2015/03/24 职场文书
活动宣传稿范文
2015/07/23 职场文书
HTML常用标签超详细整理
2022/03/19 HTML / CSS