djTabPane - Dojo タブペイン

タブコンテナに含まれる 1 つのペインのコンテンツを指定します。

カテゴリ

拡張ライブラリ

構文

<xe:djTabPane attributes>content</xe:djTabPane>

表 1. 必須プロパティ
プロパティ	説明
id	デフォルトは `djTabPane1`、`djTabPane2` などです。
title	タブにラベルを適用します。アクセシビリティについてはツールチップを使用します。

表 2. すべてのプロパティ
カテゴリ	プロパティ
アクセシビリティ	title、waiRole、waiState
basics	binding、closable、dir、errorMessage、extractContent、href、id、lang、loaded、loadingMessage、partialEvents、partialRefresh、preload、preventCache、refreshOnShow、rendered、rendererType、tabUniqueKey
dojo	dojoAttributes、dojoType、dragRestriction、parseOnLoad、tooltip
イベント	onBlur、onClick、onClose、onContentError、onDblClick、onDownloadEnd、onDownloadError、onDownloadStart、onFocus、onHide、onKeyDown、onKeyPress、onKeyUp、onLoad、onMouseDown、onMouseEnter、onMouseLeave、onMouseMove、onMouseOut、onMouseOver、onMouseUp、onShow、onUnload
styling	disableTheme、style、styleClass、themeId

使用法

これは Dojo コントロールです。

TabContainer コントロールには TabPane コントロールが含まれ、各 TabPane コントロールには 1 つのタブのコンテンツが表示されます。ユーザーがタブをクリックすると、そのコンテンツが表示されます。

このコントロールは、最新のアクセシビリティ標準に対してテストされていません。推奨されるアクセシビリティパスはタブ付きパネルコントロールです。

例

以下の例は、タブコンテナコントロールに含まれる 3 つのタブペインコントロールを示しています。

<xe:djTabContainer id="djTabContainer1" style="width:500px; height:100px; margin:5px;">
	<xe:djTabPane id="djTabPane1" title="Title">
		<xp:text escape="true" id="computedField1"
			value="#{javascript:database.getTitle()}">
		</xp:text>
	</xe:djTabPane>
	<xe:djTabPane id="djTabPane2" title="File path">
		<xp:text escape="true" id="computedField2"
			value="#{javascript:database.getFilePath()}">
		</xp:text>
	</xe:djTabPane>
	<xe:djTabPane id="djTabPane3" title="Creation date">
		<xp:text escape="true" id="computedField3"
			value="#{javascript:database.getCreated().getLocalTime()}">
		</xp:text>
	</xe:djTabPane>
</xe:djTabContainer>