请问哪位高手知道如何将EXTJS中将选中一行grid的值传入一个FormPanel面板中。最好能给个示例,谢谢!
[b]问题补充:[/b]
FormPanel和grid不同时展示,FormPanel需要在一个window下打开
[quote]请问哪位高手知道如何将EXTJS中将选中一行grid的值传入一个FormPanel面板中。最好能给个示例,谢谢!
[/quote]
[code="js"]
var record = grid.getSelectionModel().getSelected();//获得选中的一行
formpanel.getForm().loadRecord(record);//加载到表单[/code]
[quote]问题补充:
FormPanel和grid不同时展示,FormPanel需要在一个window下打开 [/quote]
[code="js"]
var record = grid.getSelectionModel().getSelected();
var win = new Ext.Window({
width:200,
height:200,
//layout:'fit'//充满
items:[formpanel]//定义好的formpanel
listeners:{
show:function(){
formpanel.getForm().loadRecord(record);
//this.get(0).getForm().loadRecord(record);//无法引用到formpanel的时候
}
}
});
win.show();
[/code]
把你自己的EXT包换进去即可。
[code="java"]
<br> Ext.onReady(function () {<br> var data = [<br> ['rowen', 'hohai', 'basketball', '2005-11-01'],<br> ['yyy', 'yizhong', 'football', '2006-02-12'],<br> ['ysc', 'jianzhong', 'pingpong', '2007-01-21'],<br> ['yww', 'jianxiao', 'pingpong', '2008-01-20']];<br> var reader = new Ext.data.ArrayReader({},<br> [{<br> name: 'name'<br> },<br> {<br> name: 'school'<br> },<br> {<br> name: 'sport'<br> },<br> {<br> name: 'year',<br> type: 'date',<br> dateFormat: 'Y-m-d'<br> },<br> {<br> name: 'desc'<br> }]);<br> var store = new Ext.data.Store({<br> data: data,<br> reader: reader,<br> sortInfo: {<br> field: 'name',<br> direction: 'desc'<br> }<br> });<br> var cm = new Ext.grid.ColumnModel([{<br> header: '姓名',<br> sortable: true,<br> width: 160,<br> dataIndex: 'name'<br> },<br> {<br> header: '入学年份',<br> sortable: true,<br> width: 160,<br> dataIndex: 'school',<br> editor: new Ext.form.TextField({<br> allowBlank: false<br> })<br> },<br> {<br> header: '运动爱好',<br> sortable: true,<br> width: 160,<br> dataIndex: 'sport'<br> },<br> {<br> header: '入学年份',<br> sortable: true,<br> width: 160,<br> dataIndex: 'year',<br> renderer: Ext.util.Format.dateRenderer('Y-m-d')<br> }]);</p> <pre><code>grid = new Ext.grid.GridPanel({ title: 'groupGrid', store: store, cm: cm, width: 600, height: 200, frame: true, //draggable :true, enableDragDrop: true, viewConfig: { forceFit: true }, //animCollapse:true, collapsible: true, // inline toolbars tbar: [{ text: 'Add Something', tooltip: 'Add a new row', iconCls: 'add', handler: function () { alert("Add Something"); } }, '|', { text: 'Options', tooltip: 'Blah blah blah blaht', iconCls: 'option' }, '|', { text: 'Remove Something', tooltip: 'Remove the selected item', iconCls: 'remove' }] }); var form = new Ext.FormPanel({ autoWidth: true, bodyStyle: 'padding:5px 5px 0', frame: true, height: 400, labelAlign: 'right', labelWidth: 80, title: 'form', width: '120', items: [{ layout: 'column', border: false, items: [{ columnWidth: 0.50, layout: 'form', border: false, items: [{ tabIndex: 1, anchor: '100%', fieldLabel: '姓名', name: 'name', xtype: 'textfield' }] }, { columnWidth: 0.50, layout: 'form', border: false, items: [{ tabIndex: 12, anchor: '100%', fieldLabel: '学校', name: 'school', xtype: 'textfield' }] }, { columnWidth: 0.50, layout: 'form', border: false, items: [{ tabIndex: 13, anchor: '100%', fieldLabel: '运动爱好', name: 'sport', xtype: 'textfield' }] }, { columnWidth: 0.50, layout: 'form', border: false, items: [{ tabIndex: 13, anchor: '100%', fieldLabel: '入学年份', name: 'year', format: 'Y-m-d', xtype: 'datefield' }] }] }] }); var win = new Ext.Window({ title: 'je test', height: 500, renderTo: document.body, width: 600 , items: [grid, form] }); win.show(); grid.on('click', function () { var record = grid.getSelectionModel().getSelected() form.getForm().findField('name').setValue(record.get('name')); form.getForm().findField('school').setValue(record.get('school')); form.getForm().findField('sport').setValue(record.get('sport')); form.getForm().findField('year').setValue(record.get('year')); }); </code></pre> <p>});<br>
http://www.extjs.com/deploy/dev/examples/dd/dnd_grid_to_formpanel.html
官网的拖拽示例.
和你的问题很像了. 改改就能用应该.
var sm = new Ext.grid.CheckboxSelectionModel({
singleSelect: true,
listeners: {
rowselect: function(sm, row, rec) {
[color=red] Ext.getCmp('你要赋值form id').getForm().loadRecord(rec); [/color]
}
}
});
只要form里面的控件的id对应grid里列映射的名称就可以把值赋到form的控件中。
其实一样的嘛,只要你可以用Ext.getCmp获取到form控件就可以了。
如果是打开新页面的窗口就要一个个值去传和set。