매쉬업 작성기 > 위젯 > 레거시 위젯 > 그리드 위젯(레거시)
그리드 위젯(레거시)
그리드 위젯을 사용하면 데이터 집합을 그리드 보기로 표시할 수 있습니다. 그리드는 열별로 색을 컨텍스트화하고 셀에서 이미지를 렌더링하는 등 여러 가지 방식으로 데이터를 렌더링합니다. Configure Grid Columns 선택을 사용하여 그리드 위젯의 구성 대화 상자를 통한 상태 서식 적용, 열 머리글, 볼 열, 열 순서를 포함한 기존 렌더링을 구성할 수 있습니다.
그리드에서는 열 머리글을 클릭하여 데이터를 정렬할 수 있을 뿐만 아니라 런타임 환경에서 열 크기를 조정할 수도 있습니다.
편집 가능 그리드
그리드에는 그리드의 행/열 편집을 허용하는 Configure Grid Columns 옵션 내 및 위젯에 대한 특수 설정도 있습니다. 이를 통해 그리드에서 값을 편집한 다음 전체 콘텐츠를 서비스로 다시 전달할 수 있습니다. 또는 그리드에서 Selected Row를 표시 중인 경우 해당 행이 다시 전달될 수 있습니다. 테이블의 크기에 따라 메모리 사용량에 영향을 줄 수 있기 때문에 모범 사례는 Selected Row를 사용하는 것입니다.
* 
스타일 및 공통 위젯 속성은 아래 표에 포함되어 있지 않습니다.
속성 이름
설명
기본 유형
기본값
바인딩 가능 여부 (Y/N)
로컬리제이션 가능 여부 (Y/N)
CustomClass
위젯의 최상위 div에 적용할 사용자 정의 CSS 클래스입니다. 여러 클래스를 공백으로 구분하여 입력할 수 있습니다.
STRING
해당 없음
Y
N
RowFormat
행을 기준으로 동적(상태) 서식 적용을 적용할 옵션 규칙은 셀 상태 서식 적용에 의해 재정의될 수 있습니다.
STATE FORMATTING
상태 서식 적용
N
N
MultiSelect
항목을 여러 개 선택하도록 허용합니다.
BOOLEAN
False
N
N
IsEditable
그리드에 있는 값 편집을 허용할지 여부입니다.
BOOLEAN
False
N
N
AutoSelectFirstRow
데이터를 처음 로드할 때 자동으로 첫 번째 행을 선택합니다.
BOOLEAN
False
N
N
CellTextWrapping
셀에서 값을 괄호로 묶습니다.
BOOLEAN
False
N
N
Data
이 속성에 대한 데이터 소스인 인포테이블입니다.
INFOTABLE
해당 없음
Y
N
CurrentScrollTop
현재 스크롤 톱입니다.
NUMBER
0
Y
N
ScrollTop
지정할 스크롤 톱입니다.
NUMBER
0
Y
N
EditedTable
그리드를 사용하여 편집되는 테이블입니다.
INFOTABLE
해당 없음
Y
N
RowHeight
행의 높이입니다.
NUMBER
30
N
N
ShowAllColumns
사용 가능한 열을 모두 표시합니다. 인포테이블에 데이터 셰이프가 없는 경우 ShowAllColumns를 사용해야 합니다.
* 
이 속성을 사용할 수 있으면 셀 편집 및 스타일 지정과 같은 렌더링 기능을 사용할 수 없습니다.
BOOLEAN
False
N
N
ShowDataLoading
데이터를 로드하는 동안 표시합니다.
BOOLEAN
True
N
N
DoubleClicked
이벤트입니다. 데이터 객체를 한 번 클릭하여 선택할 수 있지만 탐색 링크 트리거를 위해 두 번 클릭 연결과 같이 다른 이벤트에 두 번 클릭을 사용할 수도 있습니다.
해당 없음
해당 없음
Y
N
Visible
위젯이 런타임에 표시됩니까?
BOOLEAN
True
Y
N
그리드 구성
데이터 서비스를 그리드에 연결한 후 Grid Column Configuration 대화 상자를 엽니다. 열 숨기기 확인란(true = 표시, false = 숨기기)을 사용하여 표시해야 할 열을 선택할 수 있습니다. 표시된 열을 목록에서 위로 또는 아래로 끌어 순서를 다시 매깁니다.
열 제목은 데이터 서비스의 데이터 셰이프에 의해 자동으로 지정되지만 구성 대화 상자 내 열별 기준에 따라 재정의될 수 있습니다. 각 열에 대해 다음 작업도 수행할 수 있습니다.
셀에 대한 렌더러 선택(표시될 데이터의 특정 데이터 유형 처리에 사용됨 - 권장)
자동 너비 또는 고정 너비 선택
텍스트 정렬 선택
스타일 지정(고정 또는 상태 서식 적용) 선택
편집 가능한 열 지정(유효성 검사 포함 또는 미포함)
고정(비동적) 스타일을 적용하려면 고정 스타일 정의를 선택하고 이전에 정의한 스타일 정의를 선택합니다. 동적 서식 적용(행에서 데이터를 반환할 때 기반으로 하는 색상 컨텍스트 등)을 수행하려면 상태 기반 서식 적용을 선택합니다.
상태 기반 서식 적용을 사용하여 데이터의 각 열을 개별적으로 구성하면 행 데이터 기반으로 열에 해당 스타일을 적용할 수 있습니다. 상태 포맷터를 정의할 각 열에 대해 다음을 수행해야 합니다.
서식 적용이 종속될 열 선택(반환 데이터 서비스의 숨겨지거나 숨겨지지 않은 모든 열일 수 있음)
사용할 상태 정의 선택(열당 하나이며 종속 필드의 데이터 유형과 일치해야 함)
상태 정의에 대한 기본값 적용 또는 해당 값을 이 그리드 정의 및 렌더링용으로 특별히 재정의
그리드가 편집 가능으로 설정되면 특정 열을 편집 가능으로 지정할 수도 있습니다. 또한 JavaScript 비교를 사용하여 열 이름을 기반으로 유효성 검사를 추가할 수 있습니다.
예:
Validation - Column1 > 5 && Column3 < 10
Message - You must have Col 1 > 5 and Col 3 < 10
도움이 되셨나요?