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画5角星方法介绍
Sep 17 Javascript
javascript弹出拖动窗口
Aug 11 Javascript
第四篇Bootstrap网格系统偏移列和嵌套列
Jun 21 Javascript
JavaScript中 ES6 generator数据类型详解
Aug 11 Javascript
谈谈JavaScript中浏览器兼容问题的写法小议
Dec 17 Javascript
详解如何在Vue2中实现组件props双向绑定
Mar 29 Javascript
JS实现多级菜单中当前菜单不随页面跳转样式而发生变化
May 30 Javascript
详解vue中axios的使用与封装
Mar 20 Javascript
基于vue如何发布一个npm包的方法步骤
May 15 Javascript
微信小程序云开发如何使用云函数生成二维码
May 18 Javascript
webpack3.0升级4.0的方法步骤
Apr 02 Javascript
js获取url页面id,也就是最后的数字文件名
Sep 25 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
PHP与MySQL开发中页面出现乱码的一种解决方法
2007/07/29 PHP
php session应用实例 登录验证
2009/03/16 PHP
PHP错误Warning:mysql_query()解决方法
2015/10/24 PHP
php解析xml 的四种简单方法(附实例)
2016/07/11 PHP
php版微信自动获取收货地址api用法示例
2016/09/22 PHP
Ajax请求PHP后台接口返回信息的实例代码
2018/08/21 PHP
侧栏跟随滚动的简单实现代码
2013/03/18 Javascript
JavaScript中的值是按值传递还是按引用传递问题探讨
2015/01/30 Javascript
谈谈impress.js初步理解
2015/09/09 Javascript
JavaScript 对象深入学习总结(经典)
2015/09/29 Javascript
实例代码详解javascript实现窗口抖动及qq窗口抖动
2016/01/04 Javascript
关于laydate.js加载laydate.css路径错误问题解决
2017/12/27 Javascript
jQuery实现参数自定义的文字跑马灯效果
2018/08/15 jQuery
js监听html页面的上下滚动事件方法
2018/09/11 Javascript
微信小程序3种位置API的使用方法详解
2019/08/05 Javascript
浅析Vue 中的 render 函数
2020/02/28 Javascript
js实现弹窗效果
2020/08/09 Javascript
Node.JS如何实现JWT原理
2020/09/18 Javascript
[01:14]DOTA2 7.22版本新增神杖效果展示(智力英雄篇)
2019/05/29 DOTA
python实现简单socket程序在两台电脑之间传输消息的方法
2015/03/13 Python
浅谈Python中的闭包
2015/07/08 Python
利用Python循环(包括while&amp;for)各种打印九九乘法表的实例
2017/11/06 Python
Pandas读取csv时如何设置列名
2020/06/02 Python
Python如何将模块打包并发布
2020/08/30 Python
请解释一下webService? 如何用.net实现webService
2014/06/09 面试题
工业自动化毕业生自荐信范文
2014/01/04 职场文书
建筑工程毕业生自我鉴定
2014/01/14 职场文书
大课间活动制度
2014/01/18 职场文书
校庆口号
2014/06/20 职场文书
派出所正风肃纪剖析材料
2014/10/10 职场文书
《爱的教育》读书心得
2014/11/08 职场文书
汉语拼音教学反思
2016/02/22 职场文书
关于党风廉政建设宣传教育月的活动总结!
2019/08/08 职场文书
描写九月优美句子(39条)
2019/09/11 职场文书
自动在Windows中运行Python脚本并定时触发功能实现
2021/09/04 Python
【海涛教你打DOTA】剑圣第一人称视角解说
2022/04/01 DOTA