DOC-DETAILS-TAG-OPEN
DOC-SUMMARY-TAG-OPEN
확장하여 실행 중인 도구 상자를 통해 표 추가 보기DOC-SUMMARY-TAG-CLOSE
DOC-DETAILS-TAG-CLOSE
또는 [데이터 패널](/activereportsjs/docs/v2.2/ReportAuthorGuide/Report-Designer-Interface#data-panel)에서 데이터 집합 필드를 선택한 다음 보고서 페이지로 끌어 놓을 수 있습니다. 새로 작성된 표는 데이터 집합으로 자동으로 바인딩되고 선택한 필드의 캡션 및 값을 표시합니다.DOC-DETAILS-TAG-OPEN
DOC-SUMMARY-TAG-OPEN
확장하여 실행 중인 데이터 패널을 통해 표 추가 보기DOC-SUMMARY-TAG-CLOSE
DOC-DETAILS-TAG-CLOSE
### 표 디자이너 다음 다이어그램은 경계 상자 내 아무 곳이나 클릭하면 나타나는 ```표 디자이너```의 기본 구조를 보여줍니다.  ### 일반 표 구성 다음 두 가지 방법 중 하나를 사용하여 일반 표 구성을 [속성 패널](/activereportsjs/docs/v2.2/ReportAuthorGuide/Report-Designer-Interface#properties-panel)로 로드할 수 있습니다. * [보고서 탐색기](/activereportsjs/docs/v2.2/ReportAuthorGuide/Report-Designer-Interface#report-explorer)에서 ```표``` 항목을 선택합니다. * 표 [디자이너](/activereportsjs/docs/v2.2/#table-designer)에서 ```루트 처리기```를 클릭합니다.DOC-DETAILS-TAG-OPEN
DOC-SUMMARY-TAG-OPEN
확장하여 실행 중인 표의 일반적인 구성 수정 보기DOC-SUMMARY-TAG-CLOSE
DOC-DETAILS-TAG-CLOSE
일반 구성에는 [기본 보고서 항목 속성](/activereportsjs/docs/v2.2/ReportAuthorGuide/Report-Items/Common-Properties#base-properties), [공통 스타일 속성](/activereportsjs/docs/v2.2/ReportAuthorGuide/Report-Items/Common-Properties#style-properties), [데이터 영역 속성](/activereportsjs/docs/v2.2/ReportAuthorGuide/Report-Items/Data-Regions#common-properties), [표시 여부](/activereportsjs/docs/v2.2/ReportAuthorGuide/Report-Items/Common-Properties#visibility), [페이지 나누기](/activereportsjs/docs/v2.2/ReportAuthorGuide/Report-Items/Common-Properties#page-break) 및 다음 특정 속성이 있습니다. * 때때로 [표 푸터](/activereportsjs/docs/v2.2/#table-footer)이 페이지 맨 위에 단독으로 나타날 수 있습니다. ```분리된 푸터 방지``` 스위치를 켜서 이전 행을 다음 페이지로 이동하여 "고립된" 푸터와 함께 나타나도록 할 수 있습니다. * ```함께 유지``` 플래그는 ```표```가 맞는 경우 항상 단일 페이지에 표시될지 여부를 결정합니다. * ```새 섹션``` 플래그는 ```표```에 페이지 번호 매기기가 있는지 여부를 나타냅니다. 자세한 내용은 [전역 참조](/activereportsjs/docs/v2.2/ReportAuthorGuide/Expressions/references#page-numbering) 문서를 확인하십시오. * ```페이지 이름``` [문자열 식](/activereportsjs/docs/v2.2/ReportAuthorGuide/Report-Items/Common-Properties#expression)은 확장된 Excel 파일에 표를 표시하는 시트 이름을 설정합니다. ### 표 열 ```열```은 ```표``` 내에서 ```셀```의 세로 그룹입니다. ```도구 상자```를 통해 표를 추가하면 기본적으로 열 세 개가 있습니다. 데이터 집합 필드를 사용하여 표를 만드는 경우 표에는 필드당 열 하나가 있습니다. [열 처리기](/activereportsjs/docs/v2.2/#table-designer)를 마우스 오른쪽 버튼으로 클릭하면 열리는 상황에 맞는 메뉴를 사용하여 새 열을 추가하거나 기존 열을 삭제할 수 있습니다. ```열``` 구성에는 다음 속성이 포함됩니다. * [길이 단위](/activereportsjs/docs/v2.2/ReportAuthorGuide/Report-Items/Common-Properties#length)의 ```너비```는 행 내 표 셀의 너비를 결정합니다. 열의 총 너비는 표 너비와 동일합니다. * [표시 여부](/activereportsjs/docs/v2.2/ReportAuthorGuide/Report-Items/Common-Properties#visibility) 속성은 미리 보기 시 열의 정적 또는 동적 표시 여부를 결정합니다.DOC-DETAILS-TAG-OPEN
DOC-SUMMARY-TAG-OPEN
확장하여 실행 중인 열 추가 및 열 너비 설정 보기DOC-SUMMARY-TAG-CLOSE
DOC-DETAILS-TAG-CLOSE
```열 처리기```를 클릭하면 해당 열의 셀에 있는 보고서 항목이 모두 자동으로 선택됩니다. ```속성 패널```에는 이러한 보고서 항목을 모두 동시에 수정할 수 있는 추가 탭이 표시됩니다. 대부분의 일반적인 시나리오에서 이러한 추가 탭은 ```텍스트 상자```라고 하고 모든 열의 텍스트 상자 속성을 변경합니다.DOC-DETAILS-TAG-OPEN
DOC-SUMMARY-TAG-OPEN
확장하여 실행 중인 열 속성의 텍스트 상자 탭 사용 보기DOC-SUMMARY-TAG-CLOSE
)DOC-DETAILS-TAG-CLOSE
### 표 행 삭제 ```행```은 ```표``` 내에서 ```셀```의 가로 그룹입니다. 여러 행 유형이 다양한 용도를 지원하지만 공통 속성을 공유합니다. * [길이 단위](/activereportsjs/docs/v2.2/ReportAuthorGuide/Report-Items/Common-Properties#length)의 ```높이```는 행 내 표 셀의 처음 높이를 결정합니다. 그러나 셀은 미리 보기 시 높이를 늘이거나 줄일 수 있습니다. 자세한 내용은 [텍스트 상자](/activereportsjs/docs/v2.2/ReportAuthorGuide/Report-Items/Data-Visualizers/TextBox) 보고서 항목의 ```CanGrow``` 및 ```CanShrink``` 속성을 참조하십시오. * [표시 여부](/activereportsjs/docs/v2.2/ReportAuthorGuide/Report-Items/Common-Properties#visibility) 속성은 미리 보기 시 행의 정적 또는 동적 표시 여부를 결정합니다. [행 처리기](/activereportsjs/docs/v2.2/#table-designer)를 마우스 오른쪽 버튼으로 클릭하면 열리는 상황에 맞는 메뉴를 사용하여 새 행을 추가하거나 기존 행을 삭제할 수 있습니다.DOC-DETAILS-TAG-OPEN
DOC-SUMMARY-TAG-OPEN
확장하여 실행 중인 표 푸터에 행 추가 보기DOC-SUMMARY-TAG-CLOSE
DOC-DETAILS-TAG-CLOSE
```행 처리기```를 클릭하면 해당 행의 셀에 있는 보고서 항목이 모두 자동으로 선택됩니다. ```속성 패널```에는 이러한 보고서 항목을 모두 동시에 수정할 수 있는 추가 탭이 표시됩니다. 대부분의 일반적인 시나리오에서 이러한 추가 탭은 ```텍스트 상자```라고 하고 모든 행의 텍스트 상자 속성을 변경합니다.DOC-DETAILS-TAG-OPEN
DOC-SUMMARY-TAG-OPEN
확장하여 실행 중인 행 속성의 텍스트 상자 탭 사용 보기DOC-SUMMARY-TAG-CLOSE
DOC-DETAILS-TAG-CLOSE
### 표 헤더 ```표 헤더```은 표의 시작 부분에 나타납니다. 또한 ```새 페이지에서 반복``` 스위치가 켜져 있으면 표 내용이 표시된 모든 페이지에 인쇄됩니다. 헤더 행을 사용하여 표 형식 보고서의 제목 또는 로고를 표시할 수 있습니다. 예를 들어, ```표 형식 보고서 시작하기``` [데모](/activereportsjs/demos/Reports/GetStartedWithTabularReports/purejs)에는 헤더 행의 첫 번째 셀에 ```제품 목록``` [텍스트 상자](/activereportsjs/docs/v2.2/ReportAuthorGuide/Report-Items/Data-Visualizers/TextBox)가 있습니다. 표에는 헤더 행이 여러 개 있을 수 있습니다. ### 그룹 헤더 ```그룹 헤더``` 행은 [그룹 인스턴스](/activereportsjs/docs/v2.2/#table-grouping)의 시작 부분에 나타납니다. 또한 ```새 페이지에서 반복``` 스위치가 켜져 있으면 표 내용이 표시된 모든 페이지에 인쇄됩니다. 그룹 헤더 행을 사용하여 그룹의 필드 값 또는 요약 값을 표시할 수 있습니다. 예를 들어, ```표 형식 보고서 시작하기``` [데모](/activereportsjs/demos/Reports/GetStartedWithTabularReports/purejs)에서는 범주별로 제품을 그룹화하고 모든 페이지에 인쇄되는 그룹 헤더가 있으며 범주 이름을 표시하는 텍스트 상자를 포함합니다. 그룹에는 헤더 행이 여러 개 있을 수 있습니다. ### 세부 정보 ```세부 정보``` 행은 [데이터 집합 필터](/activereportsjs/docs/v2.2/ReportAuthorGuide/Databinding#data-set-filters)와 [데이터 영역 필터](/activereportsjs/docs/v2.2/ReportAuthorGuide/Report-Items/Data-Regions#common-properties)를 통해 전달된 [바인딩된 데이터 집합](/activereportsjs/docs/v2.2/ReportAuthorGuide/Report-Items/Data-Regions#data-set-name) 레코드에 대해 반복됩니다. 예를 들어, ```표 형식 보고서 시작하기``` [데모](/activereportsjs/demos/Reports/GetStartedWithTabularReports/purejs)의 세부 정보 행에는 해당하는 열에 이름, 가격 및 기타 제품 필드가 표시됩니다. 단종된 제품은 필터링되어 제외됩니다. 표에 구성된 [그룹화](/activereportsjs/docs/v2.2/#table-grouping)가 있으면 세부 정보 행이 바깥쪽 [그룹 인스턴스](/activereportsjs/docs/v2.2/#table-grouping)의 헤더 및 푸터 사이에 나타납니다. 표에는 세부 정보 행이 두 개 이상 있을 수 있습니다. 예를 들어, [이미지가 있는 표](/activereportsjs/demos/Reports/TableWithImage/purejs)의 예에는 세부 정보 행이 4개 있습니다. ### 그룹 푸터 ```그룹 푸터``` 행은 [그룹 인스턴스](/activereportsjs/docs/v2.2/#table-grouping)의 끝 부분에 나타납니다. 또한 ```새 페이지에서 반복``` 스위치가 켜져 있으면 표 내용이 표시된 모든 페이지에 인쇄됩니다. 그룹 푸터 행을 사용하여 요약 값을 표시할 수 있습니다. 예를 들어, ```표 형식 보고서 시작하기``` [데모](/activereportsjs/demos/Reports/GetStartedWithTabularReports/purejs)에서 표의 그룹 푸터 행에는 해당하는 열에 ```재고 유닛``` 및 ```주문 유닛``` 그룹화 합계가 표시됩니다. 그룹에는 푸터 행이 여러 개 있을 수 있습니다. ### 표 푸터 ```푸터``` 행은 표 끝 부분에 나타납니다. 또한 ```새 페이지에서 반복``` 스위치가 켜져 있으면 표 내용이 표시된 모든 페이지에 인쇄됩니다. 푸터 행을 사용하여 총합계를 표시할 수 있습니다. 예를 들어, ```고정 레이아웃 보고서 시작하기``` [데모](/activereportsjs/demos/Reports/GetStartedWithFixedReports/purejs)의 표에는 송장 합계를 표시하는 푸터 행이 세 개 있습니다. ### 표 셀 ```표 셀```은 행과 열이 교차하는 지점입니다. 기본적으로 각 표 셀에는 [텍스트 상자](/activereportsjs/docs/v2.2/ReportAuthorGuide/Report-Items/Data-Visualizers/TextBox) 보고서 항목이 포함되어 있습니다. 그러나 해당 항목을 ```도구 상자```에서 셀로 끌어 놓아 [이미지](/activereportsjs/docs/v2.2/ReportAuthorGuide/Report-Items/Data-Visualizers/Image)와 같은 다른 데이터 시각화 도우미와 바꿀 수 있습니다.DOC-DETAILS-TAG-OPEN
DOC-SUMMARY-TAG-OPEN
확장하여 실행 중인 표 셀에 이미지 추가 보기DOC-SUMMARY-TAG-CLOSE
DOC-DETAILS-TAG-CLOSE
또한 표 셀에는 [중첩된 데이터 영역](/activereportsjs/docs/v2.2/ReportAuthorGuide/Report-Items/Data-Regions#nested-data-regions)이 있을 수 있습니다. 예를 들어, ```표 내의 목록``` [데모](/activereportsjs/demos/Reports/NestedDataRegionsDemo/purejs)에는 세 번째 ```세부 정보``` 행에 [목록](/activereportsjs/docs/v2.2/ReportAuthorGuide/Report-Items/Data-Regions/List) 보고서 항목이 포함되어 있습니다. ### 병합된 셀 ```병합된 셀```은 여러 열 또는 행에 걸쳐 있습니다. 인접한 셀을 가로 또는 세로로 병합할 수 있습니다. 가로로 병합하려면 셀이 같은 행에 있어야 하고 세로로 병합하려면 셀이 같은 열에 있어야 합니다. 예를 들어, [이미지가 있는 표](/activereportsjs/demos/Reports/TableWithImage/purejs) 데모의 표에는 첫 번째 열에 세로로 병합된 세부 정보 셀이 있습니다. 셀을 병합하려면 Windows에서는 ```Ctrl``` 키를, Mac OS에서는 ```Cmd```를 길게 누른 상태에서 선택 항목을 마우스 오른쪽 버튼으로 클릭한 다음 상황에 맞는 메뉴에서 ```셀 > 셀 병합``` 항목을 선택합니다.DOC-DETAILS-TAG-OPEN
DOC-SUMMARY-TAG-OPEN
확장하여 실행 중인 셀 병합 보기DOC-SUMMARY-TAG-CLOSE
DOC-DETAILS-TAG-CLOSE
### 표 그룹화 ```표```를 사용하면 하나 이상의 기준별로 ```세부 정보``` 행을 그룹화할 수 있습니다. 예를 들어, ```표 형식 보고서 시작하기``` [데모](/activereportsjs/demos/Reports/GetStartedWithTabularReports/purejs)에서는 제품 행을 범주별로 그룹화합니다. 그룹화를 구성하려면 [표 디자이너](/activereportsjs/docs/v2.2/#table-designer)의 ```그룹 편집기```를 사용하는 것이 좋습니다. ### 그룹 추가 다음 두 가지 방법 중 하나를 사용하여 표 그룹을 추가할 수 있습니다. * 표의 경계 상자 내에서 아무 곳이나 마우스 오른쪽 버튼으로 클릭하면 상황에 맞는 메뉴에서 ```그룹 -> 그룹 삽입``` 항목을 선택합니다. * 그룹화하려는 필드를 [데이터 패널](/activereportsjs/docs/v2.2/ReportAuthorGuide/Report-Designer-Interface#data-panel)에서 ```그룹 편집기```로 끌어 놓습니다.DOC-DETAILS-TAG-OPEN
DOC-SUMMARY-TAG-OPEN
확장하여 실행 중인 끌어 놓아 그룹화 추가 보기DOC-SUMMARY-TAG-CLOSE
DOC-DETAILS-TAG-CLOSE
### 자식 또는 부모 그룹 삽입 중첩된 그룹을 여러 개 사용하여 표에서 행을 정렬할 수 있습니다. 자식 그룹을 삽입하려면 ```그룹 편집기```에서 그룹 이름을 마우스 오른쪽 버튼으로 클릭한 다음 상황에 맞는 메뉴에서 ```그룹 -> 그룹 삽입``` 항목을 선택합니다. 또는 필드를 데이터 패널에서 그룹 편집기로 끌어 놓을 수 있으며, 이 경우 새로 추가된 그룹의 위치는 ```<새 그룹>``` 자리 표시자를 사용하여 기존 그룹에 대해 표시됩니다. 또한 상황에 맞는 메뉴에서 해당 항목을 사용하여 그룹을 추가하거나 [헤더](/activereportsjs/docs/v2.2/#group-header) 또는 [푸터](/activereportsjs/docs/v2.2/#group-footer)을 제거하거나 추가할 수 있습니다.  ### 그룹 구성 ```그룹 편집기```에는 그룹 이름이 열거되고, 이 이름을 클릭하면 그룹의 구성이 [속성 패널](/activereportsjs/docs/v2.2/ReportAuthorGuide/Report-Designer-Interface#properties-panel)로 로드됩니다. * ```그룹 이름```은 그룹 편집기에 표시되는 그룹 ```ID```입니다. * ```그룹 식```은 [바운딩된 필드 참조](/activereportsjs/docs/v2.2/ReportAuthorGuide/Expressions/references#data-set-fields)의 [컬렉션](/activereportsjs/docs/v2.2/ReportAuthorGuide/Report-Items/Common-Properties#collection) 또는 고급 식입니다. 그룹 식의 고유 값은 선택적 ```그룹 헤더``` 및 ```그룹 푸터```과 ```세부 정보``` 행으로 구성된 ```그룹 인스턴스```를 생성합니다. 예를 들어, ```표 형식 보고서 시작하기``` [데모](/activereportsjs/demos/Reports/GetStartedWithTabularReports/purejs)에는 ```{categoryId}``` 그룹 식이 있습니다. 따라서 표에서는 제품 범주당 하나씩 7개 그룹 인스턴스가 생성됩니다. * ```레이블``` [식](/activereportsjs/docs/v2.2/ReportAuthorGuide/Report-Items/Common-Properties#expression)은 [보고서 맵](/activereportsjs/docs/v2.2/ReportAuthorGuide/Interactivity#report-map)의 그룹 인스턴스 링크의 텍스트를 결정합니다. * 그룹의 [필터 편집기](/activereportsjs/docs/v2.2/ReportAuthorGuide/Report-Designer-Interface#filters-editor)에서는 특정 그룹 인스턴스를 필터링할 수 있습니다. ### 그룹 레이아웃 구성 * 때때로 ```그룹 푸터``` 행이 페이지 맨 위에 단독으로 나타날 수 있습니다. ```분리된 푸터 방지``` 플래그를 켜서 그룹 인스턴스의 마지막 ```세부 정보``` 행을 다음 페이지로 이동하여 "고립된" 그룹 푸터와 함께 나타나도록 할 수 있습니다. * ```함께 유지``` 플래그는 그룹 인스턴스가 맞는 경우 항상 단일 페이지에 나타나도록 합니다. * ```페이지 나누기``` 속성은 그룹 인스턴스로 생성되는 페이지 나누기의 위치를 결정합니다. * ```None``` \- 페이지 나누기가 생성되지 않습니다. * ```Start``` \- 각 그룹 인스턴스가 ```그룹 헤더``` 또는 첫 번째 ```세부 정보``` 행 앞에 페이지 나누기를 삽입합니다. * ```End``` \- 각 그룹 인스턴스가 ```그룹 푸터``` 또는 마지막 ```세부 정보``` 행 뒤에 페이지 나누기를 삽입합니다. * ```StartAndEnd``` - ```Start``` 및 ```End``` 옵션의 조합입니다. * ```Between``` \- 각 그룹 인스턴스가 새 페이지에서 시작합니다. ```표 형식 보고서 시작하기``` [데모](/activereportsjs/demos/Reports/GetStartedWithTabularReports/purejs)에서는 이 옵션을 사용합니다. * [표시 여부](/activereportsjs/docs/v2.2/ReportAuthorGuide/Report-Items/Common-Properties#visibility) 속성은 그룹 인스턴스의 정적 또는 동적 표시 여부를 결정합니다. ```드릴다운 보고서 시작하기``` [데모](/activereportsjs/demos/Reports/GetStartedWithDrillDownReports/purejs)는 드릴다운 상호작용을 구현하기 위해 ```제품``` 그룹의 동적 표시 여부를 설정합니다. * ```새 섹션``` 플래그는 각 그룹 인스턴스에 페이지 번호 매기기 적용 여부를 결정합니다. 자세한 내용은 [전역 참조](/activereportsjs/docs/v2.2/ReportAuthorGuide/Expressions/references#page-numbering) 문서를 확인하십시오. ### 세부 정보 그룹화 또는 그룹을 추가하지 않고 ```세부 정보``` 행을 그룹화할 수 있습니다. ```<세부 정보 그룹>```에는 헤더 및 푸터가 없지만 ```세부 정보``` 행의 수를 고유한 그룹화 값당 행 하나로 줄입니다. 그룹 편집기에서 해당하는 항목을 클릭하여 세부 정보 그룹 속성을 편집할 수 있습니다. 위에서 설명한 거의 모든 속성을 사용할 수 있습니다. ### 세부 정보 행 정렬 [데이터 영역 정렬 구성](/activereportsjs/docs/v2.2/ReportAuthorGuide/Report-Items/Data-Regions#common-properties)을 사용하여 표의 세부 정보 행 모양의 순서를 설정할 수 있습니다. 또한 보고서 구독자가 ```정렬 아이콘```을 호스트할 텍스트 상자의 [사용자 정렬](/activereportsjs/docs/v2.2/ReportAuthorGuide/Report-Items/Data-Visualizers/TextBox#user-sort) 구성을 설정하여 미리 보기 시 세부 정보 행을 정렬하도록 할 수 있습니다. 예를 들어, ```표 형식 보고서 시작하기``` [데모](/activereportsjs/demos/Reports/GetStartedWithTabularReports/purejs)의 ```제품 이름``` 텍스트 상자에는 속성 패널의 ```사용자 정렬``` 섹션에 ```정렬 식={productName}```이 있습니다. 따라서 미리 보기 시 ```정렬 아이콘```이 텍스트 오른쪽에 나타나 보고서 구독자가 이름별로 제품을 정렬할 수 있습니다.DOC-DETAILS-TAG-OPEN
DOC-SUMMARY-TAG-OPEN
미리 보기 시 실제로 정렬하는 방법을 보려면 확장하십시오DOC-SUMMARY-TAG-CLOSE
DOC-DETAILS-TAG-CLOSE
```제품 이름``` 텍스트 상자가 [그룹 헤더](/activereportsjs/docs/v2.2/#group-header)에 있기 때문에 각 범주 내 제품은 독립적으로 정렬할 수 있습니다. 표 내 모든 세부 정보 행에 적용하려면 ```사용자 정렬``` 구성의 ```정렬 대상``` 속성을 ```Table1```로 설정해야 합니다. ### 그룹 인스턴스 정렬 표 그룹의 ```정렬 식``` 속성은 그룹 인스턴스를 정렬하도록 허용하는 항목의 [컬렉션](/activereportsjs/docs/v2.2/ReportAuthorGuide/Report-Items/Common-Properties#collection)입니다. 각 항목은 [식](/activereportsjs/docs/v2.2/ReportAuthorGuide/Report-Items/Common-Properties#expression)과 정렬 방향으로 구성됩니다. 예를 들어, ```대화형 정렬``` [데모](/activereportsjs/demos/Reports/InteractiveSorting/purejs)의 그룹에는 ```{country}``` 정렬 식과 오름차순이 있습니다. 따라서 미리 보기 시 국가가 알파벳순으로 표시됩니다. 또한 보고서 구독자가 ```정렬 아이콘```을 호스트할 텍스트 상자의 [사용자 정렬](/activereportsjs/docs/v2.2/ReportAuthorGuide/Report-Items/Data-Visualizers/TextBox#user-sort) 구성을 설정하여 미리 보기 시 그룹화 인스턴스를 정렬하도록 할 수 있습니다. 이렇게 하기 위해 ```대화형 정렬``` 데모에서 그룹 헤더의 ```국가 헤더``` 텍스트 상자에는 ```정렬 식={country}, 정렬 식 범위=CountryGroup, 정렬 대상=CustomersTable``` 구성이 있습니다.