Dojo滑块问题 - 如何使用滑块添加数字

时间:2011-08-07 09:58:40

标签: dojo

我有Dojo滑块,我需要从0到24小时(0,1,2,... 24)。如何实现这个? 我有这个:

<div id="vertical_monday" style="float: left;"></div>

并创建如下:

var vertical_monday = dojo.byId("vertical_monday");
                var rulesNodeMonday = document.createElement('div');
                vertical_monday.appendChild(rulesNodeMonday);

                var sliderRulesMonday = new dijit.form.VerticalRule({
                    count: 24,
                    style: "width:5px;" 
                },
                rulesNodeMonday);
                var slider = new dijit.form.VerticalSlider({
                    name: "vertical_monday",
                    value: 0,
                    minimum: 1440,
                    maximum: 0,
                    pageIncrement:100,
                    showButtons:true,
                    slideDuration:289,
                    discreteValues: 289,
                    intermediateChanges:true,
                    style: "height:500px;",
                    onChange: function(value) {
                        //dojo.byId("sliderValueMonday").value = value;
                        set_time_labels('mon',used_length['mon'],value);

                        val['mon']=value;
                        var a=(500*(value-used_length['mon']))/1440;



                        var temp_id='mon_'+temp_daily_plan['mon'];
                        $('#'+temp_id).css('height',a);
                    }
                },
                vertical_monday);

但它没有数字。如何添加数字?

1 个答案:

答案 0 :(得分:2)

这是一种快速而肮脏的方法,不确定它是否是推荐的方式。

为标签添加容器,就像使用标尺一样。

var labelsNodeMonday = document.createElement("div");
vertical_monday.appendChild(labelsNodeMonday);

然后创建一个dijit.form.VerticalRuleLabels实例并将其放在该节点中,明确地将标签提供为数组:

var labelsMonday = new dijit.form.VerticalRuleLabels({
    labels: ["1h", "2h", "3h", "4h"] //.. and so on
}, labelsNodeMonday);

或者,如果您不想重复自己。

var labelsMonday = new dijit.form.VerticalRuleLabels({
    getLabels: function() {
        for(var labels = [], i = 1; i <=24; i++) labels.push(i+"h");
        return labels;
    },
}, labelsNodeMonday);

同样,我不知道这是否是犹太教的方式。理想情况下,应该有以下几点:

var labelsMonday = new dijit.form.VerticalRuleLabels({
    minimum: 1, maximum: 24, step: 1,
    formatLabel: function(value) { return value + "h"; }
}, labelsNodeMonday);

..但是afaik目前还没有。