|
그리드(고급) 위젯에 대한 기존 데이터 서비스의 출력을 JSON으로 업데이트해야 합니다.
|
|
그리드 위젯을 ThingWorx Web Component SDK에서 웹 구성 요소로 사용할 수도 있습니다.
|
키 | 그리드 | 트리 그리드 |
---|---|---|
TAB | 포커스 상자를 변경하여 머리글의 필터, 선택 확인란, 정렬 버튼과 같은 기본 그리드 요소를 강조 표시합니다. | 포커스 상자를 변경하여 머리글의 필터, 선택 확인란, 정렬 버튼과 같은 기본 그리드 요소를 강조 표시합니다. Focus를 사용하여 포커스를 구성할 수 있습니다. |
화살표 키 | 위쪽, 아래쪽, 왼쪽, 오른쪽 화살표 키를 사용하여 포커스를 수직 또는 수평으로 변경합니다. | 오른쪽 - 포커스가 있는 행을 확장합니다. 왼쪽 - 포커스가 있는 행을 축소합니다. 위쪽/아래쪽 - 다음 및 이전에 포커스가 있는 행 또는 셀로 이동합니다. |
HOME END | 현재 행의 첫 번째 또는 마지막 셀에 포커스를 둡니다. | 첫 번째 또는 마지막 셀 또는 행에 포커스를 둡니다. |
PAGE UP PAGE DOWN | 현재 열 또는 행의 첫 번째 또는 마지막으로 표시된 셀에 포커스를 둡니다. | 현재 그리드 보기의 첫 번째 또는 마지막으로 표시된 셀 또는 행에 포커스를 둡니다. |
스페이스바 ENTER | 행 선택이 활성화되면 RowClicked 이벤트를 트리거하거나 현재 행을 선택합니다. | 상위 행을 확장하거나 축소합니다. |
별표(*)로 표시된 속성은 동적 그리드 구성에서 지원됩니다. 동적 구성에 대한 자세한 내용은 JSON 데이터를 사용하여 그리드 구성을 참조하십시오. |
속성 | 설명 | 기본 유형 | 기본값 | 바인딩 | 로컬리제이션 가능 여부 | ||
---|---|---|---|---|---|---|---|
CacheRuntimeChanges | 브라우저 캐시 내에 그리드 정렬 옵션을 저장합니다. 이 옵션은 사용자가 다른 페이지나 매쉬업으로 이동할 때 지속됩니다. 여러 그리드가 매쉬업에 표시되면 각 그리드에 대한 변경 사항이 위젯 ID를 사용하여 캐시됩니다. | BOOLEAN | True | 해당 없음 | N | ||
ClearFilteredSelection | 그리드 데이터를 필터링하거나 정렬할 때 행 선택을 유지할지 여부를 제어합니다. 선택한 행이 그리드 보기 외부에 있으면 이 속성을 사용하여 선택을 지웁니다.
| BOOLEAN | 해당 없음 | 해당 없음 | N | ||
Data | 런타임에 그리드를 볼 때 표시할 인포테이블 데이터 소스입니다. | INFOTABLE | 해당 없음 | 내부 | N | ||
ChildData | 트리 노드가 확장될 때 동적으로 로드되는 하위 노드에 대한 데이터 소스를 정의하는 인포테이블입니다. 트리 그리드에만 해당됩니다. | Infotable | 해당 없음 | Y | N | ||
ChildDataServiceEvent | 트리 그리드에서 노드를 확장할 때 ChildData 속성에 바인딩된 서비스에 대해 ServiceInvokeCompleted 이벤트를 트리거합니다. | BOOLEAN | False | N | N | ||
ParentIDFieldName* | 각 하위의 상위 ID를 포함하는 트리 그리드 데이터의 인포테이블 열을 지정합니다. 이 ID는 계층적 트리 구조를 만드는 데 사용됩니다. 트리 그리드에만 해당됩니다. | STRING | parentId | Y | N | ||
HasChildrenFieldName* | 행에 사용 가능한 하위 데이터가 있는지 여부를 나타내는 데 사용되는 인포테이블 열의 이름을 지정합니다. 행에 하위 데이터가 없음을 나타내려면 ‘0’, 0, ‘false’, false, 빈 문자열, undefined 중 하나를 입력합니다. 이외의 값은 행에 하위 데이터가 있음을 의미합니다. 트리 그리드에만 해당됩니다. | STRING | hasChildren | N | N | ||
IncludeRowExpansionParents* | 하위 행을 선택하거나 확장할 때 미리 로드된 클라이언트 측 데이터에 포함되지 않은 상위 행을 포함할지 여부를 결정합니다. True이면 상위 행이 하위 행과 함께 검색되고 계층 구조가 유지됩니다. 트리 그리드에만 해당됩니다. | BOOLEAN | False | N | Y | ||
ExpandableRows | 확장 가능한 트리 노드의 ID가 포함된 인포테이블입니다. 그리드 행을 확장할 수 있도록 하려면 행 ID 열만 필요합니다. AlwaysExpanded를 선택하면 이 데이터가 무시되고 모든 행이 확장됩니다. 트리 그리드에만 해당됩니다. | Infotable | 해당 없음 | Y | N | ||
AlwaysExpanded* | 그리드의 모든 트리 노드를 확장합니다. PreserveRowExpansion 속성을 사용하려면 이 속성을 False로 설정하십시오. 트리 그리드에만 해당됩니다. | BOOLEAN | False | N | N | ||
ExpandCollapseAll* | 그리드의 모든 트리 노드를 확장 및 축소할 수 있는 컨트롤을 추가합니다. 트리 그리드에만 해당됩니다.
| BOOLEAN | False | N | N | ||
PreserveRowExpansion* | 그리드를 새로 고칠 때 확장된 행을 유지합니다. AlwaysExpanded가 true이면 미리 로드된 모든 행이 확장됩니다. 그리드 보기를 변경하거나 페이지 간 탐색할 때 확장된 행을 유지하려면 CacheRuntimeChanges 속성을 설정해야 합니다. 트리 그리드에만 해당됩니다. | BOOLEAN | False | N | N | ||
ExpandCollapseIcon* | ChildData 속성에 바인딩된 데이터가 없을 때 그리드의 트리 노드를 확장 및 축소하는 데 사용되는 아이콘 유형을 제어합니다. 트리 그리드에만 해당됩니다. 지원되는 옵션: 캐럿, 화살표, 더하기/빼기 | STRING | 캐럿 | N | N | ||
ExpandLoadedRows | 그리드가 시작될 때 미리 로드된 데이터를 모두 자동으로 확장합니다. PreserveRowExpansion 속성을 사용하려면 이 속성을 해제해야 합니다. 트리 그리드에만 해당됩니다. | BOOLEAN | False | Y | N | ||
SelectFocusedItem* | true이면 포커스 상자를 사용하여 항목을 선택합니다. false이면 포커스 상태와 선택 상태가 별도로 설정됩니다. 트리 그리드에만 해당됩니다. | BOOLEAN | False | N | N | ||
SelectParentOnly | 상위 노드가 선택될 때 하위 노드의 자동 선택을 비활성화합니다. 트리 그리드에만 해당됩니다. | BOOLEAN | N | N | |||
FocusNavigationMode* | 포커스가 변경될 때 처음에 포커스 맞출 요소를 제어합니다. 행 먼저, 셀 먼저 또는 셀만 탐색할 수 있습니다. 트리 그리드에만 해당됩니다. | STRING | 행 먼저 | N | N | ||
PrimaryColumnFixedSize* | 기본 열에 대한 크기 조정을 비활성화하고 고정 크기로 설정합니다. 트리 그리드에만 해당됩니다. ResizeColumns가 true일 때 이 속성은 무시됩니다. | BOOLEAN | False | N | N | ||
IDPathSeparator* | ID 경로를 구분하는 데 사용되는 문자를 지정할 수 있습니다. 경로 구분 기호 문자는 그리드에 의해 동적으로 로드되지만 클라이언트측에서는 로드되지 않은 행을 선택할 때 트리 그리드에서 사용됩니다. 트리 그리드에만 해당됩니다. | STRING | :; | N | N | ||
AllowDisabledNodes | 트리 그리드에서 노드를 비활성화할 수 있습니다. | BOOLEAN | False | N | N | ||
DisableChildNodes | 비활성화된 상위 노드의 하위 행을 비활성화합니다. | BOOLEAN | False | N | N | ||
DisabledStateField | 트리 그리드의 각 행에 대해 비활성화 상태를 설정하는 데 사용되는 인포테이블 열을 지정합니다. | INFOTABLE | 해당 없음 | N | N | ||
LegacyConfiguration | 위젯 속성 대신 구성 문자열을 사용하여 그리드를 동적으로 구성할 수 있는 바인딩 가능한 속성입니다. 이 속성은 그리드(고급) 위젯에서의 마이그레이션을 지원하는 데 사용됩니다. 새 구성을 추가하려면 대신 JSON 구성 속성을 사용하십시오. | STRING | 해당 없음 | Y | N | ||
ResetButtonClicked | 재설정 버튼을 클릭할 때 트리거되는 바인딩 가능한 이벤트입니다. | 이벤트 | 해당 없음 | Y | N | ||
ColumnsMenuOptions* | 런타임에 열 구성 메뉴 내 표시할 옵션을 제어합니다. 메뉴를 숨기려면 없음을 선택합니다. • 없음 - 메뉴 버튼을 숨깁니다. • 표시 유형 - 각 열 이름 옆에 확인란을 표시합니다. 이를 사용하여 열 표시 유형을 제어할 수 있습니다. • 순서 - 각 열 이름 옆에 끌기 아이콘을 표시합니다. 이를 사용하여 열 순서를 다시 매길 수 있습니다. • 표시 유형 및 순서 - 위의 두 옵션을 모두 표시합니다. | STRING | 없음 | 아니요 | N | ||
ColumnsMenuVisibleItems* | 런타임에 열 구성 메뉴를 열 때 처음에 표시할 항목 수를 설정합니다. 이 속성을 사용하여 메뉴 높이를 제한합니다. 벗어나는 추가 열이 있으면 스크롤 막대가 표시됩니다. | NUMBER | 6 | 아니요 | N | ||
DefaultSelectedRows* | 그리드가 로드될 때 미리 선택할 행 번호를 지정합니다. 1~10 같은 숫자 범위 또는 2, 4, 5와 같은 쉼표로 구분된 목록을 입력할 수 있습니다. | STRING | 해당 없음 | 내부 | N | ||
IsEditable* | 런타임에 사용자가 그리드 데이터를 편집할 수 있습니다. 기본적으로 편집 모드가 전체 그리드에 영향을 줄 때 그리드 데이터가 자동으로 저장됩니다. | BOOLEAN | False | 내부/외부 | N | ||
EditLevel* | 런타임에 사용자가 그리드 데이터를 편집할 수 있는 방식을 제어합니다. 동시에 데이터를 편집하고 모든 변경 내용을 저장하려면 전체 그리드, 한 번에 행 하나에 대한 데이터를 편집하고 변경 내용을 저장하려면 단일 행, 한 번에 셀 하나에 대한 데이터를 편집하고 변경 내용을 저장하려면 단일 셀을 선택합니다. | STRING | 단일 셀 | 아니요 | N | ||
EditButton* | 사용자가 편집을 켜거나 끌 수 있는 편집 컨트롤을 그리드 도구 모음에 표시합니다. | BOOLEAN | False | 아니요 | N | ||
RowAddButton* | 그리드 도구 모음에 추가 버튼을 표시합니다. 사용자가 양식을 사용하여 그리드에 새 행을 추가할 수 있습니다. | BOOLEAN | False | 아니요 | N | ||
RowDeleteButton* | 사용자가 선택한 행을 삭제할 수 있는 버튼을 그리드 도구 모음에 표시합니다. | BOOLEAN | False | 아니요 | N | ||
ConfirmDelete | 행 삭제 버튼을 확인 함수에 바인딩할 수 있는 바인딩 가능한 서비스입니다. | 서비스 | 해당 없음 | 내부 | N | ||
DeleteRowClicked | 그리드 도구 모음의 행 삭제 버튼을 클릭할 때 트리거되는 이벤트입니다. | 이벤트 | 해당 없음 | 외부 | N | ||
RowEditFormTitle* | 행 편집 양식에 표시할 제목을 지정합니다. 제목을 숨기고 양식의 영역을 사용하려면 이 속성을 비워 둡니다. | STRING | 해당 없음 | 내부 | Y | ||
EditControlVisibility* | 그리드에 편집 컨트롤을 표시할 시기를 지정합니다. 지원되는 옵션은 마우스로 가리킬 때 또는 포커스가 있을 때, 항상, 없음입니다. | STRING | 마우스로 가리킬 때 또는 포커스가 있을 때 | 내부 | N | ||
EditControlType* | 그리드 편집에 사용할 컨트롤 요소를 설정합니다. 사용 가능한 옵션은 아이콘 또는 링크입니다. 아이콘을 선택하거나 EditControlIcon 및 EditControlLabel 속성을 사용하여 링크 텍스트를 설정할 수 있습니다. | STRING | 링크 | 아니요 | N | ||
EditControlLabel* | EditControlType이 링크로 설정되면 편집 컨트롤의 레이블을 설정합니다. | STRING | 편집 | 내부 | Y | ||
EditControlIcon* | EditControlType이 아이콘으로 설정되면 편집 컨트롤에 표시할 아이콘입니다. | IMAGE | 해당 없음 | 아니요 | N | ||
EditCellStarted | 사용자가 그리드에서 셀 편집을 시작할 때 트리거되는 이벤트입니다. | 이벤트 | 해당 없음 | 외부 | N | ||
EditCellCompleted | 사용자가 그리드에서 셀 편집을 마칠 때 트리거되는 이벤트입니다. | 이벤트 | 해당 없음 | 외부 | N | ||
EditRowStarted | 사용자가 그리드에서 행 편집을 시작할 때 트리거되는 이벤트입니다. | 이벤트 | 해당 없음 | 외부 | N | ||
EditRowCompleted | 사용자가 그리드의 행 편집을 마칠 때 트리거되는 이벤트입니다. | 이벤트 | 해당 없음 | 외부 | N | ||
EditCanceled | 사용자가 취소 버튼을 클릭할 때 트리거되는 이벤트입니다. | 이벤트 | 해당 없음 | 외부 | N | ||
Cancel | 그리드에 대한 현재 편집 내용을 저장하지 않고 취소하는 바인딩 가능한 데이터 서비스입니다. | 서비스 | 해당 없음 | 내부 | N | ||
EditStarted | 편집 버튼을 클릭할 때 트리거되는 이벤트입니다. | 이벤트 | 해당 없음 | 외부 | N | ||
EditCompleted | 편집을 수행한 후 저장 버튼을 클릭할 때 트리거되는 이벤트입니다. | 이벤트 | 해당 없음 | 외부 | N | ||
EditedData | 그리드에서 편집된 항목을 포함하는 인포테이블입니다. | INFOTABLE | 해당 없음 | 외부 | N | ||
DeletedData | 그리드에서 삭제된 항목을 포함하는 인포테이블입니다. 서버에서 데이터를 삭제하려면 인포테이블을 사용자 정의 데이터 서비스에 바인딩합니다. | INFOTABLE | 해당 없음 | 외부 | N | ||
HighlightDraftState | 셀 수준에서 편집하면 다른 색을 사용하여 저장하지 않은 변경 사항이 있는 셀을 강조 표시합니다. | BOOLEAN | False | 아니요 | N | ||
HighlightNewRows | 런타임에 그리드에 추가된 새 행을 강조 표시합니다. | BOOLEAN | False | N | N | ||
ShowFilter | 그리드에 필터 상자를 표시합니다. | BOOLEAN | False | Y | N | ||
Filter | 그리드를 정렬하거나 필터링할 때 트리거되는 이벤트입니다. | 이벤트 | 해당 없음 | 해당 없음 | N | ||
FilterLabel* | 필터 상자의 레이블을 설정합니다. | STRING | 해당 없음 | 내부 | Y | ||
FilterString* | 단순 필터 상자의 필터 문자열입니다. | STRING | 해당 없음 | 내부/외부 | N | ||
HideHeaderRow* | 머리글 행을 숨깁니다. | BOOLEAN | False | 내부 | N | ||
IDFieldName* | 그리드의 각 행에 대한 기본 키 또는 ID를 포함하는 인포테이블 열을 선택합니다. | STRING | id | 해당 없음 | N | ||
Label* | 그리드 레이블의 텍스트를 지정합니다. | STRING | 그리드 제목 | 내부 | Y | ||
LabelType* | 그리드 레이블 유형을 설정합니다. | STRING | 하위 머리글 | 해당 없음 | N | ||
LastClickedRow | 그리드에서 마지막으로 클릭한 행의 데이터를 포함하는 인포테이블입니다. | INFOTABLE | 해당 없음 | 해당 없음 | N | ||
LinkClicked | 그리드 셀 내의 하이퍼링크를 클릭할 때 트리거되는 이벤트입니다. | 이벤트 | 해당 없음 | Y | N | ||
ClickedLinkData | 하이퍼링크의 행 데이터가 포함된 인포테이블입니다. | Infotable | 해당 없음 | Y | N | ||
ClickedLinkColumn | 마지막으로 클릭한 하이퍼링크의 열 이름을 반환합니다. 그리드에 하이퍼링크가 있는 열이 둘 이상 포함된 경우 이 속성을 사용할 수 있습니다. | STRING | 해당 없음 | Y | N | ||
MaxHeaderHeight | 그리드 머리글의 최대 높이(픽셀)입니다. | NUMBER | 자동 | 내부 | N | ||
MaxRowHeight | 그리드에 있는 행의 최대 높이(픽셀)를 지정합니다. 기본적으로 높이 값은 각 행의 콘텐츠를 기준으로 설정됩니다. | NUMBER | 자동 | 내부 | N | ||
MinRowHeight | 그리드에 있는 행의 최소 높이(픽셀)를 지정합니다. | NUMBER | 48 | 내부 | N | ||
QueryFilter | 그리드 데이터에 적용할 필터 질의를 포함하는 바인딩 가능한 속성입니다. 속성을 데이터 필터 위젯 및 데이터 서비스에 바인딩하여 그리드의 데이터를 필터링할 수 있습니다. | QUERY | 해당 없음 | 내부/외부 | N | ||
Reset | 런타임에 그리드 위젯을 해당 초기 구성으로 재설정할 수 있는 바인딩 가능한 서비스입니다. | 서비스 | 해당 없음 | 해당 없음 | N | ||
RowClicked | 그리드의 행을 클릭할 때 트리거되는 이벤트입니다. | 이벤트 | 해당 없음 | 해당 없음 | N | ||
RowFormat | 그리드 행에 적용 가능한 상태 정의를 선택할 수 있는 대화 상자를 엽니다. 위젯 구성 대화 상자의 열에 상태 서식을 적용하여 셀에 대한 이 상태 서식 적용을 무시할 수 있습니다. | 상태 정의 | 해당 없음 | 해당 없음 | N | ||
RowSelection* | 그리드에서 사용자가 동시에 선택할 수 있는 데이터 행 수를 제어합니다. 사용 가능한 옵션은 다음과 같습니다. 없음(기본값), 단일 및 여러입니다. | STRING | 없음 | 내부 | N | ||
RowSelected | 그리드에서 행을 하나 이상 선택하면 True를 반환합니다. 예를 들어, 하나 이상의 행을 선택한 경우 이 속성을 사용하여 도구 모음에 사용자 정의 작업을 표시할 수 있습니다. | BOOLEAN | False | Y | N | ||
SelectedRows | 그리드에서 선택한 데이터 행을 설정하거나 검색할 수 있는 인포테이블 속성입니다. 페이지가 매겨진 그리드의 페이지 간에 이동할 때 이 속성은 선택한 행 데이터를 유지하지 않습니다. 선택한 행을 모든 페이지에서 전달하려면 SelectedRowsIDs 속성을 대신 사용합니다. | INFOTABLE | 해당 없음 | 내부/외부 | N | ||
SelectedRowsChanged | 선택한 행이 변경될 때 트리거되는 이벤트입니다. | 이벤트 | 해당 없음 | 해당 없음 | N | ||
SelectedRowsChangedCallback* | 선택한 행이 수동으로 변경되거나 데이터 서비스를 사용하여 변경될 때 SelectedRowsChanged 이벤트를 트리거합니다. False로 설정하면 행 선택을 수동으로 변경할 때만 이벤트가 트리거됩니다. | BOOLEAN | True | 해당 없음 | |||
SelectedRowsIDs | 그리드에서 선택한 모든 행의 IDFieldName 값을 포함하는 인포테이블입니다. 그리드 데이터에 페이지가 매겨지면 이 속성은 모든 페이지에서 선택한 ID 값을 반환합니다. 이 속성을 사용하면 페이지가 변경될 때 선택한 행을 유지할 수 있습니다.
| Infotable | 해당 없음 | Y | N | ||
SelectionCheckBoxHeaderAlignment | 머리글 행에서 선택 확인란의 세로 정렬을 제어합니다. | STRING | 맨 위 | 해당 없음 | N | ||
SelectionCheckboxRowAlignment | 행 선택 열에서 확인란의 세로 정렬을 제어합니다. | STRING | 맨 위 | 해당 없음 | N | ||
ShowValidationSuccess* | 입력한 데이터가 유효성 검사에 성공하면 성공 메시지를 표시합니다. | BOOLEAN | False | 아니요 | N | ||
ValidationSuccessIcon* | 성공 메시지 옆에 표시할 아이콘입니다. | 미디어 선택기 | 성공 아이콘 | 아니요 | N | ||
ShowValidationFailure* | 입력한 데이터가 유효성 검사에 실패하면 실패 메시지를 표시합니다. | BOOLEAN | False | 아니요 | N | ||
ValidationFailureIcon* | 실패 메시지 옆에 표시할 아이콘입니다. | 미디어 선택기 | 정보 아이콘 | 아니요 | N | ||
ShowValidationCritera* | 그리드에서 셀을 편집하면 필요한 입력 패턴에 대한 힌트 메시지를 표시합니다. | BOOLEAN | False | 아니요 | N | ||
ValidationCriteriaIcon* | 유효성 검사 기준에 대한 힌트 메시지 옆에 표시할 아이콘입니다. | 미디어 선택기 | 정보 아이콘 | 아니요 | N | ||
ShowFooter* | 그리드에 바닥글 영역을 추가합니다. | BOOLEAN | False | 아니요 | N | ||
ShowHeaderRowInFooter* | ShowFooter가 True로 설정되면 그리드 내에 머리글 행을 표시합니다. | BOOLEAN | False | 아니요 | N | ||
FooterData* | 그리드 바닥글에 대한 구성 데이터를 포함하는 인포테이블입니다. | INFOTABLE | 해당 없음 | 내부 | N | ||
ShowRowNumbers* | 그리드의 별도 열에 행 번호를 표시합니다. | BOOLEAN | False | 해당 없음 | N | ||
SingleLineHeader* | 머리글 행 텍스트를 한 줄로 표시합니다. 사용 가능한 공간을 초과하는 텍스트는 잘립니다. 기본적으로 머리글 텍스트는 여러 줄로 표시됩니다. | BOOLEAN | False | 내부 | N | ||
SingleLineRows* | 각 행의 콘텐츠를 한 줄로 표시합니다. 전체 콘텐츠를 한 행에 넣을 수 없으면 줄임표가 표시됩니다. 기본적으로 콘텐츠는 여러 줄로 표시됩니다.
| BOOLEAN | False | 내부 | N | ||
SortSelectionColumn* | 확인란 선택 열에 정렬 버튼을 추가합니다. 이를 통해 선택 여부에 따라 데이터 행을 정렬할 수 있습니다. | BOOLEAN | False | 해당 없음 | N | ||
TabSequence | TAB 키를 누를 때 위젯의 시퀀스 번호입니다. | NUMBER | 0 | 해당 없음 | N | ||
ToolbarActionsData | 그리드 도구 모음에 표시할 사용자 정의 작업을 정의하는 인포테이블입니다. 이 속성에 서비스를 바인딩하면 각 사용자 정의 작업에 대한 추가 속성이 속성 패널에 추가됩니다. | Infotable | Y | N | |||
ToolbarActionsPosition | 그리드의 편집, 추가 및 삭제 버튼을 기준으로 도구 모음 사용자 정의 작업의 위치를 제어합니다. 옵션: 없음, 이전, 이후.
| STRING | 이후 | N |