핵심 구성 요소 기반 적응형 Forms을 위한 규칙 편집기 사용자 인터페이스
핵심 구성 요소를 기반으로 하는 적응형 Forms을 위한 규칙 편집기 사용자 인터페이스는 Adobe Experience Manager(AEM) 내의 양식 작성 프로세스를 향상시킵니다. 사전 정의된 조건, 사용자 입력 및 상호 작용에 따라 작업을 트리거하는 규칙을 작성하여 비즈니스 사용자와 개발자 모두 동적 동작과 복잡한 로직을 양식에 구현할 수 있습니다. 이 기능은 ES10 기능을 비롯한 최신 JavaScript 기능을 지원하며, 규칙 작성 프로세스를 단순화하는 직관적인 시각적 편집기를 제공합니다.
규칙 편집기는 양식 채우기 환경을 간소화하여 정확성과 효율성을 모두 보장하는 데 유용합니다. 이를 통해 패널 및 양식의 유효성 검사 또는 재설정과 양식 개체의 값을 계산하는 사용자 지정 함수를 실행할 수 있습니다. 중첩된 조건에 대한 지원과 양식 데이터 모델 서비스를 호출하는 기능을 갖춘 규칙 편집기 사용자 인터페이스는 반응형, 사용자 친화형 및 적응형 양식을 만드는 데 중요한 구성 요소입니다.
규칙 편집기 사용자 인터페이스 이해 understanding-the-rule-editor-user-interface
규칙 편집기는 규칙을 작성하고 관리할 수 있는 포괄적이면서도 간단한 사용자 인터페이스를 제공합니다. 작성 모드의 적응형 양식 내에서 규칙 편집기 사용자 인터페이스를 시작할 수 있습니다.
규칙 편집기 사용자 인터페이스를 시작하려면 다음을 수행합니다.
-
작성 모드에서 적응형 양식을 엽니다.
-
규칙을 작성할 양식 개체를 선택하고 구성 요소 도구 모음에서
선택한 양식 객체에 대한 기존 규칙이 이 뷰에 나열됩니다. 기존 규칙 관리에 대한 자세한 내용은 규칙 관리를 참조하십시오.
-
새 규칙을 작성하려면 만들기 를 선택하십시오. 규칙 편집기 사용자 인터페이스의 시각적 편집기는 규칙 편집기를 처음 실행할 때 기본적으로 열립니다.
규칙 편집기 UI의 각 구성 요소를 자세히 살펴보겠습니다.
A. 구성 요소 규칙 표시 a-component-rule-display
규칙 편집기를 시작한 적응형 양식 개체의 제목과 현재 선택된 규칙 유형을 표시합니다. 위의 예에서 규칙 편집기는 질문 1이라는 적응형 양식 객체에서 시작되며 선택한 규칙 유형은 때입니다.
B. 양식 개체 및 함수 b-form-objects-and-functions-br
규칙 편집기 사용자 인터페이스의 왼쪽 창에는 두 개의 탭, 즉 Forms 개체 및 함수 가 있습니다.
양식 개체 탭은 적응형 양식에 포함된 모든 개체의 계층 구조 보기를 표시합니다. 객체의 제목과 유형이 표시됩니다. 규칙을 작성할 때 양식 개체를 규칙 편집기로 드래그 앤 드롭할 수 있습니다. 개체 또는 함수를 자리 표시자로 드래그 앤 드롭할 때 규칙을 만들거나 편집할 때 자리 표시자는 자동으로 적절한 값 유형을 사용합니다.
하나 이상의 유효한 규칙이 적용된 양식 개체는 녹색 점으로 표시됩니다. 양식 객체에 적용된 규칙 중 하나라도 유효하지 않으면 양식 객체가 노란색 점으로 표시됩니다.
함수 탭에는 Sum Of, Min Of, Max Of, Average Of, Number 및 Validate Form과 같은 기본 함수 집합이 포함되어 있습니다. 이러한 함수를 사용하여 반복 가능한 패널 및 테이블 행에서 값을 계산하고 규칙을 작성할 때 작업 및 조건 문에서 사용할 수 있습니다. 그러나 사용자 정의 함수를 만들 수도 있습니다.
일부 함수 목록이 그림에 표시됩니다.
양식 객체의 왼쪽 트리에서 양식 객체를 선택하여 각 객체에 적용된 규칙을 표시할 수 있습니다. 다양한 양식 객체의 규칙을 탐색할 수 있을 뿐만 아니라 양식 객체 간에 규칙을 복사하여 붙여넣을 수도 있습니다. 자세한 내용은 규칙 복사-붙여넣기를 참조하십시오.
C. 양식 개체 및 함수 전환 c-form-objects-and-functions-toggle-br
전환 단추를 누르면 양식 개체 및 함수 창이 전환됩니다.
D. 시각적 규칙 편집기 visual-rule-editor
시각적 규칙 편집기는 규칙 편집기 사용자 인터페이스의 시각적 편집기 모드에서 규칙을 작성하는 영역입니다. 규칙 유형을 선택하고 그에 따라 조건 및 작업을 정의할 수 있습니다. 규칙에서 조건 및 작업을 정의할 때 양식 개체 및 함수 창에서 양식 개체 및 함수를 드래그 앤 드롭할 수 있습니다.
시각적 규칙 편집기 사용에 대한 자세한 내용은 규칙 쓰기를 참조하십시오.
E. 완료 및 취소 단추 done-and-cancel-buttons
완료 단추를 사용하여 규칙을 저장합니다. 불완전한 규칙을 저장할 수 있습니다. 그러나 미완료는 유효하지 않으며 실행되지 않습니다. 다음에 동일한 양식 객체에서 규칙 편집기를 실행하면 양식 객체에 저장된 규칙이 나열됩니다. 해당 보기에서 기존 규칙을 관리할 수 있습니다. 자세한 내용은 규칙 관리를 참조하십시오.
취소 단추를 사용하면 규칙에 대한 모든 변경 내용이 취소되고 규칙 편집기가 닫힙니다.
규칙 작성 write-rules
시각적 규칙 편집기 을(를) 사용하여 규칙을 작성할 수 있습니다.
먼저 시각적 편집기를 사용하여 규칙을 작성하는 방법을 살펴보겠습니다.
+++
다음 예제 양식을 사용하여 시각적 편집기에서 규칙을 만드는 방법을 살펴보겠습니다.
예제 대출 신청서의 대출 요건 섹션에서는 신청자가 결혼 여부, 급여 및 기혼인 경우 배우자의 급여를 지정해야 합니다. 사용자 입력을 기반으로 규칙이 대출 자격 금액을 계산하고 대출 자격 필드에 표시합니다. 다음 규칙을 적용하여 시나리오를 구현합니다.
- [배우자 임금] 필드는 [결혼 상태]가 [기혼]인 경우에만 표시됩니다.
- 대출 가능 금액은 총 급여의 50%입니다.
규칙을 작성하려면 다음 단계를 수행하십시오.
-
먼저 혼인 상태 라디오 단추에 대해 사용자가 선택한 옵션을 기준으로 배우자 임금 필드의 가시성을 제어하는 규칙을 작성합니다.
작성 모드에서 대출 신청 양식을 엽니다. 결혼 상태 구성 요소를 선택하고
규칙 편집기를 실행하면 기본적으로 시기 규칙이 선택됩니다. 또한 규칙 편집기를 시작한 양식 개체(이 경우 결혼 상태)는 When 문에 지정됩니다.
선택한 객체를 변경하거나 수정할 수 없지만 아래 표시된 대로 규칙 드롭다운을 사용하여 다른 규칙 유형을 선택할 수 있습니다. 다른 객체에 규칙을 작성하려면 취소를 선택하여 규칙 편집기를 종료하고 원하는 양식 객체에서 규칙을 다시 시작합니다.
-
상태 선택 드롭다운을 선택하고 이(가) 다음과 같음 을(를) 선택합니다. 문자열 입력 필드가 나타납니다.
-
규칙의 문자열 입력 필드에서 드롭다운 메뉴에서 기혼 을(를) 선택합니다.
조건을
When Marital Status is equal to Married
(으)로 정의했습니다. 그런 다음 이 조건이 True인 경우 수행할 작업을 정의합니다. -
Then 문의 작업 선택 드롭다운에서 표시 를 선택합니다.
-
개체 놓기 또는 여기를 선택 필드의 양식 개체 탭에서 배우자 급여 필드를 드래그 앤 드롭하십시오. 또는 드롭 개체 또는 여기를 선택 필드를 선택하고 양식의 모든 양식 개체가 나열된 팝업 메뉴에서 배우자 급여 필드를 선택합니다.
그런 다음 이 조건이 False인 경우 수행할 작업을 정의합니다.
-
혼인 상태를 싱글로 선택하는 경우 기타 섹션 추가 를 클릭하여 배우자 급여 필드에 다른 조건을 추가합니다.
-
Else 문의 작업 선택 드롭다운에서 숨기기 를 선택합니다.
-
개체 놓기 또는 여기를 선택 필드의 양식 개체 탭에서 배우자 급여 필드를 드래그 앤 드롭하십시오. 또는 드롭 개체 또는 여기를 선택 필드를 선택하고 양식의 모든 양식 개체가 나열된 팝업 메뉴에서 배우자 급여 필드를 선택합니다.
규칙은 규칙 편집기에 다음과 같이 표시됩니다.
-
완료 를 선택하여 규칙을 저장합니다.
note note |
---|
NOTE |
또는 혼인 상태 필드의 [시기] 규칙 대신 [배우자 임금] 필드에 표시 규칙을 작성하여 동일한 동작을 구현할 수 있습니다. |
-
다음으로, 총 급여의 50%인 대출 자격 금액을 계산하는 규칙을 작성하여 대출 자격 필드에 표시합니다. 이 결과를 얻으려면 대출 자격 필드에 값 설정 규칙을 만드십시오.
작성 모드에서 대출 자격 필드를 선택하고
-
규칙 드롭다운에서 값 설정 규칙을 선택합니다.
-
옵션 선택 을 선택하고 수학 식 을 선택합니다. 수학 표현식을 작성할 필드가 열립니다.
-
표현식 필드에서:
-
Forms 개체 탭에서 첫 번째 놓기 개체에 있는 급여 필드를 선택하거나 끌어서 놓거나 여기 필드를 선택합니다.
-
연산자 선택 필드에서 더하기 을(를) 선택합니다.
-
Forms 개체 탭에서 다른 개체 놓기 또는 여기를 선택 필드의 배우자 급여 필드를 선택하거나 끌어서 놓습니다.
-
-
그런 다음 식 필드 주위의 강조 표시된 영역에서 을 선택하고 식 확장 을 선택합니다.
확장 식 필드의 연산자 선택 필드에서 나누기 를 선택하고 옵션 선택 필드에서 숫자 를 선택합니다. 그런 다음 숫자 필드에 2 을(를) 지정합니다.
note note NOTE 옵션 선택 필드에서 구성 요소, 함수, 수학 표현식 및 등록 정보 값을 사용하여 복잡한 표현식을 생성할 수 있습니다. 그런 다음 조건을 만들어 True를 반환하면 표현식이 실행됩니다.
-
When 문을 추가하려면 조건 추가 를 선택하십시오.
When 문에서:
-
Forms 개체 탭에서 첫 번째 개체를 놓거나 여기를 선택 필드의 결혼 상태 필드를 선택하거나 끌어서 놓습니다.
-
연산자 선택 필드에서 이(가) 과(와) 같습니다.
-
다른 개체 삭제에서 String을 선택하거나 여기를 선택 필드를 선택하고 문자열 입력 필드에 결혼됨 을(를) 지정합니다.
규칙이 최종적으로 규칙 편집기에 다음과 같이 표시됩니다.
-
-
완료 를 선택합니다. 규칙을 저장합니다.
-
혼인 상태가 싱글인 경우 대출 자격을 계산하는 다른 규칙을 정의하려면 단계 7 - 14를 반복합니다. 규칙은 규칙 편집기에 다음과 같이 표시됩니다.
또는, 값 설정 규칙을 사용하여 배우자 임금 필드를 표시-숨기기 위해 생성한 시기 규칙에서 대출 자격을 계산할 수 있습니다. 혼인 상태가 싱글인 경우 결합된 결과 규칙은 규칙 편집기에 다음과 같이 표시됩니다.
혼합 규칙을 작성하여 배우자 임금 필드의 가시성을 통제하고 결혼 상태가 기혼인 경우 기타 조건을 사용하여 대출 자격을 계산할 수 있습니다.
규칙 편집기의 사용자 정의 함수 custom-functions
함수 출력 에 나열된 합계 와 같은 기본 함수 외에 규칙 편집기에서 사용자 지정 함수를 사용할 수도 있습니다. 규칙 편집기는 스크립트 및 사용자 지정 함수에 대한 JavaScript ECMAScript 2019 구문을 지원합니다. 사용자 지정 함수 만들기에 대한 지침은 적응형 Forms의 사용자 지정 함수 문서를 참조하십시오.
규칙 관리 manage-rules
양식 개체에 대한 기존 규칙은 개체를 선택하고
규칙에 대해 다음 작업을 수행할 수 있습니다.
-
확장/축소: 규칙 목록의 콘텐츠 열에 규칙 콘텐츠가 표시됩니다. 전체 규칙 콘텐츠가 기본 보기에 표시되지 않으면
-
순서 바꾸기: 만든 새 규칙이 규칙 목록의 맨 아래에 스택되어 있습니다. 규칙은 위에서 아래로 실행됩니다. 맨 위에 있는 규칙이 먼저 실행되고 같은 유형의 다른 규칙이 실행됩니다. 예를 들어, 맨 위에서 첫 번째, 두 번째, 세 번째 및 네 번째 위치에 각각 When, Show, Enable 및 When 규칙이 있는 경우 맨 위에 있는 When 규칙이 먼저 실행되고 네 번째 위치에 있는 When 규칙이 실행됩니다. 그런 다음 표시 및 활성화 규칙이 실행됩니다.
-
편집: 규칙을 편집하려면 규칙 제목 옆에 있는 확인란을 선택하십시오. 규칙을 편집하고 삭제하는 옵션이 나타납니다. 편집 을 선택하여 규칙 편집기에서 선택한 규칙을 엽니다.
-
삭제: 규칙을 삭제하려면 규칙을 선택하고 삭제 를 선택합니다.
-
활성화/비활성화: 규칙 사용을 일시 중지해야 하는 경우 하나 이상의 규칙을 선택하고 [작업] 도구 모음에서 비활성화 를 선택하여 비활성화할 수 있습니다. 규칙이 비활성화되어 있으면 런타임에 실행되지 않습니다. 비활성화된 규칙을 활성화하려면 해당 규칙을 선택하고 작업 도구 모음에서 활성화 를 선택할 수 있습니다. 규칙의 상태 열에는 규칙의 활성화 여부가 표시됩니다.
규칙 복사/붙여넣기 copy-paste-rules
한 필드에서 유사한 다른 필드로 규칙을 복사하여 붙여넣으면 시간을 절약할 수 있습니다.
규칙을 복사하여 붙여넣으려면 다음을 수행합니다.
-
규칙을 복사할 양식 개체를 선택하고 구성 요소 도구 모음에서
기존 규칙 관리에 대한 자세한 내용은 규칙 관리를 참조하십시오.
-
규칙 제목 옆에 있는 확인란을 선택하면 규칙을 관리하는 옵션이 나타납니다. 복사 를 선택합니다.
-
규칙을 붙여넣을 다른 양식 개체를 선택하고 붙여넣기 를 선택합니다. 또한 규칙을 편집하여 변경할 수 있습니다.
note note NOTE 해당 양식 객체가 복사된 규칙의 이벤트를 지원하는 경우에만 다른 양식 객체에 규칙을 붙여넣을 수 있습니다. 예를 들어 버튼은 클릭 이벤트를 지원합니다. 클릭 이벤트가 있는 규칙을 단추에는 붙여넣을 수 있지만 확인란에는 붙여넣을 수 없습니다. -
완료 를 선택하여 규칙을 저장합니다.
다음 단계
적응형 양식의 규칙 편집기에서 다양한 연산자 유형 및 이벤트를 이해하려면 적응형 양식의 규칙 편집기에서 사용 가능한 연산자 유형 및 이벤트 문서를 참조하십시오.
추가 참조
- 핵심 구성 요소 기반 적응형 양식의 규칙 편집기 소개
- 핵심 구성 요소 기반 적응형 양식의 규칙 편집기에서 사용 가능한 연산자 유형 및 이벤트
- 핵심 구성 요소 기반 적응형 양식의 규칙 편집기 사용자 인터페이스
- 핵심 구성 요소 기반 적응형 양식의 규칙 편집기의 다양한 사용 사례
- 다양한 규칙 편집기 에디션의 차이점
- 적응형 양식에서 비동기 함수 사용
- 핵심 구성 요소 기반 양식의 시각적 규칙 편집기에서 Service 개선 사항 호출
- 핵심 구성 요소 기반 적응형 양식의 사용자 정의 함수 소개
- 핵심 구성 요소 기반 적응형 양식의 사용자 정의 함수 만들기
- 사용자 정의 함수의 범위 오브젝트
- 사용자 정의 함수 개발 및 사용의 예