컨트롤러를 사용하여 페이지에 데이터 UI 빌더 바인딩(고급 기능)
컨트롤러는 데이터와 이벤트 논리의 연결을 단순화하여 에서 UI 빌더구성요소 사전 설정을 활성화합니다.
컨트롤러를 사용하면 페이지 작성기에서 데이터와 스크립트를 의 페이지에 쉽게 연결할 수 있습니다 UI 빌더. 컨트롤러는 구성요소 사전 설정이 데이터를 구성요소에 바인딩하는 데 사용하는 데이터 자원의 유형입니다. 컨트롤러는 구성요소에 대한 사전 설정을 활성화하는 데이터 및 이벤트 논리를 포함한다는 점에서 다른 데이터 자원과 다릅니다. 컨트롤러는 서버에서 구성요소로 데이터를 가져오고 구성요소와의 상호작용을 기반으로 업데이트된 데이터를 서버로 다시 가져옵니다. 구성 요소 사전 설정에 대한 자세한 내용은 을 참조하십시오 사전 설정을 사용하여 구성요소 자동 구성.
의 데이터 컨트롤러 유형 UI 빌더
- 데이터 컨트롤러
- 데이터 컨트롤러는 페이지에 표시할 UI 빌더 정보를 결정합니다. 데이터 컨트롤러는 데이터 자원을 사용하여 실시간으로 정보를 동기화하고 사용자가 정보를 입력할 때 데이터/테이블을 업데이트합니다. 페이지에 데이터 컨트롤러를 수동으로 추가할 수 있습니다.
- UI 컨트롤러
- UI 컨트롤러는 페이지 템플릿을 사용할 UI 빌더 때 페이지에 추가되며 수동으로 추가할 수 없습니다.
에서 사전 설정이 있는 컨트롤러 사용 UI 빌더
한 UI 빌더 페이지에 여러 컨트롤러를 추가할 수 있지만 동일한 컨트롤러를 두 번 사용할 수는 없습니다. 컨트롤러가 필요한 구성요소 사전 설정을 사용하려고 하면 추가 UI 빌더 하라는 메시지가 표시됩니다.
모든 구성 요소가 컨트롤러에서 작동하는 것은 아니지만 구성 요소 라이브러리에서 어떤 구성 요소가 수행되는지 쉽게 확인할 수 있습니다. 페이지에 컨트롤러가 구성되어 UI 빌더 있는 경우 구성요소 라이브러리를 열어 사전 설정이 있는 구성요소를 볼 수 있습니다. 사전 설정을 사용할 수 있는 구성요소가 구성요소 라이브러리에서 강조 표시됩니다.
컨트롤러 추가
구성요소 사전 설정을 사용하려면 페이지에 데이터 컨트롤러를 추가합니다.
시작하기 전에
필요한 역할: 관리자
이 태스크 정보
기록 컨트롤러는 에서 페이지에 Yokohama추가할 수 있는 유일한 컨트롤러입니다.
프로시저
-
데이터 자원을 선택합니다.
-
추가를 선택합니다.
-
필드를 입력하여 컨트롤러를 구성합니다.
결과
양식 컨트롤러가 데이터 자원 섹션에 표시됩니다.
컨트롤러 편집
테이블에서 데이터를 끌어오도록 컨트롤러를 구성합니다.
시작하기 전에
필요한 역할: 관리자
프로시저
-
데이터 및 스크립트 서랍에서 편집할 컨트롤러를 선택합니다.
컨트롤러 삭제
에서 UI 빌더더 이상 필요하지 않은 컨트롤러를 삭제합니다.
시작하기 전에
필요한 역할: 관리자
이 태스크 정보
페이지 템플릿으로 만든 페이지에서는 컨트롤러를 삭제할 수 없습니다.
프로시저
-
삭제하려는 컨트롤러 옆에 있는 메뉴 아이콘(
)을 선택합니다.
-
삭제를 선택합니다.
컨트롤러가 로컬 데이터 자원 인스턴스에서 제거됩니다.
컨트롤러 API에서 속성 및 이벤트 보기
컨트롤러 공개 API는 컨트롤러가 사전 설정에 제공하는 출력 데이터를 정의합니다. 여기에는 사전 설정을 선택할 때 구성요소에서 사용하는 속성 값과 처리된 이벤트가 포함됩니다. UI 빌더에서 속성 및 이벤트 정보를 볼 수 있습니다.
사전 설정의 구성요소 속성 값은 정적 값 또는 컨트롤러 출력 데이터에 대한 경로일 수 있습니다. UI Builder의 데이터 자원 인스펙터를 사용하여 사전 설정에서 사용하는 컨트롤러 데이터 구조의 값을 표시할 수 있습니다. 사전 설정에서 이벤트가 전달하는 페이로드를 보려면 이벤트 핸들러 선택기에서 해당 이벤트를 확인할 수 있습니다.
컨트롤러 API에서 속성 보기
UIB 데이터 검사기에서 사전 설정 속성을 볼 수 있습니다. 사용 가능한 값을 알면 구성요소가 설계에서 동작하는 방식을 이해하는 데 도움이 되며 재정의할 수 있는 사전 설정의 속성을 식별하는 데 도움이 됩니다.
이 절차에서는 페이지에 사전 설정이 있는 구성요소를 배치하고 컨트롤러를 구성했다고 가정합니다. 자세한 내용은 컨트롤러 추가를 참조하세요.
구성 탭에는 미리 설정된 속성 값이 컨트롤러 출력에 대한 경로로 표시됩니다. 기본 데이터 경로는 @data.<controller_name>로 표현됩니다. 경로의 나머지 부분은 컨트롤러 데이터 계층 구조 내의 범주 내용을 사용하여 빌드됩니다. 이 경로를 사용하여 컨트롤러가 구성된 기록의 현재 값을 볼 수 있습니다.
- 구성요소에 대한 데이터 자원을 보려면 왼쪽 아래 사이드바에서 데이터 아이콘을 선택합니다.
3개 열의 UIB 데이터 검사기가 나타납니다.
- 데이터 자원이 나열되는 첫 번째 열에서 출력을 보려는 컨트롤러를 선택합니다.선택한 컨트롤러에 대한 구성 데이터가 두 번째 열의 구성 탭에 나타납니다. 페이지에 배치한 사전 설정을 사용하여 첫 번째 구성요소에 대해 컨트롤러를 구성할 때 입력한 입력 속성입니다. 원하는 경우 여기에서 이러한 연결 값을 편집할 수 있습니다.주:시스템 ID 필드의 값에 대해 -1을 구성하면 새 기록에 대한 컨트롤러가 구성됩니다. 그런 다음 컨트롤러는 기록이 저장되기 전에 레코드에 대해 데이터를 저장하는 데 사용할 수 있는 전체 GUID를 생성합니다. 이렇게 하면 첨부 파일 저장과 같은 새로 만든 기록에서 작업을 수행할 수 있습니다.
- 세 번째 열에서 최상위 수준 출력을 선택합니다.
이는 컨트롤러 데이터 계층 구조의 상위 수준으로, 프리픽스
@data., 컨트롤러 ID로 표시됩니다. 이 조합은 데이터에 대한 루트 경로를 형성합니다. 최상위 수준 출력에 포함된 데이터는 인접한 코드 필드에 표시되며 사전 설정 및 스크립트를 사용할 수 있습니다. 해당 수준의 다른 속성은 모든 기록에 적용되는 몇 가지 공통 속성입니다.사전 설정이 구성요소 속성을 컨트롤러 출력에 매핑하면 값 대신 출력 경로가 표시됩니다. 경로는 @data.<controller id>.<최상위 수준에서 출력 >속성까지의 경로로 표시되며 값으로 또는 수식 표현식의 일부로 사용할 수 있습니다.
이 예에서 사전 설정의 매핑은
@data.gform.table에 대한 경로가 됩니다. - 최상위 수준 아래의 데이터를 보려면 사전 설정 속성 값에서 경로로 표시된 하위 범주를 선택합니다.
하위 범주의 이름은 경로에
@data.<controller ID>.<category>로 나타납니다. 그런 다음 해당 범주의 데이터가 해당 경로에 추가됩니다. 코드 필드 위의 루트 경로는 사용 중인 하위 범주를 나타냅니다. 이 예제에서양식범주의 View 속성 경로는@data.gform.form.view로 표현됩니다. 이 사전 설정 값은 작업 공간 뷰에 양식을 표시합니다.이 예시에서는 객체를 빌드하기 위해 수식 표현식에 여러 컨트롤러 출력 속성이 사용됩니다.
- 스크립팅된 속성 값을 보려면 속성 옆에 있는 잠금 아이콘을 선택합니다.
이렇게 하면 속성이 편집 모드로 전환되고 스크립트를 편집하기 위한 모달이 열립니다.
컨트롤러 API에서 이벤트 보기
- UI 빌더에서 이벤트 탭을 선택합니다.
- 사전 설정 이벤트에 대한 매핑을 보려면 이벤트 타일을 선택합니다.
사전 설정 이벤트에 대한 페이로드 속성을 보여주는 모달이 나타납니다. 이 모달에서 이벤트를 비활성화 할 수 있습니다.
- 이벤트에 이벤트 처리기를 추가하려면 이벤트 타일 아래에서 + 이벤트 처리기 추가를 선택합니다.
사용 가능하고 처리된 이벤트 목록을 보여주는 모달이 나타납니다. 나열된 컨트롤러 중 하나의 이벤트 핸들러를 포함하여 목록에서 모든 작업을 선택할 수 있습니다.
- 목록에서 이벤트 핸들러를 선택하고 추가를 선택합니다.
새 처리기가 이벤트 타일 아래에 나열됩니다.