博客
关于我
强烈建议你试试无所不能的chatGPT,快点击我
Easyui的datagrid的行编辑器Editor中添加事件(修改某个单元格带出其他单元格的值)...
阅读量:7089 次
发布时间:2019-06-28

本文共 3348 字,大约阅读时间需要 11 分钟。

项目中有个datagrid需要编辑行时,用到Editor的属性,那么如何添加一个事件

问题:同一个编辑行中的某个单元格值改变时,修改其他单元格的值

页面用到的datagrid

检查项编号 检查项名称 检查项结果 检查状态 参考值 项目单位

如上所示,我编辑行时,只要修改检查项和检查结果两个列,是检查项结果值改变,带出检查状态

js中如何实现

//grid的单击事件            this.grid.onClickRow = function(rowIndex,rowData)            {                  //单击时触发编辑行事件                $('#list').datagrid('beginEdit',rowIndex);                //获取当前修改行编辑器的数据                var editors = $('#list').datagrid('getEditors', rowIndex);                                 //获取行编辑器第一个对象                var editor1 = editors[0];                var editor2 = editors[1];                //console.log(rowData);                //为对象的数字框添加onChange事件                editor1.target.numberbox({                    onChange:function(newValue,oldValue){                        if(newValue > 0)                        {                            //获取检查项的最小值和最大值                            var minValue = parseFloat(rowData.MinValue);                            var maxValue = parseFloat(rowData.MaxValue);                                   if(newValue > maxValue){                                //设置combobox的值为偏高(2)                                editor2.target.combobox('setValue',2);                            }                            else if(newValue < minValue){                                //设置combobox的值为偏低(1)                                editor2.target.combobox('setValue',1);                            }                            else{                                //设置combobox的值正常(0)                                editor2.target.combobox('setValue',0);                            }                  传递检查项结果data数据                             //var dts={"ItemId": rowData.Uid,"ProjectId":rowData.ProjectId,"ProjectResult":newValue};                               请求计算结果(正常(0)、偏低(1)、偏高(2))                             //com.ajax({
                            //    type: 'POST',                             //    url: '/api/bpum/PumPrenatalInspect/GetProjectState/' + rowData.Uid,                             //    data: JSON.stringify(dts),                             //    success: function (str)                             //    {
                            //        //设置combobox的值                             //        editor2.target.combobox('setValue',str);                             //    },                             //    error: function (e) {
                            //        com.message('error', e.responseText);                             //    }                             //}); } } }); }

图片实例:

实现原理:

通过行单击事件中rowIndex获取行的编辑器对象editors,由于我们只有两个列编辑的,所以editors[0]就获取第一列检查项结果编辑的对象,

editors[1]获取检查状态的对象,由于第一个单元格是numberBox,第二个combobox,我们给numberBox绑定一个onChage()事件,判断当第一个单元格

值改变时,修改第二个单元格的值。其他类型也可以修改,改成对应类型就可以了(修改数值也可以用ajax请求后修改,但是会出现刷新问题)

参考网址:

https://www.cnblogs.com/linvan/p/6607465.html

你可能感兴趣的文章
jQuery 事件 - bind() 方法
查看>>
phpmyadmin里面导入sql语句格式的大量数据的方法
查看>>
北大公开课-计算概论
查看>>
Windows安全认证是如何进行的?[Kerberos篇]
查看>>
一点感触:错误调试
查看>>
化繁为简 如何向老婆解释MapReduce?
查看>>
说说掌握JavaScript语言的思想前提
查看>>
使用百度网盘API上传备份文件
查看>>
中介者模式(Mediator)
查看>>
Java String.replaceAll()方法 (转载)
查看>>
使用Percona XtraBackup备份 MySQL InnoDB 数据库
查看>>
微信开发实践(一):使用JS-SDK实现自定义分享 Ⅰ
查看>>
『毒舌吐槽社区』-很多敏感内容,你懂的!
查看>>
两百条微信小程序开发跳坑指南(不定时更新)
查看>>
spring aop 对jsonp进行封装
查看>>
一张图读懂JVM
查看>>
森之亡女 2
查看>>
Spark(Framework)
查看>>
用webgl打造自己的3D迷宫游戏
查看>>
微信小程序学习路线【经验之谈】
查看>>