djSliderRule - Dojo スライダルール

水平スライダまたは垂直スライダのルール (ハッシュマーク) を追加します。

カテゴリ

Dojo フォーム

構文

<xe:djSliderRule attributes>content</xe:djSliderRule>

表 1. 必須プロパティ
プロパティ	説明
id	デフォルトは `djSliderRule1`、`djSliderRule2` などです。
style	ルールの次元を指定します。
container	ルールのロケーションとして、`topDecoration`、`bottomDecoration`、`leftDecoration`、`rightDecoration` のいずれかを指定します。
count	ハッシュマークの数を指定します。

表 2. すべてのプロパティ
カテゴリ	プロパティ
アクセシビリティ	title、waiRole、waiState
basics	binding、count、dir、id、lang、loaded、rendered、rendererType
dojo	dojoAttributes、dojoType、dragRestriction、tooltip
イベント	onBlur、onChange、 onClick、onClose、onDblClick、onFocus、onHide、onKeyDown、onKeyPress、onKeyUp、onMouseDown、onMouseEnter、onMouseLeave、onMouseMove、onMouseOut、onMouseOver、onMouseUp、onShow
format	container
styling	disableTheme、ruleStyle、style、styleClass、themeId

使用法

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

実行時には、スライダルールの外側にラベルが表示されます。

例

以下の例は、スコープ変数にバインドされる水平スライダ、ページを送信するためのボタン、スコープ変数の値を表示する計算結果フィールドを示します。

<xp:table>
	<xp:tr>
		<xp:td>Horizontal Slider</xp:td>
		<xp:td>
			<xe:djHorizontalSlider id="djHorizontalSlider1" style="margin: 5px;width:200px; height: 20px;"
				value="#{sessionScope.djHorizontalSlider1}" discreteValues="1000"
				maximum="999" minimum="0">
				<xe:djSliderRuleLabels id="djSliderRuleLabels1"
					container="topDecoration"
					style="height:10px;font-size:75%;color:gray;">
					<xe:this.labelsList>
						<xe:djSliderRuleLabel label="0"></xe:djSliderRuleLabel>
						<xe:djSliderRuleLabel label="999"></xe:djSliderRuleLabel>
					</xe:this.labelsList>
				</xe:djSliderRuleLabels>
				<xe:djSliderRule id="djSliderRule1"
					container="topDecoration" style="height:5px;" count="11">
				</xe:djSliderRule>				
				<xe:djSliderRule id="djSliderRule2" style="height:5px;"
						count="11" container="bottomDecoration">
				</xe:djSliderRule>
				<xe:djSliderRuleLabels id="djSliderRuleLabels2"
						container="bottomDecoration" style="height:10px;font-size:75%;color:gray;">
				</xe:djSliderRuleLabels>
			</xe:djHorizontalSlider>
		</xp:td>
	</xp:tr>
	<xp:tr>
		<xp:td>
			<xp:button value="submit" id="button1">
				<xp:eventHandler event="onclick" submit="true" refreshMode="complete" immediate="false" save="true">
			</xp:eventHandler></xp:button>
		</xp:td>
		<xp:td></xp:td>
	</xp:tr>
	<xp:tr>
		<xp:td>Value</xp:td>
		<xp:td><xp:text escape="true" id="computedField1" value="#{sessionScope.djHorizontalSlider1}"></xp:text></xp:td>
	</xp:tr>
</xp:table>