section - セクション

他のコントロールとテキストのための省略表示可能なコンテナと して機能します。

カテゴリ

コンテナコントロール

構文

<xp:section attributes>content</xp:section>
表 1. 必須プロパティ
プロパティ 説明
id デフォルトは section1、section2 などです。
header ヘッダーは、セクションの上部に表示され、セクションを省略表示したときに見えるようになります。
type 形式としては以下のタイプがあります。
  • default: 境界線なし
  • wide: 下部にグレーのバーが表示されます
  • box: 四方をすべてグレーのバーで囲みます
  • tab: 矢印と、矢印の下のセクションコンテンツの背景をグレーにします
initClosed デフォルトでは、セクションは初期状態で開かれています。
表 2. すべてのプロパティ
カテゴリ プロパティ
アクセシビリティ accesskey、role、tabindex、title
basics 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
format type
styling disableTheme、headerStyle、style、styleClass、themeId

使用法

実行時に、セクションがページに 表示されます。 ユーザーは、セクションを開いたり閉じたりすることができます。

例

下のセクションには、2 つの編集ボックスが含まれています。
<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>