我自己碰到的這個問題,就是我在修改一條數據的時候,其他數據回顯都沒有問題,只有這個下拉列表中的數據,頁面上顯示的是數據庫中對應的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不顯示名稱。
Extjs中Combobox在修改的時候回寫不成功
發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.