Home > Web Front-end > JS Tutorial > How to interact data (record) between form and grid in extjs_javascript skills

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

WBOY
Release: 2016-05-16 17:23:59
Original
1499 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;
Related labels:
source:php.cn
Statement of this Website
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn
Popular Tutorials
More>
Latest Downloads
More>
Web Effects
Website Source Code
Website Materials
Front End Template