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 相关文章推荐
JavaScript 在线压缩和格式化收藏
Jan 16 Javascript
JavaScript中的6种运算符总结
Oct 16 Javascript
浅析webapp框架AngularUI的demo
Dec 21 Javascript
jquery实现用户信息修改验证输入方法汇总
Jul 18 Javascript
JS实现的表格操作类详解(添加,删除,排序,上移,下移)
Dec 22 Javascript
利用js获取下拉框中所选的值
Dec 01 Javascript
jQuery插件fullPage.js实现全屏滚动效果
Dec 02 Javascript
JS正则表达式修饰符global(/g)用法分析
Dec 27 Javascript
js中获取键盘按下键值event.keyCode、event.charCode和event.which的兼容性详解
Mar 15 Javascript
Vue中点击active并第一个默认选中功能的实现
Feb 24 Javascript
vue抽出组件并传值实例
Jul 31 Javascript
解决vue axios跨域 Request Method: OPTIONS问题(预检请求)
Aug 14 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
Terran历史背景
2020/03/14 星际争霸
PHP读取网页文件内容的实现代码(fopen,curl等)
2011/06/23 PHP
PHP读取大文件的多种方法介绍
2016/04/04 PHP
CI框架(CodeIgniter)实现的数据库增删改查操作总结
2018/05/23 PHP
番茄的表单验证类代码修改版
2008/07/18 Javascript
javascript下高性能字符串连接StringBuffer类
2010/08/16 Javascript
详解JavaScript编程中正则表达式的使用
2015/10/25 Javascript
JS正则表达式比较常见用法
2016/01/26 Javascript
浅谈jquery之on()绑定事件和off()解除绑定事件
2016/10/26 Javascript
jQuery弹出div层过2秒自动消失
2016/11/29 Javascript
jQuery的$.extend 浅拷贝与深拷贝
2017/03/08 Javascript
使用typescript开发angular模块并发布npm包
2018/04/19 Javascript
vue.js配合$.post从后台获取数据简单demo分享
2018/08/11 Javascript
详解bootstrap-fileinput文件上传控件的亲身实践
2019/03/21 Javascript
微信小程序的tab选项卡的实现效果
2019/05/15 Javascript
小程序云开发之用户注册登录
2019/05/18 Javascript
swiper实现导航滚动效果
2020/12/13 Javascript
[03:55]2016国际邀请赛中国区预选赛首日TOP10精彩集锦
2016/06/27 DOTA
讲解Python中if语句的嵌套用法
2015/05/14 Python
实例讲解Python爬取网页数据
2018/07/08 Python
python3实现用turtle模块画一棵随机樱花树
2019/11/21 Python
使用python matploblib库绘制准确率,损失率折线图
2020/06/16 Python
python与c语言的语法有哪些不一样的
2020/09/13 Python
一款纯css3实现的tab选项卡的实列教程
2014/12/11 HTML / CSS
input元素的url类型和email类型简介
2012/07/11 HTML / CSS
MYPROTEIN澳大利亚官方网站:欧洲运动营养品牌
2019/06/26 全球购物
乌克兰电子和家用电器商店:Foxtrot
2019/07/23 全球购物
戴尔新西兰官网:Dell New Zealand
2020/01/07 全球购物
高三毕业典礼主持词
2014/03/27 职场文书
小摄影师教学反思
2014/04/27 职场文书
电子商务系毕业生自荐信
2014/05/29 职场文书
文明礼仪标语
2014/06/13 职场文书
班级光棍节联谊会策划书
2014/10/10 职场文书
第二批党的群众路线教育实践活动总结报告
2014/10/30 职场文书
幼儿园园务工作总结2015
2015/05/18 职场文书
html+css实现分层金字塔的实例
2021/06/02 HTML / CSS