Extjs中Combobox在修改的时候回写不成功
2013-06-03 18:03
239 查看
我自己碰到的这个问题,就是我在修改一条数据的时候,其他数据回显都没有问题,只有这个下拉列表中的数据,页面上显示的是数据库中对应的ID而不是想看到的名字。
一开始我把下拉框要加载的store写在方法里面了,就不显示名称,后来放到方法外面就可以了。
我的功能是通过在当前记录页面弹出一个小窗口来显示的。
修改按钮代码:
调用的popWin()方法:
下拉框中需要加载数据源classStore,但是这个store需要在popWin()外面去加载,如果写到方法里面去就不会正确回显,只显示ID不显示名称。
一开始我把下拉框要加载的store写在方法里面了,就不显示名称,后来放到方法外面就可以了。
我的功能是通过在当前记录页面弹出一个小窗口来显示的。
修改按钮代码:
/** 修改按钮 */ var btn_update = new Ext.Button({ text : '修改', iconCls : 'update', handler : function() { var record = grid.getSelectionModel().getSelected(); var num = grid.selModel.getSelections().length; //勾选的个数 if(!record){ Ext.Msg.alert("修改操作", "请选择要修改的项"); }else if(num > 1 || num == 0){ Ext.Msg.alert("修改操作", "你选择修改的记录应该为一条"); }else{ popWin("2",record.data.id); var fm = Ext.getCmp('addForm'); fm.getForm().loadRecord(record); //再加载数据 readBackToUpdatePage("2"); } } });
调用的popWin()方法:
/** 弹出窗口功能 */ var win = null; var classStore = new Ext.data.JsonStore({ url: "./jxy/attendsystem/queryClassComboAction", autoLoad: true, method : 'post', fields: ['id','clasName'], root: 'data', remoteSort: true, listeners:{ load : function(store, records, options ){ var data = { "id": "", "clasName": "休息"}; var rs = [new Ext.data.Record(data)]; store.insert(0,rs); } } }); var popWin = function(operStatus, id) { win = new Ext.Window({ width : 550, height: 500, resizable : false, modal : true, closeAction : 'close', items : [new Ext.form.FormPanel({ labelAlign: 'right', labelWidth: 90, id: 'addForm', width : 550, height: 475, autoScroll: true, frame: true, items: [{ layout: 'column', border: false, items: [{ layout: 'form', xtype: 'panel', border: false, items: [{ xtype: 'hidden', id: 'id' }] }, { layout: 'form', xtype: 'panel', border: false, items: [{ xtype: 'hidden', id: 'lawDayContent' }] }] }, { xtype : 'panel', style : 'margin-top:10;', layout : 'column', items : [{ layout : 'form', width : 240, items : [{ xtype : 'textfield', width : 120, fieldLabel : '排班规则名称', id : 'lawName', name : 'lawName', allowBlank : false, //不可以为空 maxLength : 50 }] }] }, { xtype : 'panel', layout : 'column', autoWidth : true, items : [{ layout : 'form', width : 240, items : [{ store : new Ext.data.SimpleStore({ fields : ["value", "text"], data : [[1, '星期方式'], [2, '轮班方式']] }), xtype : 'combo', fieldLabel : '轮<span> </span>班<span> </span>方<span> </span>式', width : 120, displayField: 'text', valueField: 'value', typeAhead : true, triggerAction : 'all', selectOnFocus : true, allowBlank : false, emptyText : '--选择--', id : 'lawType', hiddenName : 'value', mode : 'local', editable : false, listeners : { select : function() { } } }] }, { width : 200, layout : 'form', xtype : 'panel', items : [{ xtype : 'numberfield', fieldLabel : '轮班天数', width : 90, decimalPrecision: '0', minValue: 1, maxValue: 7, allowBlank : false, maskRe :/\d/, id : 'lawDayNumber' }] }, { width : 40, layout : 'form', xtype : 'button', id : 'ruleCheck', text : '设定', handler : function() { } }] }, { xtype: 'panel', layout: 'column', width: 500, items: [{ layout : 'form', height: 350, xtype : 'panel', border: true, style: 'margin-left:10; border-style: dotted;border-width: thin;border-color: blue;', title : '规律排班明细', collapsible: true, items : [{ xtype: 'panel', layout: 'column', width : 380, height: 26, style: 'border-style: solid; border-width: thin; border-color:lightblue;', id : 'lawDayDetail', items: [{ layout: 'form', width: '40%', xtype: 'label', border: true, style: 'font-size: 15; font-family: "黑体"; margin-left: 65;', text: '第几天' }, { layout: 'form', xtype: 'label', border: true, style: 'font-size: 15; font-family: "黑体"; ', text: '班次' }] },{ layout: 'column', xtype: 'panel', width : 380, id: 'day1', border: true, style: 'border-style: solid; border-width: thin; border-color:lightblue;', items: [{ layout: 'form', width: '40%', id: 'dayNum1', xtype: 'label', style: 'font-size: 13; font-family: "黑体"; margin-left: 65;', text: '第一天' }, { layout: 'form', store: classStore, xtype: 'combo', width: 132, id: 'clas1', displayField: 'clasName', valueField: 'id', hiddenName: 'clasName1', typeAhead: true, triggerAction: 'all', forceSelection: true, selectOnFocus: true, mode: 'remote', editable: false }] },{ layout: 'column', xtype: 'panel', width : 380, id: 'day2', border: true, style: 'border-style: solid; border-width: thin; border-color:lightblue;', items: [{ layout: 'form', width: '40%', id: 'dayNum2', xtype: 'label', style: 'font-size: 13; font-family: "黑体"; margin-left: 65;', text: '第二天' }, { layout: 'form', store: classStore, xtype: 'combo', width: 132, id: 'clas2', displayField: 'clasName', valueField: 'id', hiddenName: 'clasName1', typeAhead: true, triggerAction: 'all', forceSelection: true, selectOnFocus: true, mode: 'remote', editable: false }] },{ layout: 'column', xtype: 'panel', width : 380, id: 'day3', border: true, style: 'border-style: solid; border-width: thin; border-color:lightblue;', items: [{ layout: 'form', width: '40%', xtype: 'label', id: 'dayNum3', style: 'font-size: 13; font-family: "黑体"; margin-left: 65;', text: '第三天' }, { layout: 'form', store: classStore, xtype: 'combo', width: 132, id: 'clas3', displayField: 'clasName', valueField: 'id', hiddenName: 'clasName1', typeAhead: true, triggerAction: 'all', forceSelection: true, selectOnFocus: true, mode: 'remote', editable: false }] },{ layout: 'column', xtype: 'panel', width : 380, id: 'day4', border: true, style: 'border-style: solid; border-width: thin; border-color:lightblue;', items: [{ layout: 'form', width: '40%', id: 'dayNum4', xtype: 'label', style: 'font-size: 13; font-family: "黑体"; margin-left: 65;', text: '第四天' }, { layout: 'form', store: classStore, xtype: 'combo', width: 132, id: 'clas4', displayField: 'clasName', valueField: 'id', hiddenName: 'clasName1', typeAhead: true, triggerAction: 'all', forceSelection: true, selectOnFocus: true, mode: 'remote', editable: false }] },{ layout: 'column', xtype: 'panel', width : 380, id: 'day5', border: true, style: 'border-style: solid; border-width: thin; border-color:lightblue;', items: [{ layout: 'form', width: '40%', id: 'dayNum5', xtype: 'label', style: 'font-size: 13; font-family: "黑体"; margin-left: 65;', text: '第五天' }, { layout: 'form', store: classStore, xtype: 'combo', width: 132, id: 'clas5', displayField: 'clasName', valueField: 'id', hiddenName: 'clasName1', typeAhead: true, triggerAction: 'all', forceSelection: true, selectOnFocus: true, mode: 'remote', editable: false }] },{ layout: 'column', xtype: 'panel', width : 380, id: 'day6', border: true, style: 'border-style: solid; border-width: thin; border-color:lightblue;', items: [{ layout: 'form', width: '40%', id: 'dayNum6', xtype: 'label', style: 'font-size: 13; font-family: "黑体"; margin-left: 65;', text: '第六天' }, { layout: 'form', store: classStore, xtype: 'combo', width: 132, id: 'clas6', displayField: 'clasName', valueField: 'id', hiddenName: 'clasName1', typeAhead: true, triggerAction: 'all', forceSelection: true, selectOnFocus: true, mode: 'remote', editable: false }] },{ layout: 'column', xtype: 'panel', width : 380, id: 'day7', border: true, style: 'border-style: solid; border-width: thin; border-color:lightblue;', items: [{ layout: 'form', width: '40%', id: 'dayNum7', xtype: 'label', style: 'font-size: 13; font-family: "黑体"; margin-left: 65;', text: '第七天' }, { layout: 'form', store: classStore, xtype: 'combo', width: 132, height: 23, id: 'clas7', displayField: 'clasName', valueField: 'id', hiddenName: 'clasName1', typeAhead: true, triggerAction: 'all', forceSelection: true, selectOnFocus: true, mode: 'remote', editable: false }] }] }] }], buttonAlign : 'right', minButtonWidth : 60, buttons : [{ text: '保存', id: 'addButton', width: 60, iconCls: 'add', xtype: 'button', handler: function() {/** 处理方法 */ } }, { text : '重置', iconCls:'reset', id: 'reset', handler : function() { if(operStatus==1){ this.ownerCt.ownerCt.form.reset(); }else{ var record = grid.getSelectionModel().getSelected(); this.ownerCt.ownerCt.getForm().loadRecord(record); } } }, { text : '取消', iconCls:'return', id: 'cancel', style:'margin-right:25px;', handler : function() { this.ownerCt.ownerCt.ownerCt.close(); } },{ text : '关闭', iconCls:'return', id: 'close', hidden: true, style:'margin-right:25px;', handler : function() { this.ownerCt.ownerCt.ownerCt.close(); } }] })] }).show(); }
下拉框中需要加载数据源classStore,但是这个store需要在popWin()外面去加载,如果写到方法里面去就不会正确回显,只显示ID不显示名称。
相关文章推荐
- jdbc连接数据库的时候,显示出乱码。所以修改my.ini下的编码格式,把utf-8改为gbk,但是保存的时候出现说my.ini拒绝访问的情况。保存不成功,希望大家能够帮我解决,谢谢!
- 解决问题最重要的习惯不是一直盯着屏幕和编写修改代码,某些时候,阻止你成功的东西恰恰会是过于努力。这时候你需要暂停一下,平缓你的思绪,换一种方法或许能带给你不一样的效果。
- Extjs中,添加成功/修改成功/刷新页面
- extjs 有些时候修改的时候值没有加载完成在窗口加载的时候加上 delay
- Extjs 点击编辑的时候有一个省市级联,市ComboBox不能选中displayField
- 修改用户信息的时候,使用Servlet对新的数据和数据库的数据进行对比,修改成功实现页面的弹窗和页面的跳转
- SAS中修改一个表为编辑模式的时候不成功并给出警告的原因及解决办法
- 关于extjs checkboxgroup 数据修改时候数据匹配加载
- ExtJs之combobox
- 图片转成BASE64字符串,然后以JSON的方式传递。当图片大小在1M左右的时候没问题,可以上传。但是当文件大小>1.5M的是否发现图片转BASE64不成功,居然得到的值是NULL
- ExtJs表格控件(三)----单元格编辑与提交修改
- (转)Groupon前传:从10个月的失败作品修改,1个月找到成功 并不挶泥在这个点子上面,它反而往后站一步,看看他们已经做好的这个网站,可以再怎么包装成另一个完完全全不同的网站?所有的人所做的每件失败的事情中, 一定有碰到或含有成功的答案」在里面,只是他们不知道而已。 人不怕失败」,只怕宣布失败」
- Extjs中ComboBox加载并赋初值
- extjs之combobox setValue无效解决方法
- Extjs ComboBox 模糊过滤(转载)
- 接以前的,弹出messagebox的时候,修改其按钮文字
- C#编写的winform程序绑定comboBox成功,添加一个默认的文字选项"请选择"
- 在ExtJS的ComboBox组件中实现下拉树效果
- ExtJs修改字体大小格式
- 修改主机名mq不能成功启动memcache失败报错