extjs grid 一个界面中吧一个表格的数据转到另一个表格

Question

我的界面上用两个表格一个按钮，我想通过这个按钮点击的时候把一个表格选中的数据转到另外一个表格，我该怎么做，请高手指教，

Answer 1

Ext.onReady(function() {
    var btn = new Ext.Button({
        text: "把grid1的数据转到grid2中", renderTo: "btn",
        handler: function() {
            var arr = []
            for (var i = 0; i < store.getCount(); i++) {
                arr.push([store.getAt(i).get("id"), store.getAt(i).get("name")])
            }
            store2.loadData(arr);
            store.removeAll();
        }
    })
    var reader = new Ext.data.ArrayReader({}, [
       { name: 'id' },
       { name: 'name' }
]);
    var store = new Ext.data.Store({
        reader: reader,
        data: [[1, 'zjp'], [2, 'zoujp']]
    });
    var grid1 = new Ext.grid.GridPanel({
        id: "g1", renderTo: "grid1",
        store: store, border: false,
        columns: [
      new Ext.grid.RowNumberer(),
         { header: "Id", width: 100, sortable: true, dataIndex: 'id' },
         { header: "Name", width: 150, sortable: true, dataIndex: 'name' }
        ], height: 200,
        stripeRows: true,
        viewConfig: {
            forceFit: true, emptyText: '<div style="text-align:center; padding:20px">暂无数据显示</div>',
            deferEmptyText: false
        }
    });    var reader2 = new Ext.data.ArrayReader({}, [
       { name: 'id' },
       { name: 'name' }
]);
    var store2 = new Ext.data.Store({
        reader: reader2
    });
    var grid1 = new Ext.grid.GridPanel({
        id: "g2", renderTo: "grid2",
        store: store2, border: false,
        columns: [
      new Ext.grid.RowNumberer(),
         { header: "Id", width: 100, sortable: true, dataIndex: 'id' },
         { header: "Name", width: 150, sortable: true, dataIndex: 'name' }
        ], height: 200,
        stripeRows: true,
        viewConfig: {
            forceFit: true, emptyText: '<div style="text-align:center; padding:20px">暂无数据显示</div>',
            deferEmptyText: false
        }
    });
});

Answer 2

EXTJS4 有grid.getView().getSelectionModel().getSelection()可以直接获得所选数据，
loadRecord()过去就可以了。EXTJS3忘了。

Answer 3

这个你可以参考grid代码中的键盘方向键来写。看grid的类代码

Answer 4

var firstGrid ;
var secondGrid ;
var short_sort;
var s_store1;function init()
{
//测试
   var columns = new Ext.grid.ColumnModel([
     
     {header:"编号",dataIndex:"shortcutsid",width:100,hidden:true},
 {header:"功能ID",dataIndex:"varmenuframeid",width:150,hidden:true},
         {header:"显示名称",dataIndex:"varcaption",width:200},
          {header:"显示顺序",dataIndex:"short_sort",width:200,hidden:true}
         ]);
   var columns1 = new Ext.grid.ColumnModel([
  
         {header:"编号",dataIndex:"shortcutsid",width:100,hidden:true},
 {header:"功能ID",dataIndex:"varmenuframeid",width:100,hidden:true},
         {header:"显示名称",dataIndex:"varcaption",width:200},
 {header:"显示顺序",dataIndex:"short_sort",width:100}
          ]);

  var s_tbar = [ {text :"上移",iconCls : "xy-arrow-up",handler : moveOn},"-",
          {text :"下移",iconCls : "xy-arrow-down",handler : moveDown},
          {text :"保存",iconCls : "save",handler : saveShortcutsHandler}
        ];   
       
var s_store = new Ext.data.JsonStore({
url:"TBM/getShrotcuts.action",
root:"data",
fields:["shortcutsid","varmenuframeid","varcaption","short_sort"]
});
s_store.load();
s_store1 = new Ext.data.JsonStore({
    id:"s_store1",
    url:"TBM/getShrots.action",
root:"data",
fields:["shortcutsid","varcaption","short_sort","varmenuframeid"]
});
s_store1.load();
//
         
firstGrid = new Ext.grid.GridPanel({
title:"功能菜单",
layout:'fit',
border:false,
cm:columns,
store:s_store,
tbar:[ new Ext.form.TextField({id:'FunMenu',width:200}),
       new Ext.Button({text:'查询',handler:selectHandler})],
width:150
});
secondGrid = new Ext.grid.GridPanel({
title:"个人功能快捷菜单",
layout:'fit',
border:false,
cm:columns1,
store:s_store1,
width:150,
tbar:s_tbar
});
var short_formFile = new Ext.Button({
id:"short_formFile",
text:'------>',
handler:addShortcutsHandler
   }); 
    var short_formFile1 = new Ext.Button({
id:"short_formFile1",
text:'<------',
handler:deleteShortcutsHandler
   }); 
    var  short_form =  new Ext.form.FormPanel({
 id:'short_form'
,frame:true
   //,buttonAlign:"center"
   ,items:[
   {height:200},
   {labelWidth:150,items:short_formFile},
   {height:20},
           {labelWidth:150,items:short_formFile1}
          ]
    });     var border = new Ext.Viewport({
layout:'border'
   ,items:[{region:'west'
           ,split:true
               ,width:260
               ,minSize:5
               ,layout:'fit'
           ,items:firstGrid
           },{
            region:'center'
           ,margins:'5 5 0 0'
           ,layout:'border'
           ,items:[{region:'west'
                   ,split:true
                   ,width:70
                   ,minSize:5
                   ,layout:'fit'
                   ,items:short_form
                   },{
                    region:'center'
                   ,split:true
                   ,minSize:5
                   ,layout:'fit'
                   ,items:secondGrid
                   }
                  ]
           }
          ]
}); 
  // 双击事件
firstGrid.on("rowdblclick",function (){shorts_addDate();});
// 双击事件
secondGrid.on("rowdblclick",function (){shorts_RemoveDate();});

}Ext.onReady(init);// 上移
function moveOn() {
var selectedSendcondDataRecord = secondGrid.getSelectionModel()
.getSelected();
if (selectedSendcondDataRecord == undefined) {
Ext.Msg.alert("提示", "请选择一行");
return;
} else {
if (selectedSendcondDataRecord.get('short_sort') == 1) {
Ext.Msg.alert("提示", "已经是首行");
} else {
var aa = selectedSendcondDataRecord.get('short_sort');
var i = parseInt(aa);
secondGrid.getStore().getAt(i - 1).set('short_sort', i - 1);// 得到选中的值
secondGrid.getStore().getAt(i - 2).set('short_sort', i); // 上一个值
secondGrid.store.sort('short_sort', 'ASC');// desc
}
}
}
// 下移
function moveDown() {
var selectedSendcondDataRecordD = secondGrid.getSelectionModel()
.getSelected();
var s_countD = secondGrid.getStore().getCount();
if (selectedSendcondDataRecordD == undefined) {
Ext.Msg.alert("提示", "请选择一行");
return;
} else if (selectedSendcondDataRecordD.get('short_sort') == s_countD) {
Ext.Msg.alert("提示", "已经是尾行");
return;
} else {
var aa = selectedSendcondDataRecordD.get('short_sort');
var i = parseInt(aa);
secondGrid.getStore().getAt(i - 1).set('short_sort', i + 1);// 得到当前
secondGrid.getStore().getAt(i).set('short_sort', i);// 下一个
secondGrid.store.sort('short_sort', 'ASC');// desc
}
}

Answer 5

取到一个grid的store然后插入到别外的grid的store中去