ExtJS4는 동적으로 생성된 그리드를 Excel로 내보내기 example

ExtJS4는 동적으로 생성된 그리드를 Excel로 내보내기 example_extjs

WBOY

풀어 주다： 2016-05-16 16:50:32

원래의

1858명이 탐색했습니다.

오랫동안 검색한 결과 몇 가지 예를 찾았습니다. 저는 초보자이기 때문에 대부분 사용법을 모릅니다. .

소스코드를 공부하고 드디어 기본 다운로드를 달성했습니다. 테이블을 반복적으로 다운로드할 수 없는 작은 버그와 그리드 초기화 사용 시 발생하는 버그를 해결했습니다

아래 단계를 기록합니다. 다음번에 유용할 것 같습니다

1. 다운로드하려면 js 코드가 필요합니다. 이미 업로드했습니다.

2. html 파일에 참조를 추가하세요. 참고로 다음은 내 경로입니다

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

;

3. onReady() 시작 부분에

을 추가하세요. 코드는 입니다. >

Ext.Loader.setConfig({ 활성화: true }) 
Ext.Loader.setPath('Ext.ux.exporter', '../export/exporter') 
 Ext.require([ 
'Ext.ux .exporter.Exporter' 
]) 

 

네임스페이스를 설정합니다. .

경로에 주의하세요. 4. 코드에서 이를 사용하고 기능을 다운로드해야 하는 그리드의 적절한 위치에

을 추가하세요. 코드를 복사하세요 코드는 다음과 같습니다:

xtype: 'exporterbutton', 
// store: store 
comComponent: Ext.getCmp( 'gird_a') 

 

Excel을 초기화하는 방법은 두 가지가 있습니다. 하나는 Store의 필드와 데이터를 사용하여 Store로 초기화하는 것입니다. 컬럼 이름이 영어로 되어 있어서 이 방법은 사용하지 않고 그리드로 직접 초기화합니다.

다른 사람의 코드를 참고하여 수정한 내용입니다

1.exporter.js 40번째 줄에서

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

var columns = Ext.Array.filter(grid.columnManager.columns,

 
 원래 코드에는 첫 번째 매개변수에 Grid.columns가 있었는데 나중에 재구성 후 동적으로 생성된 그리드의 열이 columnManager.columns에 배치된 것을 발견하여 이렇게 변경했습니다. 

2 .workbook.js 77.78행에

두 문장을 추가합니다. 코드는 다음과 같습니다.

this.styles =[];

this.worksheets=[]; 

위의 두 줄의 코드는 일부 초기화를 수행합니다. 그렇지 않으면 Excel이 생성될 때마다 이전 데이터가 지워지지 않아 포맷 오류

위의 간단한 수정 후 그리드를 마음대로 내보낼 수 있으며, 사용자 정의 필드의 테이블 내보내기, 즉 내보내기 테이블에 표시되는 열이 지원됩니다

렌더링은 여기:

ExtJS4는 동적으로 생성된 그리드를 Excel로 내보내기 example_extjs