extjs_javascript 기술에서 양식과 그리드 간 데이터(기록)를 상호 작용하는 방법

먼저 그리드의 tbar에 편집 버튼을 정의합니다:
Js 코드

코드 복사 코드는 다음과 같습니다.

id:'editDataButton',
text:'edit',
tooltip:'edit',
iconCls:'edit',
핸들러: 함수(){ showitPanel( );}

양식 재정의:

Js 코드

코드 복사 코드는 다음과 같습니다.

var xjjlEditForm = new Ext.FormPanel ({.......양식에서 정의 내용 생략...});

그런 다음 편집 버튼에 의해 호출될 ShowitPanel 함수를 정의합니다(그리고 동시에 양식 로드 중):

JS 코드

코드 복사 코드는 다음과 같습니다.

//--편집에 의해 호출되는 함수 버튼(팝업 편집 형태)
function ShowitPanel()
{ //선택한 행에 해당하는 레코드를 직접 가져옵니다.
var Record = Grid.getSelectionModel().getSelected()
if( !record){
Ext.Msg.alert('Message','수정할 데이터를 선택하세요')
return
}

//--편집 창 정의
if(!xjjlEditWindow)
{
xjjlEditWindow = new Ext.Window({
el: 'edit_win', //프론트 엔드는 현재 js 파일 페이지의 div 이름은
title: 'Edit Record',
width: 650,
height: 360,
closable: false,
closeAction: 'hide',
resised : false,
items: xjjlEditForm //창에 편집된 양식 로드
})

}
xjjlEditWindow.show(Ext.get('editDataButton'));//편집 창 표시

//[참고] 먼저 xjjlEditWindow.show(); 다음 xjjlEditForm.getForm().loadRecord(currrecordRecord)는 이전 페이지 로딩이 완료된 후 [Edit ] 버튼을 처음 눌렀을 때 양식에 관한 질문입니다.
xjjlEditForm.getForm().loadRecord(record);
//현재 선택된 그리드의 레코드로 양식을 채우는 것이 핵심입니다.
}

이렇게 하면, 새로운 창에서 사용할 수 있습니다. 선택한 데이터는 창에서 편집됩니다.