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 写类方式之八
Jul 05 Javascript
基于JavaScript实现继承机制之构造函数+原型链混合方式的使用详解
May 07 Javascript
jquery 循环显示div的示例代码
Oct 18 Javascript
Event altKey,ctrlKey,shiftKey属性解析
Dec 18 Javascript
JS返回iframe中frameBorder属性值的方法
Apr 01 Javascript
jQuery中使用each处理json数据
Apr 23 Javascript
Node.js程序中的本地文件操作用法小结
Mar 06 Javascript
JS操作COOKIE实现备忘记录的方法
Apr 01 Javascript
AngularJs入门教程之环境搭建+创建应用示例
Nov 01 Javascript
w3c编程挑战_初级脚本算法实战篇
Jun 23 Javascript
Vue 实现分页与输入框关键字筛选功能
Jan 02 Javascript
Angular8 实现table表格表头固定效果
Jan 03 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来实现网络服务
2009/09/15 PHP
laravel中的错误与日志用法详解
2016/07/26 PHP
利用PHP判断是否是连乘数字串的方法示例
2017/07/03 PHP
完美解决Thinkphp3.2中插入相同数据的问题
2017/08/01 PHP
jquery中使用$(#form).submit()重写提交表单无效原因分析及解决
2013/03/25 Javascript
Ajax局部更新导致JS事件重复触发问题的解决方法
2014/10/14 Javascript
JavaScript获得当前网页来源页面(即上一页)的方法
2015/04/03 Javascript
JavaScript中操作字符串之localeCompare()方法的使用
2015/06/06 Javascript
浅谈JavaScript中的作用域和闭包问题
2015/07/07 Javascript
微信小程序 获取设备信息 API实例详解
2016/10/02 Javascript
通过BootStrap-select插件 js jQuery控制select属性变化
2017/01/03 Javascript
js实现图片360度旋转
2017/01/22 Javascript
利用Node.js编写跨平台的spawn语句详解
2017/02/12 Javascript
老生常谈jquery id选择器和class选择器的区别
2017/02/12 Javascript
JavaScript实现动态增删表格的方法
2017/03/09 Javascript
详解Vue 2.0封装axios笔记
2017/06/22 Javascript
vue2.0全局组件之pdf详解
2017/06/26 Javascript
Vue.js实现按钮的动态绑定效果及实现代码
2017/08/21 Javascript
Nodejs + Websocket 指定发送及群聊的实现
2020/01/09 NodeJs
three.js 制作动态二维码的示例代码
2020/07/31 Javascript
vant-ui框架的一个bug(解决切换后onload不触发)
2020/11/11 Javascript
python实现查找excel里某一列重复数据并且剔除后打印的方法
2015/05/26 Python
使用Python操作MySQL的一些基本方法
2015/08/16 Python
在django-xadmin中APScheduler的启动初始化实例
2019/11/15 Python
tensorflow生成多个tfrecord文件实例
2020/02/17 Python
飞利信loadrunner和软件测试笔试题
2012/09/22 面试题
行政助理岗位职责
2013/11/10 职场文书
毕业生的自我鉴定该怎么写
2013/12/02 职场文书
药剂专业毕业生求职信
2014/06/24 职场文书
单位委托书怎么写
2014/08/02 职场文书
统计学教授推荐信
2014/09/18 职场文书
因工资原因离职的辞职信范文
2015/05/12 职场文书
终止合同协议书范本
2016/03/22 职场文书
Python办公自动化PPT批量转换操作
2021/09/15 Python
AJAX实现省市县三级联动效果
2021/10/16 Javascript
Python+SeaTable实现计算两个日期间的工作日天数
2022/07/07 Python