응용 및 HTML5 양식에 대한 모양 프레임워크

Forms(적응형 양식 및 HTML5 양식)은 모양 및 스크립팅을 위해 jQuery, Background.js밑줄.js 라이브러리를 사용합니다. 양식은 양식에 있는 모든 대화형 요소(예: 필드 및 단추)에 대해 jQuery UI 위젯 아키텍처도 사용합니다. 양식 개발자는 이 아키텍처를 사용하여 Forms에서 사용 가능한 다양한 jQuery 위젯 및 플러그인을 사용할 수 있습니다. leadDigits/trailDigits 제한이나 그림 조항 구현과 같은 사용자의 데이터를 캡처하는 동시에 양식별 로직을 구현할 수도 있습니다. 양식 개발자는 맞춤형 api를 만들어 사용하여 데이터 캡처 경험을 향상시키고 보다 사용자에게 친숙한 환경을 만들 수 있습니다.

이 문서는 jQuery 및 jQuery 위젯에 대한 충분한 지식이 있는 개발자를 위한 것입니다. 모양 프레임워크에 대한 통찰력을 제공하며 개발자는 양식 필드에 대한 대체 모양을 만들 수 있습니다.

모양 프레임워크는 다양한 옵션, 이벤트(트리거) 및 기능에 의존하여 양식과 사용자 상호 작용을 캡처하고 모델 변화에 응답하여 최종 사용자에게 알립니다. 추가:

  • 프레임워크는 필드의 모양에 대한 일련의 옵션을 제공합니다. 이러한 옵션은 키-값 쌍이며 두 카테고리로 나누어집니다.공통 옵션 및 필드 유형별 옵션.
  • 계약의 일부로 나타나는 모양은 입장 및 퇴장과 같은 일련의 이벤트를 트리거합니다.
  • 함수 집합을 구현하려면 모양이 필요합니다. 일부 함수는 일반적이지만 다른 함수는 필드 유형 함수와 관련이 있습니다.

일반적인 옵션

다음은 전역 옵션 설정입니다. 이러한 옵션은 모든 필드에 사용할 수 있습니다.

속성 설명
이름 스크립트 표현식에서 이 개체나 이벤트를 지정하는 데 사용되는 식별자입니다. 예를 들어 이 속성은 호스트 응용 프로그램의 이름을 지정합니다.
정렬 단추 필드의 실제 값입니다.
displayValue 이 필드 값이 표시됩니다.
screenReaderText 화면 Reader은 이 값을 사용하여 필드에 대한 정보를 나레이트합니다. 양식은 값을 제공하며 값을 재정의할 수 있습니다.
tabIndex 양식의 탭 시퀀스에 있는 필드의 위치입니다. 양식의 기본 탭 순서를 변경하려는 경우에만 tabIndex를 재정의합니다.
역할 요소의 역할(예: 제목 또는 표).
높이 위젯의 높이입니다. 픽셀 단위로 지정됩니다.
너비 위젯의 폭입니다. 픽셀 단위로 지정됩니다.
access 하위 폼과 같이 컨테이너 개체의 콘텐츠에 액세스하는 데 사용되는 컨트롤입니다.
paraStyles 위젯에 대한 XFA 요소의 para 속성입니다.
dir 텍스트의 방향입니다. 가능한 값은 ltr(왼쪽에서 오른쪽) 및 rtl(오른쪽에서 왼쪽)입니다.

이러한 옵션 외에도 프레임워크에서는 필드 유형에 따라 다른 몇 가지 다른 옵션을 제공합니다. 필드별 옵션에 대한 세부 사항은 아래에 나와 있습니다.

양식 프레임워크과의 상호 작용

양식 프레임워크와 상호 작용하기 위해 위젯은 양식 스크립트가 작동하도록 일부 이벤트를 트리거합니다. 위젯이 이러한 이벤트를 throw하지 않으면 해당 필드에 대해 양식에 작성된 스크립트 중 일부가 작동하지 않습니다.

위젯에 의해 트리거된 이벤트

이벤트 설명
XFA_ENTER_EVENT 이 이벤트는 필드가 포커스를 둘 때마다 트리거됩니다. 이 변수를 사용하면 필드에 "enter" 스크립트를 실행할 수 있습니다. 이벤트를 트리거하는 구문은
(위젯)입니다._trigger(xfalib.ut.XfaUtil.prototype.XFA_ENTER_EVENT)
XFA_EXIT_EVENT 이 이벤트는 사용자가 필드를 떠날 때마다 실행됩니다. 이를 통해 엔진은 필드의 값을 설정하고 해당 "종료" 스크립트를 실행할 수 있습니다. 이벤트를 트리거하는 구문은
(위젯)입니다._trigger(xfalib.ut.XfaUtil.prototype.XFA_EXIT_EVENT)
XFA_CHANGE_EVENT 이 이벤트는 엔진에서 필드에 작성된 "변경" 스크립트를 실행할 수 있도록 트리거됩니다. 이벤트를 트리거하는 구문은
(위젯)입니다._trigger(xfalib.ut.XfaUtil.prototype.XFA_CHANGE_EVENT)
XFA_CLICK_EVENT 이 이벤트는 필드를 클릭할 때마다 실행됩니다. 이 변수를 사용하면 필드에 작성된 "click" 스크립트를 실행할 수 있습니다. 이벤트를 트리거하는 구문은
(위젯)입니다._trigger(xfalib.ut.XfaUtil.prototype.XFA_CLICK_EVENT)

위젯에 의해 구현된 API

모양 프레임워크는 사용자 정의 위젯에 구현된 위젯의 일부 함수를 호출합니다. 위젯은 다음 함수를 구현해야 합니다.

함수 설명
초점:function() 필드에 초점을 둡니다.
클릭:function() 필드에 초점을 맞추고 XFA_CLICK_EVENT를 호출합니다.

markError:function(errorMessage, errorType)

오류 메시지:error
errorType:문자열("warning"/"error")

참고:HTML5 양식에만 해당됩니다.

위젯에 오류 메시지와 오류 유형을 전송합니다. 위젯에 오류가 표시됩니다.

clearError:function()

참고:HTML5 양식에만 해당됩니다.

필드의 오류가 수정되면 호출됩니다. 위젯이 오류를 숨깁니다.

필드 유형에 대한 옵션

모든 사용자 정의 위젯은 위의 사양을 따라야 합니다. 서로 다른 필드의 기능을 사용하려면 위젯이 특정 필드에 대한 지침을 따라야 합니다.

텍스트 편집:텍스트 필드

옵션 설명
여러 줄 필드가 새 행 문자 입력을 지원하는 경우 true이고, 그렇지 않으면 false입니다.
maxChars 필드에 입력할 수 있는 최대 문자 수입니다.

limitLengthToVisibleArea

참고:HTML5 양식에만 적용 가능

텍스트 너비가 위젯의 폭을 초과할 때 텍스트 필드의 동작을 지정합니다.

선택 목록:DropDownList, ListBox

옵션 설명
정렬 단추
선택한 값의 배열입니다.
항목
옵션으로 표시할 객체의 배열입니다. 각 객체에는
save라는 두 가지 속성이 있습니다.저장할 값, 표시 값:표시할 값입니다.

편집

참고:HTML5 양식에만 해당됩니다.

값이 true이면 위젯에서 사용자 정의 텍스트 항목이 활성화됩니다.
displayValue
표시할 값의 배열입니다.
multiselect
복수 선택이 허용되는 경우 true이고, 그렇지 않은 경우 false입니다.

API

함수 설명

addItem: function(itemValues)
itemValues:표시 및 저장 값
{sDisplayVal을 포함하는 개체:<displayValue>, sSaveVal:<값 저장>}

목록에 항목을 추가합니다.
deleteItem:function(nIndex)
nIndex:목록


에서 제거할 항목의 인덱스입니다.
목록에서 옵션을 삭제합니다.
clearItems: function() 목록에서 모든 옵션을 지웁니다.

숫자 편집:NumericField, DecimalField

옵션 설명
dataType 필드의 데이터 유형을 나타내는 문자열(정수/소수).
leadDigits 소수 자릿수에 허용되는 최대 행간 자리.
frcDigits 소수 자릿수에 허용되는 최대 분수.
zero 필드의 로케일에서 0의 문자열 표현입니다.
decimal 필드의 로케일에서 소수점의 문자열 표현입니다.

확인 단추:RadioButton, CheckBox

옵션 설명
values

값 배열(온/오프/중립).

checkButton의 여러 상태에 대한 값 배열입니다. values[0]은(는) 상태가 ON일 때의 값입니다. values[1]은(는) 상태가 OFF일 때의 값입니다.
values[2]는 상태가 NEUTRAL일 때의 값입니다. 값 배열의 길이는 상태 옵션의 값과 같습니다.

states

허용되는 상태 수입니다.

적응형 양식의 경우 2개(켜기, 끄기), HTML5 양식의 경우 3개(켜기, 끄기, 중립).

상태

요소의 현재 상태입니다.

적응형 양식의 경우 2개(켜기, 끄기), HTML5 양식의 경우 3개(켜기, 끄기, 중립).

DateTimeEdit:(DateField)

옵션 설명
해당 필드에 대한 현지화된 일 이름입니다.
개월 해당 필드에 대한 현지화된 월 이름.
zero 숫자 0에 대한 현지화된 텍스트입니다.
clearText 지우기 단추를 위한 현지화된 텍스트입니다.

이 페이지에서는