datagrid 内嵌 combotree 显示 valueField 而不是 valueText 的解决办法
2016-05-04 15:59
489 查看
问题描述:获取部门树,从数据库中返回的数据格式为{id: text:},其中id为部门ID,text为部门名称。在 datagrid 中 unitName(部门名称,下拉选)为 combotree 类型。当编辑某一行时,选择相应部门名称,但是结束行编辑时该列字段显示的是 【部门ID】 而不是 【部门名称】。
1)在 部门下拉树 中选择 销售部
2)选择之后会在 部门下拉树 中显示 销售部
3) 但是当结束改行编辑时(endEdit),部门下拉树 就会显示 【 部门ID】 而不是 【部门名称】
解决方法:
1 定义全局变量 unitName
2 在 部门下拉树 中的 onSelect 时间中为 unitName 赋值
3 在OnEndEdit 事件中 为 部门下拉树 赋值显示
解决结果图:
除了这种方法,还可以通过 formatter 来解决这样的问题。因为无论是加载数据与编辑结束时datagrid都会执行formatter函数,所以我们可以用它来输出我们想要的内容。这种方法已经写出,处在赘述,但是当记录表中已经存在数据时,需要做一个判断,这里通过 eventId 来区分是数据库中已经存在记录还是新增的记录(在这里已存在的 eventId 是一个长度为38位的字符串,新增的 eventId 是一个长度为4的字符串)
总结:
1) formatter 无论加载数据或编辑结束都会执行
2) onEndEdit 事件 与 onAfterEdit 事件的不同
3)getEditor 只能对正在编辑的行起作用,当某一行已经结束编辑,getEditor 获取的值为 null
4)为 datagrid 中某一行的某一列赋值 ,可以通过以下语句
index为行号, receivablesUnitName为列名
5) onSelect 中 record 保存的是 combobox 所选择的数据 id 和 text 值
1)在 部门下拉树 中选择 销售部
2)选择之后会在 部门下拉树 中显示 销售部
3) 但是当结束改行编辑时(endEdit),部门下拉树 就会显示 【 部门ID】 而不是 【部门名称】
解决方法:
1 定义全局变量 unitName
//接收部门下拉树的部门名称 var unitName = undefined;
2 在 部门下拉树 中的 onSelect 时间中为 unitName 赋值
{field:'receivablesUnitName',title:'回款部门',width:100, editor:{ type:'combotree', options:{ required:true, valueField : 'id', textField : 'text', data : unitList, panelHeight:"auto", onSelect : function(record){ var edUnitId = $("#receivablesRecordsDatagrid").datagrid('getEditor',{ index : lastEditRowIndex, field : 'receivablesUnitId', }); $(edUnitId.target).val(record.id); //为 unitTreeName赋值 unitTreeName = record.text; } } }, // formatter : function(value,row,index){ // if(row.eventId != undefined && row.eventId.length > 15){ // return value; // }else{ // return unitTreeName; // } // } },
3 在OnEndEdit 事件中 为 部门下拉树 赋值显示
onEndEdit : function(index,row){ if(unitTreeName == undefined){ $("#receivablesRecordsDatagrid").datagrid('getRows')[index]['receivablesUnitName'] = unitTreeName; } }
解决结果图:
除了这种方法,还可以通过 formatter 来解决这样的问题。因为无论是加载数据与编辑结束时datagrid都会执行formatter函数,所以我们可以用它来输出我们想要的内容。这种方法已经写出,处在赘述,但是当记录表中已经存在数据时,需要做一个判断,这里通过 eventId 来区分是数据库中已经存在记录还是新增的记录(在这里已存在的 eventId 是一个长度为38位的字符串,新增的 eventId 是一个长度为4的字符串)
总结:
1) formatter 无论加载数据或编辑结束都会执行
2) onEndEdit 事件 与 onAfterEdit 事件的不同
3)getEditor 只能对正在编辑的行起作用,当某一行已经结束编辑,getEditor 获取的值为 null
4)为 datagrid 中某一行的某一列赋值 ,可以通过以下语句
$("#receivablesRecordsDatagrid").datagrid('getRows')[index]['receivablesUnitName'] = unitTreeName;
index为行号, receivablesUnitName为列名
5) onSelect 中 record 保存的是 combobox 所选择的数据 id 和 text 值
相关文章推荐
- UEDITOR FTP上传
- hdu_2227_Find the nondecreasing subsequences_树状数组,离散化
- hdu_2227_Find the nondecreasing subsequences_树状数组,离散化
- servlet 的request 属性常用方法
- UIAlertContronller的使用
- 1584 - Circular Sequence
- POJ 1776 Task Sequences(竞赛图构造哈密顿通路)
- UINavigationController 导航控制器
- 使用Git GUI同步本地和远程源代码
- JAVA UUID 生成策略研究之为什么
- 第三届山东省ACM Fruit Ninja II
- UIButton
- 第三届山东ACM省赛 Fruit Ninja I
- 使用Git GUI获取远程项目源代码实例
- UITableView的使用详解
- iOS之UITextField怎么自定义键盘的return键
- vue.js学习资料
- 快速排序(Quick Sort)介绍
- java循环结构(以及break,continue的使用)
- Call requires API level 3 (current min is 1)