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 相关文章推荐
基于jQuery的树控件实现代码(asp.net+json)
Jul 11 Javascript
Javascript将string类型转换int类型
Dec 09 Javascript
js Event对象的5种坐标
Sep 12 Javascript
Javascript生成全局唯一标识符(GUID,UUID)的方法
Feb 27 Javascript
select隐藏选中值对应的id,显示其它id的简单实现方法
Aug 25 Javascript
Jil,高效的json序列化和反序列化库
Feb 15 Javascript
详解vue-cli本地环境API代理设置和解决跨域
Sep 05 Javascript
react实现换肤功能的示例代码
Aug 14 Javascript
ES6基础之解构赋值(destructuring assignment)
Feb 21 Javascript
layer.msg()去掉默认时间,实现手动关闭的方法
Sep 12 Javascript
ES6常用小技巧总结【去重、交换、合并、反转、迭代、计算等】
Dec 21 Javascript
Vue2.x-使用防抖以及节流的示例
Mar 02 Vue.js
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实现的下载css文件中的图片的代码
2010/02/08 PHP
for循环连续求和、九九乘法表代码
2012/02/20 PHP
php中邮箱地址正则表达式实现与详解
2012/04/24 PHP
php_screw 1.5:php加密: 安装与使用详解
2013/06/20 PHP
PHP对表单提交特殊字符的过滤和处理方法汇总
2014/02/18 PHP
一个简单的JavaScript数据缓存系统实现代码
2010/10/24 Javascript
jquery自定义类似$.ajax()的方法实现代码
2013/08/13 Javascript
无闪烁更新网页内容JS实现
2013/12/19 Javascript
教你如何使用node.js制作代理服务器
2014/11/26 Javascript
JavaScript中的Promise使用详解
2015/06/24 Javascript
sencha ext js 6 快速入门(必看)
2016/06/01 Javascript
浅谈angularjs module返回对象的坑(推荐)
2016/10/21 Javascript
使用Ajax与服务器(JSON)通信实例
2016/11/04 Javascript
深入理解基于vue-cli的vuex配置
2017/07/24 Javascript
Vue写一个简单的倒计时按钮功能
2018/04/20 Javascript
微信小程序有旋转动画效果的音乐组件实例代码
2018/08/22 Javascript
webpack+vue-cli项目中引入外部非模块格式js的方法
2018/09/28 Javascript
angular中两种表单的区别(响应式和模板驱动表单)
2018/12/06 Javascript
jQuery中each和js中forEach的区别分析
2019/02/27 jQuery
函数式编程入门实践(一)
2019/04/20 Javascript
angular异步验证防抖踩坑实录
2019/12/01 Javascript
Vue 禁用浏览器的前进后退操作
2020/09/04 Javascript
在Python中使用HTML模版的教程
2015/04/29 Python
Python检测网络延迟的代码
2018/05/15 Python
Python使用tkinter库实现文本显示用户输入功能示例
2018/05/30 Python
python实现决策树分类
2018/08/30 Python
python实现吃苹果小游戏
2020/03/21 Python
Supersmart英国:欧洲市场首批食品补充剂供应商之一
2018/05/05 全球购物
Spongelle官网:美国的创意护肤洗护品牌
2019/05/15 全球购物
全球最大的生存食品、水和装备专用在线市场:BePrepared.com
2020/01/02 全球购物
实习生个人的自我评价
2013/12/08 职场文书
应届本科生推荐信范文
2013/12/25 职场文书
违反课堂纪律检讨书
2014/01/19 职场文书
竞选部长演讲稿
2014/04/26 职场文书
行政执法队伍作风整顿剖析材料
2014/10/11 职场文书
年会邀请函范文
2015/01/30 职场文书