datagrid 内嵌 combotree 显示 valueField 而不是 valueText 的解决办法
来源:互联网 发布:js 自定义window对象 编辑:程序博客网 时间:2024/06/05 03:20
问题描述:获取部门树,从数据库中返回的数据格式为{id: text:},其中id为部门ID,text为部门名称。在 datagrid 中 unitName(部门名称,下拉选)为 combotree 类型。当编辑某一行时,选择相应部门名称,但是结束行编辑时该列字段显示的是 【部门ID】 而不是 【部门名称】。
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 值
- datagrid 内嵌 combotree 显示 valueField 而不是 valueText 的解决办法
- easyui datagrid combobox 选择后显示valueField 而不是 textValue解决方法
- 如果使用Ext.form.ComboBox 作为editor,并设置了store,在选择后,在表格单元中显示的是store中的displayfield 而不是valuefield
- 文件夹内显示缩略图而不是显示图标
- jQuery EasyUI — 重写datagrid的combotree编辑类型
- jQuery EasyUI — 重写datagrid的combotree编辑类型
- 选中DataGrid的Cell而不是row
- jquery combotree\datagrid 包引用
- Easyui-datagrid的column的type是combobox时,对valueField,textField,及formatter函数return值的理解
- 使用VLD1.0,显示的是函数地址而不是函数名的解决办法
- datagrid内嵌combox
- iframe cordova把网页打包成ios时,iframe内嵌网页不显示的解决办法
- jquery easyui的datagrid,使用combotree作为editor不能多选的问题
- Flex 使用DataGrid内嵌进度条ProgressBar上传文件显示错误的处理方法
- Ext Combobox 显示valueField值 不显示displayField问题
- Ext Combobox 显示valueField值 不显示displayField问题
- flex的datagrid内嵌combobox和itemclick
- Ext ComboBox displayField 与 valueField 的不同
- ipv4和ipv6比较
- maven update project 的问题
- 铺手机页面
- Android 初识 MVC、MVP框架
- SqlmapApi提供的接口说明
- datagrid 内嵌 combotree 显示 valueField 而不是 valueText 的解决办法
- Android月历控件(DatePicker)和时间控件(TimePicker)的使用
- 目录遍历漏洞
- AngularJS(四)——模块
- 【华为OJ】【007-取近似值】
- java用io流打包下载文件
- Java用自定义的类作为HashMap的key值
- O'Reilly 免费电子书
- Ruby - Nokogiri 解析XML的实例