Slider in a toolbar

[dario]

Hello

I'm trying to add a slider to a toolbar. I'm using the script.aculo.us slider, version 1.7.0.

This is my code (tb is the toolbar object which has been already initialized in the page onload event):

var zoomSlider=null;

function initSlider()
{
zoomSlider = new Control.Slider('handleDiv', 'sliderDiv',
{
values: [1,2,3,4,5,6,7,8,9,10,11,12,13,14,15,16,17,18,19],
increment: 10,
onChange: function(value) { setZoomLevel(value); }
});
zoomSlider.setValue(INITIAL_ZOOM_LEVEL);

tb.add(zoomSlider);
}

This code does not generate any errors but no slider is shown on the toolbar. Any hint?
Thanks in advance!

[liggett78]

Well, you can't just add some fancy controls to the toolbar. I don't know how Control.Slider looks like internally, but the documentation for Toolbar.add() says:
If arg is a Toolbar.Button, it is added. If arg is a string, it is wrapped in a ytb-text element and added unless the text is "separator" in which case a separator is added. Otherwise, it is assumed the element is an HTMLElement and it is added directly.

In your case it's neither Toolbar.Button, nor a string. So the only thing left is HTMLElement, which is a raw DOM-element. Does Control.Slider expose some kind of underlying dom property?

[dario]

Thanks liggett78,
I'll go through the control.slider documentation to check if it expose some dom property.

[jgarcia@tdg-i.com]

dario,

Please post your code in php tags.

[moegal]

Is there a way to do this now with the new slider control? If so a simple example would be great!