nexacro-xeni 소개

넥사크로플랫폼에서는 엑셀의 익스포트와 임포트 처리를 위해 nexacro-xeni를 제공합니다. nexacro-xeni는 엑셀의 익스포트/임포트를 서버에서 처리한 후 그 결과를 돌려주는 기능을 수행하는 서버 애플리케이션입니다.

엑셀 익스포트/임포트 기능을 자체적으로 처리하지 않고 번거롭게 서버 애플리케이션을 통해 처리하는 이유는 엑셀 파일을 처리하려면 로컬 시스템의 자원을 사용해야 하기 때문입니다. 이는 심각한 보안 문제를 야기할 수 있어 브라우저에서 막고 있습니다. 따라서 넥사크로플랫폼에서는 nexacro-xeni를 사용한 방법을 제공합니다.

nexacro-xeni는 다음의 문서를 익스포트/임포트할 수 있습니다.

익스포트/임포트 동작 시 서버에는 파일들이 생성됩니다. 이 파일들은 nexacro-xeni의 파일매니저를 통해 관리되기 때문에 기본 설정으로 사용하면 개발자가 신경쓸 필요는 없습니다. 파일매니저는 서버의 /WEB-INF/web.xml 파일에서 서블릿 컨텍스트 파라미터를 통해 동작을 설정할 수 있습니다. 다음은 서블릿 컨텍스트 파라미터로 설정할 수 있는 요소에 대한 설명입니다.

ExcelExportObject 소개

ExcelExportObject는 Grid의 내용을 엑셀 파일로 익스포트하는데 사용하는 오브젝트입니다. 개발자는 이 오브젝트를 사용해 익스포트에 필요한 설정과 서버로의 요청을 수행할 수 있습니다.

익스포트 처리 결과는 이벤트를 통해 확인할 수 있습니다. 사용할 수 있는 이벤트로는 onsuccess, onerror, onprogress가 있습니다. onsuccess는 익스포트가 성공적으로 완료되었을 때 발생하는 이벤트이고, onerror는 익스포트중 오류가 생겼을 때 발생하는 이벤트입니다. 그리고 onprogress는 익스포트 진행 상태에 따라 발생하는 이벤트입니다. 이벤트는 객체 생성 시 이벤트와 이벤트 핸들러를 등록하여 사용할 수 있습니다.

ExcelExportObject는 다른 UI 컴포넌트와 달리 형태가 없는 오브젝트입니다. 따라서 스크립트로 직접 객체와 이벤트를 생성해줘야 합니다. 다음은 ExcelExportObject를 사용해 익스포트를 수행하는 절차에 대한 간단한 설명과 샘플을 보여줍니다.

ExcelExportObject 객체를 생성합니다.

this.exportObj = new ExcelExportObject("Export00", this);

저장할 엑셀 파일의 이름, 익스포트를 수행하는 서비스 URL 그리고 대상이 될 Grid와 범위 등을 필요에 따라 설정합니다.

this.exportObj.set_exportfilename("ExcelExportFile");
this.exportObj.set_exporttype(nexacro.ExportTypes.EXCEL2007);
this.exportObj.set_exporturl("http://localhost:8080/XExportImport");

this.exportObj.addExportItem(nexacro.ExportItemTypes.GRID, this.Grid00, "Sheet1!A1");

필요에 따라 addEventHandler 메소드를 사용해 이벤트와 이벤트 핸들러를 등록합니다. 여기서 등록한 이벤트 핸들러는 직접 구현해야 합니다.

this.addEventHandler("onsuccess", this.Export00_onsuccess, this);
this.addEventHandler("onerror", this.Export00_onerror, this);

모든 준비가 완료되면 익스포트를 수행합니다.

this.exportObj.exportData();

ExcelImportObject 소개

ExcelImportObject는 엑셀 파일의 내용을 Grid에 임포트하는데 사용하는 오브젝트입니다. 임포트에 필요한 설정과 서버로의 요청을 담당합니다. 개발자는 스크립트에서 이를 사용하여 엑셀을 임포트할 수 있습니다.

임포트 처리 결과는 이벤트를 통해 확인할 수 있습니다. 사용할 수 있는 이벤트로는 onsuccess, onerror가 있습니다. onsuccess는 임포트가 성공적으로 완료되었을 때 발생하는 이벤트이고, onerror는 임포트중 오류가 생겼을 때 발생하는 이벤트입니다. 이벤트는 객체 생성시 이벤트와 핸들러를 등록하여 사용할 수 있습니다.

ExcelImportObject 객체를 생성합니다.

this.importObj = new ExcelImportObject("Import00", this);

임포트할 파일의 형식, 임포트를 수행하는 서비스 URL 등을 필요에 따라 설정합니다.

this.importObj.set_importtype(nexacro.ImportTypes.EXCEL);
this.importObj.set_importurl("http://localhost:8080/deploy/XImport");

필요에 따라 addEventHandler 메소드를 사용해 이벤트와 이벤트 핸들러를 등록합니다. 여기서 등록한 이벤트 핸들러는 직접 구현해야 합니다.

this.importObj.addEventHandler("onsuccess", this.Import00_onsuccess, this);
this.importObj.addEventHandler("onerror", this.Import00_onerror, this);

모든 준비가 완료되면 임포트를 수행합니다.

this.importObj.importData("", "Sheet1!A1:F6", "Dataset00");

Grid를 엑셀 파일로 내보내기(익스포트)

ExcelExportObject를 사용하여 화면상의 Grid를 엑셀 파일로 익스포트할 수 있습니다.

예제

다음은 ExcelExportObject를 사용하여 Grid의 내용을 엑셀 파일로 다운로드하는 예제입니다.

Export 버튼을 누르면 ExcelExportObject 객체를 생성하고 익스포트에 필요한 속성을 설정한 후 익스포트가 수행됩니다. 익스포트가 수행되면 파일 다운로드 다이얼로그가 뜨며 로컬PC로 저장할 수 있습니다.

sample_excelexportimport_01.xfdl

다음은 익스포트를 수행한 후 로컬 PC에 저장된 엑셀 파일의 내용을 보여줍니다. Grid의 데이터가 그대로 엑셀 파일로 익스포트됨을 확인할 수 있습니다.

예제에서 사용한 핵심 기능

exportfilename

익스포트 완료 후 저장될 파일명을 설정하는 속성입니다. 본 속성을 설정하지 않으면 임의의 파일명으로 설정됩니다.

exporturl

익스포트를 수행할 서비스의 URL을 설정하는 속성입니다. 본 속성을 설정하지 않으면 익스포트가 수행되지 않습니다.

addExportItem

익스포트할 아이템(컴포넌트)을 ExcelExportObject의 익스포트 목록에 추가하는 메소드입니다. 현재 Grid만 지원합니다.

addEventHandler

이벤트 발생 시 수행할 이벤트 핸들러를 추가하는 메소드입니다.

exportData

ExcelExportObject에 추가된 아이템을 익스포트하는 메소드입니다.

importData

이벤트 발생 시 수행할 이벤트 핸들러를 추가하는 메소드입니다.

예제 구현 방법

툴바에서 버튼 과 그리드 를 선택한 후, Form 위에 적당한 크기로 드래그하여 생성합니다. 그냥 폼에 대고 클릭하면 기본 크기로 생성됩니다.

Grid에 출력할 데이터 아이템 목록을 가진 Dataset을 생성합니다.

1. 툴바에서 Dataset 을 선택한 후, 폼 위 적당한 공간에 클릭하여 Dataset을 생성합니다.

2. 생성한 Dataset에 데이터 아이템 목록을 입력합니다. Invisible Objects 영역에 있는 Dataset을 더블 클릭하면 Dataset Editor가 뜨는데 Columns와 Rows에 아래 그림과 같이 입력합니다.

Dataset을 Grid 컴포넌트에 바인딩합니다.

Invisible Objects 영역에 있는 Dataset을 Form에 생성한 Grid 컴포넌트로 드래그 앤 드롭하면 바인딩이 완료됩니다.

Form에 있는 Button을 선택한 후 onclick 이벤트 핸들러를 아래와 같이 추가합니다.

this.Button00_onclick = function(obj:nexacro.Button,e:nexacro.ClickEventInfo)
{
	this.exportObj = new ExcelExportObject("Export00", this);
	
	this.exportObj.set_exportfilename("ExcelExportFile");
	this.exportObj.set_exporturl("http://demo.nexacro.com/developer_guide/XExportImport");
	
	this.exportObj.addExportItem(nexacro.ExportItemTypes.GRID, this.Grid00, "Sheet1!A1");
	
	this.addEventHandler("onsuccess", this.Export00_onsuccess, this);
	this.addEventHandler("onerror", this.Export00_onerror, this);
	
	var intExportedItem = this.exportObj.exportData();
	trace("Number of Exported Item: " + intExportedItem);
};

this.Export00_onsuccess = function(obj:ExcelExportObject, e:nexacro.ExcelExportEventInfo)
{
	trace("Export00_onsuccess");	
}

this.Export00_onerror = function(obj:ExcelExportObject, e:nexacro.ExcelExportEventInfo)
{
	trace("Export00_onerror");
}

QuickView(Ctrl + F6)로 실행합니다.

Export 버튼을 눌러 화면의 Grid에 데이터가 엑셀 파일로 익스포트되는지 확인합니다.

엑셀 파일 읽어서 Grid로 보여주기(임포트)

ExcelImportObject를 사용하여 로컬 PC에 있는 엑셀 파일을 화면상의 Grid로 임포트할 수 있습니다.

예제

다음은 ExcelImportObject를 사용하여 로컬 PC에 있는 엑셀 파일을 화면상의 Grid로 임포트하는 예제입니다.

Import 버튼을 누르면 ExcelImportObject 객체를 생성하고 임포트에 필요한 속성을 설정한 후 임포트가 수행됩니다. 임포트가 수행되면 파일 열기 다이얼로그가 뜨며 로컬PC에서 엑셀 파일을 선택할 수 있습니다. 임포트 진행 중에는 진행을 알리는 이미지가 뜨는데 그때, ESC키를 누르면 임포트가 중단됩니다.

sample_excelexportimport_02.xfdl

다음은 임포트를 수행 시에 사용한 로컬 PC의 엑셀 파일입니다. 엑셀 파일의 데이터와 임포트한 Grid의 데이터가 차이가 보임을 확인할 수 있는데 이는 임포트 시 셀의 범위를 A1~E7까지로 정했기 때문입니다.

예제에서 사용한 핵심 기능

importtype

임포트할 파일의 형식을 설정하는 속성입니다. 설정은 다음 표의 상수값으로 할 수 있습니다. 한셀 2010 형식의 경우 현재 지원하지 않으니 엑셀 2007 파일로 변환하여 사용하시기 바랍니다.

importurl

임포트를 수행할 서비스의 URL을 설정하는 속성입니다. 본 속성을 설정하지 않으면 임포트가 수행되지 않습니다.

addEventHandler

이벤트 발생 시 수행할 이벤트 핸들러를 추가하는 메소드입니다.

importData

엑셀 또는 한셀 파일을 Dataset으로 임포트하는 메소드입니다.

this.ExcelImportObject00.importData("http://localhost:8080/xeni/XImport/my.xlsx","Sheet00!D15:E28","Dataset03=output1");

this.ExcelImportObject00.importData("","Sheet00!D15:E28","Dataset03=output1","filepassword=strpassword");

this.ExcelImportObject00.importData("", "[Command=getsheetlist;Output=sheetlist][Command=getsheetdata;Output=output1;Head=!A1:K1;Body=!A2:K15][Output=output2; Body=Sheet1!B7:Z207]", "ds_list=sheetlist, ds_Data1=output1, ds_Data2=output2");

예제 구현 방법

툴바에서 버튼 과 그리드 를 선택한 후, Form 위에 적당한 크기로 드래그하여 생성합니다. 그냥 폼에 대고 클릭하면 기본 크기로 생성됩니다.

Form에 있는 Button을 선택한 후 onclick 이벤트 핸들러를 아래와 같이 추가합니다.

this.Button00_onclick = function(obj:nexacro.Button,e:nexacro.ClickEventInfo)
{
	this.importObj = new ExcelImportObject("Import00", this);
	
	this.importObj.set_importtype(nexacro.ImportTypes.EXCEL);
	this.importObj.set_importurl("http://demo.nexacro.com/developer_guide/XImport");
	
	this.importObj.addEventHandler("onsuccess", this.Import00_onsuccess, this);
	this.importObj.addEventHandler("onerror", this.Import00_onerror, this);
	
	this.importObj.importData("", "Sheet1!A1:E7", "Dataset00");
	
};

this.Import00_onsuccess = function(obj:ExcelImportObject, e:nexacro.ExcelImportEventInfo)
{
	trace("Import00_onsuccess");
	
	this.Grid00.createFormat();
}

this.Import00_onerror = function(obj:ExcelImportObject, e:nexacro.ExcelImportErrorEventInfo)
{
	trace("Import00_onerror");	
}

QuickView(Ctrl + F6)로 실행합니다.

Import 버튼을 누르면 파일 다이얼로그 창이 뜹니다. 엑셀 파일을 선택하면 임포트가 진행되고 화면의 Grid로 엑셀 내용이 임포트되는지 확인합니다.

Grid의 이미지를 엑셀 파일로 내보내기

ExcelExportObject를 사용하여 화면상의 Grid를 엑셀 파일로 익스포트할 수 있습니다. 이때 Grid에 포함된 이미지가 있다면 ExportItem 오브젝트의 exportimage 속성을 사용하여 이미지 또한 익스포트가 가능합니다.

예제

다음은 ExcelExportObject를 사용하여 Grid의 내용을 엑셀 파일로 다운로드하는 예제입니다.

Export image 버튼을 누르면 ExcelExportObject 객체를 생성하고 익스포트에 필요한 속성을 설정한 후 익스포트가 수행됩니다. 익스포트가 수행되면 파일 다운로드 다이얼로그가 뜨며 로컬PC로 저장할 수 있습니다.

sample_excelexportimport_03.xfdl

다음은 익스포트를 수행한 후 로컬 PC에 저장된 엑셀 파일의 내용을 보여줍니다. Grid의 데이터와 이미지가 그대로 엑셀 파일로 익스포트됨을 확인할 수 있습니다.

예제에서 사용한 핵심 기능

getExportItem

ExcelExportObject에서 지정한 타입의 아이템을 반환하는 메소드입니다.

setExportItem

익스포트할 아이템을 ExcelExportObject의 특정 위치에 추가하는 메소드입니다.

exportimage

Grid의 셀에 설정된 이미지의 익스포트 방식을 설정하는 속성입니다.

예제 구현 방법

툴바에서 버튼 과 그리드 를 선택한 후, Form 위에 적당한 크기로 드래그하여 생성합니다.

Grid에 출력할 데이터 아이템 목록을 가진 Dataset을 생성합니다.

1. 툴바에서 Dataset 을 선택한 후, 폼 위 적당한 공간에 클릭하여 Dataset을 생성합니다.

2. 생성한 Dataset에 데이터 아이템 목록을 입력합니다. Invisible Objects 영역에 있는 Dataset을 더블 클릭하면 Dataset Editor가 뜨는데 Columns와 Rows에 아래 그림과 같이 입력합니다.

Dataset을 Grid 컴포넌트에 바인딩합니다.

Invisible Objects 영역에 있는 Dataset을 Form에 생성한 Grid 컴포넌트로 드래그 앤 드롭하면 바인딩이 완료됩니다.

Form에 있는 Button을 선택한 후 onclick 이벤트 핸들러를 아래와 같이 추가합니다.

this.Button00_onclick = function(obj:nexacro.Button,e:nexacro.ClickEventInfo)
{
	this.exportObj = new ExcelExportObject("Export00", this);
	
	this.exportObj.set_exportfilename("ExcelExportFile");
	this.exportObj.set_exporttype(nexacro.ExportTypes.EXCEL2007); 
	this.exportObj.set_exporturl("http://localhost:8080/deploy/XExportImport");
	

	this.exportObj.addExportItem(nexacro.ExportItemTypes.GRID, this.Grid00, "Sheet1!A1");
	
	var objExportItem = this.exportObj.getExportItem(nexacro.ExportItemTypes.GRID, 0);
	objExportItem.set_exportimage("image");	
	
	this.exportObj.setExportItem(nexacro.ExportItemTypes.GRID, 0, objExportItem);


	this.addEventHandler("onsuccess", this.Export00_onsuccess, this);
	this.addEventHandler("onerror", this.Export00_onerror, this);


	var intExportedItem = this.exportObj.exportData();
	trace("Number of Exported Item: " + intExportedItem);	
};

this.Export00_onsuccess = function(obj:ExcelExportObject, e:nexacro.ExcelExportEventInfo)
{
	trace("Export00_onsuccess");	
}

this.Export00_onerror = function(obj:ExcelExportObject, e:nexacro.ExcelExportEventInfo)
{
	trace("Export00_onerror");
}

QuickView(Ctrl + F6)로 실행합니다.

Export 버튼을 눌러 화면의 Grid에 데이터와 이미지가 엑셀 파일로 익스포트되는지 확인합니다.

여러 Grid 데이터를 엑셀 파일로 내보내기

ExcelExportObject를 사용하여 여러 개의 Grid를 엑셀 파일로 익스포트할 때 하나 혹은 여러 시트(Sheet)로 지정하여 익스포트할 수 있습니다. 이는 ExcelExportObject에 익스포트할 컴포넌트를 추가하는 addExportItem 메소드에서 익스포트 할 위치를 지정할 수 있기 때문입니다.

익스포트할 위치는 addExportItem 메소드의 매개변수 중 strRange를 설정하여 정할 수 있습니다. strRange를 설정할 때는 "시트명!셀영역" 또는 "셀영역"의 형식을 사용합니다. 예를 들어, export2 시트의 C3 셀에 Grid를 익스포트하고 싶으면 "export2!C3" 으로 설정합니다.

예제

다음은 ExcelExportObject를 사용하여 화면상에 있는 2개의 Grid를 엑셀 파일로 익스포트하는 예제입니다.

익스포트를 수행하는 2개의 버튼이 있는데 Export to 1 sheet 버튼을 누르면 2개 Grid를 1개 시트로 모두 익스포트하고 Export to 2 sheets 버튼을 누르면 2개 Grid를 2개 시트로 각각 익스포트합니다.

sample_excelexportimport_04.xfdl

다음은 수행된 결과로 생성된 엑셀 파일의 내용을 보여줍니다.

Export to 1 sheet 버튼을 누른 후 익스포트된 ExcelExportFile00.xls을 보면 Grid00을 Sheet1의 A1셀에 Grid01을 Sheet1의 A11셀에 익스포트한 결과를 확인할 수 있습니다.

Export to 2 sheets 버튼을 누른 후 익스포트된 ExcelExportFile01.xls을 보면 Gird00을 Sheet1의 A1셀에 Grid01을 Sheet2의 A1셀에 익스포트되었음을 확인할 수 있습니다.

예제에서 사용한 핵심 기능

clearExportItems

지정하는 아이템을 ExcelExportObject에서 삭제하는 메소드입니다. 삭제되면 익스포트에서 제외됩니다.

addExportItem

익스포트할 아이템(컴포넌트)을 ExcelExportObject의 익스포트 목록에 추가하는 메소드입니다. 현재 Grid만 지원합니다.

예제 구현 방법

Button 컴포넌트와 Grid 컴포넌트를 각각 2개씩 생성하여 예제와 같이 배치합니다. 툴바에서 Button 과 Grid 를 선택한 후, Form 위에 적당한 크기로 드래그하여 생성합니다.

Grid에 출력할 데이터 아이템 목록을 가진 Dataset을 생성합니다.

1. 툴바에서 Dataset 을 선택한 후, 폼 위 적당한 공간에 클릭하여 Dataset을 생성합니다.

2. 생성한 Dataset에 데이터 아이템 목록을 입력합니다. Invisible Objects 영역에 있는 Dataset을 더블 클릭하면 Dataset Editor가 뜨는데 Columns와 Rows에 아래 그림과 같이 입력합니다.

생성한 Dataset을 두 개의 Grid에 각각 바인딩합니다.

Invisible Objects 영역에 있는 Dataset을 Form에 생성한 Grid 컴포넌트로 드래그 앤 드롭하면 바인딩이 완료됩니다.

Form에 있는 Export to 1 sheet 버튼을 선택한 후 onclick 이벤트 핸들러를 아래와 같이 추가합니다.

this.Button00_onclick = function(obj:nexacro.Button,e:nexacro.ClickEventInfo)
{
	this.exportObj = new ExcelExportObject("Export00", this);

	this.exportObj.set_exporturl("http://localhost:8080/deploy/XExportImport");
	this.exportObj.set_exportfilename("ExcelExportFile00");
	this.exportObj.set_exporttype(nexacro.ExportTypes.EXCEL2007);

	this.exportObj.clearExportItems(nexacro.ExportItemTypes.GRID);

	this.exportObj.addExportItem(nexacro.ExportItemTypes.GRID, this.Grid00, "Sheet1!A1" );
	this.exportObj.addExportItem(nexacro.ExportItemTypes.GRID, this.Grid01, "Sheet1!A11" );

	var nCount = this.exportObj.exportData();
};

Form에 있는 Export to 2 sheets 버튼을 선택한 후 onclick 이벤트 핸들러를 아래와 같이 추가합니다.

this.Button01_onclick = function(obj:nexacro.Button,e:nexacro.ClickEventInfo)
{
	this.exportObj = new ExcelExportObject("Export01", this);

	this.exportObj.set_exporturl("http://localhost:8080/deploy/XExportImport");
	this.exportObj.set_exportfilename("ExcelExportFile01");
	this.exportObj.set_exporttype(nexacro.ExportTypes.EXCEL2007);

	this.exportObj.clearExportItems(nexacro.ExportItemTypes.GRID);

	this.exportObj.addExportItem(nexacro.ExportItemTypes.GRID, this.Grid00, "Sheet1!A1" );
	this.exportObj.addExportItem(nexacro.ExportItemTypes.GRID, this.Grid01, "Sheet2!A1" );

	var nCount = this.exportObj.exportData();
};

QuickView(Ctrl + F6)로 실행합니다.

Export to 1 sheet 버튼을 눌러 Grid 2개가 엑셀 파일에 1개의 Sheet1로 모두 익스포트되는지 확인합니다.

Export to 2 sheets 버튼을 눌러 Grid 2개가 엑셀 파일에 Sheet1, Shee2로 각각 익스포트되는지 확인합니다.