다른 제어 및 텍스트의 경우, 접을 수 있는 컨테이너로 동작합니다.
카테고리
컨테이너 제어
구문
<xp:section attributes>content</xp:section>
표 1. 필수 특성| 특성 |
설명 |
|---|
| id |
기본값 section1, section2 등을 지정합니다. |
| header |
헤더는 섹션의 맨 위에 표시되며 섹션을 접어도 표시됩니다. |
| type |
형식화 유형은 다음과 같습니다. - 기본: 테두리 없음
- 가로: 아래에 회색 막대가 표시됨
- 상자: 네 면 모두에 회색 막대가 표시됨
- 탭: 화살표에 대해 회색 배경이 표시되며 화살표 아래에 섹션 컨텐츠가 표시됨
|
| initClosed |
기본적으로 섹션은 처음에 열려 있습니다. |
표 2. 모든 특성| 카테고리 |
특성 |
|---|
| 내게 필요한 옵션 |
accesskey,
role, tabindex,
title |
| 기본사항 |
attrs, binding, collapsedImage, dir, disabled, expandedImage, header, id, initClosed, lang, loaded, rendered, rendererType |
| 이벤트 |
onblur, onclick,
ondblclick, onfocus,
onkeydown, onkeypress,
onkeyup, onmousedown,
onmousemove, onmouseout,
onmouseover, onmouseup |
| 형식 |
type |
| 스타일 |
disableTheme, headerStyle,
style, styleClass,
themeId |
사용법
런타임 시, 페이지에 섹션이 표시됩니다.
- 닫힌 섹션은 헤더만 표시합니다.
- 열린 섹션은 헤더와 컨텐츠를 표시합니다.
사용자는 섹션을 열고 닫을 수 있습니다.
예제
이 섹션에는 두 개의 편집 상자가 있습니다.
<xp:section id="section1" header="Phone numbers" type="tab"
initClosed="true">
<xp:inputText id="inputText2" value="#{document1.phoneday}"></xp:inputText>day
<xp:br></xp:br>
<xp:inputText id="inputText3" value="#{document1.phonenight}"></xp:inputText>night
</xp:section>