How to interact data (record) between form and grid in extjs

How to interact data (record) between form and grid in extjs_javascript skills

WBOY

Release： 2016-05-16 17:23:59

Original

1503 people have browsed it

First define the edit button in the tbar of the grid:
Js code

Copy the code The code is as follows:

id:'editDataButton', 
text:'edit', 
tooltip:'edit', 
iconCls:'edit', 
handler: function(){ showeditPanel( );}

Redefine form:

Js code

Copy code The code is as follows:

var xjjlEditForm = new Ext.FormPanel ({.......omit the definition content in the form...});

Then define the function showeditPanel to be called by the edit button (and define a loading form at the same time window):

Js code

Copy code The code is as follows:

//--Function called by the edit button (pop-up edit form)
function showeditPanel()
{ //Get the record corresponding to the selected row directly
var record = grid.getSelectionModel().getSelected()
if(!record){
Ext.Msg.alert('Message','Please select the data to edit');
return;
}

//--Define the editing window
if(!xjjlEditWindow)
{
xjjlEditWindow = new Ext.Window({
el: 'edit_win', //The front end places the current js file The div name in the page is
title: 'Edit Record',
width: 650,
height: 360,
closable: false,
closeAction: 'hide',
resizable : false,
items: xjjlEditForm //Load the edited form in the window
});

}
xjjlEditWindow.show(Ext.get('editDataButton'));//Show the edit window

//[Note] First xjjlEditWindow.show(); and then xjjlEditForm.getForm().loadRecord(currrecordRecord); can solve the problem that after the previous page loading is completed, the data cannot be loaded when the [Edit] button is clicked for the first time. It’s a question of form.
xjjlEditForm.getForm().loadRecord(record);
//The key is to fill the form with the record in the currently selected grid
}

This way, it can be used in the new The selected data is edited in the window;