水平スライダの数値を受け入れます。
<xe:djHorizontalSlider attributes>content</xe:djHorizontalSlider>
プロパティ | 説明 |
---|---|
id | デフォルトは djHorizontalSlider1、djHorizontalSlider2 などです。 |
value | コントロールをデータ要素にバインドします。 |
style | スライダの次元を指定します。 |
discreteValues | スライダ上の値の数を指定します。 |
minimum | スライダの開始値を指定します。 |
maximum | スライダの終了値を指定します。 |
実行時に、水平スライダがページに表示されます。ユーザーはスライダをスライドさせて、数値を選択できます。
ルール (ハッシュマーク) やラベルを追加するには、djSliderRule - Dojo スライダルールや djSliderRuleLabels - 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>