2016-10-20 20 views
0

2つの異なる入力フィールドに値を表示する水平範囲のスライダーが必要です。 ウェブサイトhttps://dojotoolkit.org/reference-guide/1.10/dojox/form/RangeSlider.htmlにある次のソースコードでは、値は1つの入力フィールドにのみ表示され、カンマ( '、')文字列で区切られています。Dojo 2つの入力フィールドを持つ水平範囲のスライダー

+0

以下のように、人々はあなたがよりよくしたいものを理解できるように、(外部リンクを必要とせず)の質問に直接コードを追加します。私は、コードが何を(そしてどのように)行い、何を達成したいのかについての詳細な説明を追加します。 – Tuzane

答えて

1

スライダのvalueプロパティは、両方の値を含む配列です。 1つの入力ではなく、2つの異なる入力に値を入力するだけです。してください

require(["dojox/form/HorizontalRangeSlider", "dojo/dom", "dojo/domReady!"], function(HorizontalRangeSlider, dojoDom){ 
 
    
 
    var rangeSlider = new HorizontalRangeSlider({ 
 
    name: "rangeSlider", 
 
    value: [2,6], 
 
    minimum: -10, 
 
    maximum: 10, 
 
    intermediateChanges: true, 
 
    style: "width:300px;", 
 
    onChange: function(value){ 
 
     dojoDom.byId("sliderValueMin").value = value[0]; 
 
     dojoDom.byId("sliderValueMax").value = value[1]; 
 
    } 
 
    }, "rangeSlider"); 
 
    
 
});
<link href="//ajax.googleapis.com/ajax/libs/dojo/1.11.2/dijit/themes/claro/claro.css" rel="stylesheet"/> 
 
<link href="//ajax.googleapis.com/ajax/libs/dojo/1.11.2/dojox/form/resources/RangeSlider.css" rel="stylesheet"/> 
 
<script src="//ajax.googleapis.com/ajax/libs/dojo/1.11.2/dojo/dojo.js"></script> 
 
<body class="claro"> 
 
    <div id="rangeSlider"></div> 
 
    <p><input type="text" id="sliderValueMin" /></p> 
 
    <p><input type="text" id="sliderValueMax" /></p> 
 
</body>

+0

今私はスライダにスタイルを設定しようとしていますが、動作しないようです。 – Manu

+0

どのようにHorizo​​ntalRuleとHorizo​​ntalRuleLabelsを設定できますか?それは数字だけを示していますが、目盛りはありません。 – Manu

+0

すみません、申し訳ありません。 – Manu

関連する問題