이름 상자

SpreadJS는 Excel과 유사한 이름 상자 컴포넌트를 제공하여, 선택된 셀 범위, 항목, 명명된 범위를 표시할 수 있습니다. 이 기능은 Spread 컨트롤과 함께 이름 상자 컴포넌트를 프로젝트에 추가하여 사용할 수 있게 해줍니다.

이름 상자는 기본적으로 선택된 셀의 주소를 표시하며, 선택 박스와 드롭다운 목록 으로 구성되어 있습니다.

다음과 같이 이름 상자 선택기에 선택 내용을 표시할 수 있습니다:

• 선택이 변경될 때 선택 범위를 표시

  
  

• 선택이 완료되었을 때 활성 셀을 표시

  
  

• 도형이 선택되었을 때 도형 이름을 표시

  
  

• 선택한 범위가 명명된 범위 또는 테이블 이름과 같을 경우 해당 이름을 표시

  
  

이름 상자의 드롭다운에는 다음과 같은 사용자 지정 이름 목록이 표시됩니다:

• 통합 문서 사용자 지정 이름 및 그 표현식 유형이 **GC.Spread.CalcEngine.ExpressionType.reference**인 항목

• 활성 워크시트의 사용자 지정 이름 및 그 표현식 유형이 **GC.Spread.CalcEngine.ExpressionType.reference**인 항목

• 모든 워크시트의 모든 테이블 이름

이름 상자 구성

이름 상자 구성 요소를 만들기 위해 아래 단계를 따르시기 바랍니다:

1. HTML에 gc.spread.sheets.all.x.x.x.min.js 참조를 추가합니다.

   <script type="text/javascript" src="scripts/modules/gc.spread.sheets.all.x.x.x.min.js"></script>

2. 호스트 DIV 요소를 추가합니다.

   <div id="NameBox" style="width:100px"></div>

3. NameBox 요소를 Spread 인스턴스에 바인딩합니다.

   var sheet = spread.getActiveSheet();
   var nameBox = new GC.Spread.Sheets.NameBox.NameBox(document.getElementById('NameBox'), spread);

4. 추가로 이름 상자 옵션을 설정할 수도 있습니다. 자세한 내용은 아래의 이름 상자 옵션 설 섹션을 참고하세요.

이름 상자 옵션 설정

INameBoxOptions 인터페이스를 사용하여 이름 상자의 동작을 제어할 수 있는 다양한 옵션을 설정할 수 있습니다.

예를 들어, 드롭다운 목록의 높이 설정, 사용자 정의 이름 추가, 범위로의 이동, 사용자 정의 이름 표시 등을 제어할 수 있습니다.

다음 코드는 이름 상자 옵션을 설정하는 방법을 보여줍니다:

 var nameBox = new GC.Spread.Sheets.NameBox.NameBox(document.getElementById('NameBox'), spread, {
                showCustomNameList: false,
                dropDownMaxHeight: 200,
                enableAddCustomName: false,
                enableNavigateToRange: false
 });