extjs中form与grid交互数据(record)的方法

  首先在grid的tbar中定义编辑按钮:

  Js代码

  

复制代码 代码如下:

  id:'editDataButton',

  text:'编辑',

  tooltip:'编辑',

  iconCls:'edit',

  handler: function(){ showeditPanel();}

  再定义form:

  Js代码

  

复制代码 代码如下:

  var xjjlEditForm = new Ext.FormPanel({.......省略form中的定义内容........});

  然后定义编辑按钮要调用的函数showeditPanel(同时定义一个加载form的window):

  Js代码

  

复制代码 代码如下:

  //--编辑按钮调用的函数(弹出编辑窗体)

  function showeditPanel()

  { //直接取得选中的行对应的record

  var record = grid.getSelectionModel().getSelected()

  if(!record){

  Ext.Msg.alert('信息','请选择要编辑的数据');

  return;

  }

  //--定义编辑窗体

  if(!xjjlEditWindow)

  {

  xjjlEditWindow = new Ext.Window({

  el: 'edit_win', //前端放置当前js文件的页面中的div名称

  title:'编辑记录',

  width: 650,

  height: 360,

  closable: false,

  closeAction: 'hide',

  resizable: false,

  items: xjjlEditForm //在window中加载编辑的form

  });

  }

  xjjlEditWindow.show(Ext.get('editDataButton'));//显示编辑窗口

  //[注意]先xjjlEditWindow.show(); 再 xjjlEditForm.getForm().loadRecord(currrecordRecord); 就可以解决之前的页面加载完成以后,第一次点击[编辑]按钮时无法加载数据到form的问题了。

  xjjlEditForm.getForm().loadRecord(record);

  //关键是这里用当前选中的grid中的record填充form

  }

  这样就可以在新窗口中对选中的数据进行编辑了;