jquery增加时编辑jqGrid(实例代码)


Posted in Javascript onNovember 08, 2013
function showTestSubjectGrid() {
    $("#testSubjectGrid").jqGrid({
        url: "",
        datatype: "json",
        height: 215,
        width: 480,
        caption: "测试科目",
        autoheight: true,
        autowidth: true,
        scrollrows: false, // 是否显示行滚动条 
        multiselect: true, // 是否显示复选框
        hidegrid: false, //取消Grid的收缩 
        postData: {
            strJson: testsubjectData
        },
        colNames: ['', '测试科目', '开始时间', '结束时间', '场次', ],
        colModel: [
        {
            name: 'data',
            index: 'data',
            hidden: true
        }, {
            name: 'display_content',
            index: 'display_content',
            width: 100,
            editable: true,
            align: 'left'
        }, {
            name: 'exam_startTime',
            index: 'exam_startTime',
            width: 110,
            editable: true,
            align: 'center'
        }, {
            name: 'exam_EndTime',
            index: 'exam_EndTime',
            width: 110,
            editable: true,
            align: 'center'
        }, {
            name: 'exam_turn',
            index: 'exam_turn',
            width: 110,
            editable: true,
            align: 'center'
        }],
        jsonReader: {
            root: "rows",
            repeatitems: false,
            id: "data"
        },
        gridComplete: function () {
            var testIds = $("#testSubjectGrid").jqGrid("getDataIDs");
            for (var i = 0; i < testIds.length; i++) {
                var cid = testIds[i];
                var exam_begintime = "<input type='text' name='exam_begintime_" + testIds[i] + "' id='exam_begintime_" + testIds[i] + "'/>";
                var exam_endtime = "<input type='text' name='exam_endtime_" + testIds[i] + "' id='exam_endtime_" + testIds[i] + "'/>";
                var exam_turn = "<input type='text' name='exam_turn_" + testIds[i] + "' id='exam_turn_" + testIds[i] + "'/>";
                jQuery("#testSubjectGrid").jqGrid('setRowData', cid, { exam_startTime: exam_begintime });
                jQuery("#testSubjectGrid").jqGrid('setRowData', cid, { exam_EndTime: exam_endtime });
                jQuery("#testSubjectGrid").jqGrid('setRowData', cid, { exam_turn: exam_turn });
                $("#exam_begintime_" + testIds[i]).datepicker({
                    showOn: 'button',
                    buttonText: '选择'
                });
                $("#exam_endtime_" + testIds[i]).datepicker({
                    showOn: 'button',
                    buttonText: '选择'
                });
            }
        }
    });
};
Javascript 相关文章推荐
50个比较实用jQuery代码段
Sep 18 Javascript
基于jQuery实现在线选座之高铁版
Aug 24 Javascript
Javascript typeof与instanceof的区别
Oct 18 Javascript
ionic2 tabs 图标自定义实例
Mar 08 Javascript
bootstrap Table的一些小操作
Nov 01 Javascript
JS判断用户用的哪个浏览器实例详解
Oct 09 Javascript
layDate日期控件使用方法详解
Nov 15 Javascript
node.js的Express服务器基本使用教程
Jan 09 Javascript
Vue事件修饰符native、self示例详解
Jul 09 Javascript
微信小程序可滑动月日历组件使用详解
Oct 21 Javascript
vue Treeselect下拉树只能选择第N级元素实现代码
Aug 31 Javascript
ajax请求前端跨域问题原因及解决方案
Oct 16 Javascript
jqueyr判断checkbox组的选中(示例代码)
Nov 08 #Javascript
iframe子父页面调用js函数示例
Nov 07 #Javascript
Jquery通过Ajax方式来提交Form表单的具体实现
Nov 07 #Javascript
Checbox的操作含已选、未选及判断代码
Nov 07 #Javascript
js操作label给label赋值及取label的值示例
Nov 07 #Javascript
js实现幻灯片播放图片示例代码
Nov 07 #Javascript
JS实现定时页面弹出类似QQ新闻的提示框
Nov 07 #Javascript
You might like
PHP 5.3.0 安装分析心得
2009/08/07 PHP
解析php中的fopen()函数用打开文件模式说明
2013/06/20 PHP
解析PHP强制转换类型及远程管理插件的安全隐患
2014/06/30 PHP
wamp安装后自定义配置的方法
2014/08/23 PHP
使用PHPCMS搭建wap手机网站
2015/09/20 PHP
PHP实现接收二进制流转换成图片的方法
2017/01/10 PHP
PHP基于redis计数器类定义与用法示例
2018/02/08 PHP
PHP生成指定范围内的N个不重复的随机数
2019/03/18 PHP
使用正则替换变量
2007/05/05 Javascript
jQuery 学习第五课 Ajax 使用说明
2010/05/17 Javascript
当鼠标移动到图片上时跟随鼠标显示放大的图片效果
2013/06/06 Javascript
javascript去除字符串中所有标点符号和提取纯文本的正则
2014/06/07 Javascript
jQuery中empty()方法用法实例
2015/01/16 Javascript
js数组去重的5种算法实现
2015/11/04 Javascript
JS如何设置cookie有效期为当天24点并弹出欢迎登陆界面
2016/08/04 Javascript
基于jQuery实现Tabs选项卡自定义插件
2016/11/21 Javascript
jQuery表单元素选择器代码实例
2017/02/06 Javascript
js原生代码实现轮播图的实例讲解
2017/07/28 Javascript
js模块加载方式浅析
2017/08/12 Javascript
基于vue实现滚动条滚动到指定位置对应位置数字进行tween特效
2019/04/18 Javascript
webpack+express实现文件精确缓存的示例代码
2020/06/11 Javascript
python正则表达式抓取成语网站
2013/11/20 Python
python实现目录树生成示例
2014/03/28 Python
更改Python命令行交互提示符的方法
2015/01/14 Python
使用Python脚本将文字转换为图片的实例分享
2015/08/29 Python
Python Sqlite3以字典形式返回查询结果的实现方法
2016/10/03 Python
python常见的格式化输出小结
2016/12/15 Python
python MNIST手写识别数据调用API的方法
2018/08/08 Python
用Cython加速Python到“起飞”(推荐)
2019/08/01 Python
Keras自定义实现带masking的meanpooling层方式
2020/06/16 Python
python 实现IP子网计算
2021/02/18 Python
CSS3的新特性介绍
2008/10/31 HTML / CSS
纯css3实现的竖形无限级导航
2014/12/10 HTML / CSS
俄罗斯家居用品购物网站:Евродом
2020/11/21 全球购物
如何通过简单的代码描述Angular父组件、子组件传值
2022/04/07 Javascript
tomcat正常启动但网页却无法访问的几种解决方法
2022/05/06 Servers