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 相关文章推荐
js 实现无缝滚动 兼容IE和FF
Jul 15 Javascript
js预载入和JavaScript Image()对象使用介绍
Aug 28 Javascript
DOM节点删除函数removeChild()用法实例
Jan 12 Javascript
jQuery EasyUI API 中文帮助文档和扩展实例
Aug 01 Javascript
jquery ajaxfileupload异步上传插件使用详解
Feb 08 Javascript
微信小程序开发之入门实例教程篇
Mar 07 Javascript
for循环 + setTimeout 结合一些示例(前端面试题)
Aug 30 Javascript
详解关于Vue2.0路由开启keep-alive时需要注意的地方
Sep 18 Javascript
解决微信小程序防止无法回到主页的问题
Sep 28 Javascript
js根据需要计算数组中重复出现某个元素的个数
Jan 18 Javascript
微信小程序 WXML节点信息查询详解
Jul 29 Javascript
vue实现移动端input上传视频、音频
Aug 18 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
Linux下CoreSeek及PHP扩展模块的安装
2012/09/23 PHP
php curl 伪造IP来源的实例代码
2012/11/01 PHP
php中jpgraph类库的使用介绍
2013/08/08 PHP
laravel容器延迟加载以及auth扩展详解
2015/03/02 PHP
php实现修改新闻时删除图片的方法
2015/05/12 PHP
thinkPHP查询方式小结
2016/01/09 PHP
PHP基于GD库的图像处理方法小结
2016/09/27 PHP
div+css布局的图片连续滚动js实现代码
2010/05/04 Javascript
javascript实现的DES加密示例
2013/10/30 Javascript
理解Javascript闭包
2013/11/01 Javascript
js获取鼠标位置实例详解
2015/12/09 Javascript
原生javascript实现解析XML文档与字符串
2016/03/01 Javascript
使用pcs api往免费的百度网盘上传下载文件的方法
2016/03/17 Javascript
老生常谈JavaScript数组的用法
2016/06/10 Javascript
极力推荐10个短小实用的JavaScript代码段
2016/08/03 Javascript
jQuery插件EasyUI设置datagrid的checkbox为禁用状态的方法
2016/08/05 Javascript
使用angular帮你实现拖拽的示例
2017/07/05 Javascript
微信小程序实现列表滚动头部吸顶的示例代码
2020/07/12 Javascript
vue 解决addRoutes多次添加路由重复的操作
2020/08/04 Javascript
解决vue项目中某一页面不想引用公共组件app.vue的问题
2020/08/14 Javascript
python和bash统计CPU利用率的方法
2015/07/10 Python
python中partial()基础用法说明
2018/12/30 Python
python 中的列表生成式、生成器表达式、模块导入
2019/06/19 Python
如何使用python把ppt转换成pdf
2019/06/29 Python
Python classmethod装饰器原理及用法解析
2020/10/17 Python
迪拜航空官方网站:flydubai
2017/04/20 全球购物
We Fashion荷兰:一家国际时装公司
2018/04/18 全球购物
具有防紫外线功能的高性能钓鱼服装:Hook&Tackle
2018/08/16 全球购物
DTD的含义以及作用
2014/01/26 面试题
应聘自荐书
2013/10/08 职场文书
大一期末自我鉴定
2013/12/13 职场文书
考试违纪检讨书
2014/02/02 职场文书
安全负责人任命书
2014/06/06 职场文书
学生干部培训方案
2014/06/12 职场文书
研讨会通知
2015/04/27 职场文书
JS实现简单九宫格抽奖
2022/06/28 Javascript