적응형 및 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" 스크립트를 실행할 수 있습니다. 이벤트를 트리거하는 구문은 (widget)입니다
._trigger(xfalib.ut.XfaUtil.prototype.XFA_ENTER_EVENT)
XFA_EXIT_EVENT 이 이벤트는 사용자가 필드를 떠날 때마다 트리거됩니다. 엔진은 필드의 값을 설정하고 해당 "종료" 스크립트를 실행할 수 있습니다. 이벤트를 트리거하는 구문은 (widget)입니다
._trigger(xfalib.ut.XfaUtil.prototype.XFA_EXIT_EVENT)
XFA_CHANGE_EVENT 이 이벤트는 엔진이 필드에 작성된 "변경" 스크립트를 실행할 수 있도록 트리거됩니다. 이벤트를 트리거하는 구문은 (widget)입니다
._trigger(xfalib.ut.XfaUtil.prototype.XFA_CHANGE_EVENT)
XFA_CLICK_EVENT 이 이벤트는 필드를 클릭할 때마다 트리거됩니다. 이를 통해 엔진은 필드에 작성된 "click" 스크립트를 실행할 수 있습니다. 이벤트를 트리거하는 구문은 (widget)입니다
._trigger(xfalib.ut.XfaUtil.prototype.XFA_CLICK_EVENT)

위젯에 의해 구현된 API

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

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

markError:function(errorMessage, errorType)
error
Message: 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)
n인덱스: 목록에서 제거할 항목의 인덱스


목록에서 옵션을 삭제합니다.
clearItems: function() 목록에서 모든 옵션을 지웁니다.

숫자 편집: NumericField, DecimalField

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

확인 단추: RadioButton, CheckBox

옵션 설명
values

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

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

states

허용되는 상태 수입니다.

적응형 양식(켜기, 끄기)과 HTML5 양식(켜기, 끄기, 중립)의 경우 2입니다.

상태

요소의 현재 상태입니다.

적응형 양식(켜기, 끄기)과 HTML5 양식(켜기, 끄기, 중립)의 경우 2입니다.

DateTimeEdit: (DateField)

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

이 페이지에서는