Forum: Rails Spinoffs (closed, excessive spam) change slider position dynamically (scriptaculous slider.js)

Is there a way to change the slider position dynamically when using
the scriptaculous slider.js library?  obviously you can click and
drag, but i'd like to be able to change it to a step or percentage
based on other actions besides clicking and dragging it...

Hey there,

bcamp1973 a écrit :
> Is there a way to change the slider position dynamically when using
> the scriptaculous slider.js library?  obviously you can click and
> drag, but i'd like to be able to change it to a step or percentage
> based on other actions besides clicking and dragging it...

As per the examples on:

   http://wiki.script.aculo.us/scriptaculous/show/SliderDemo

It looks very much possible (see 3rd slider).  Just look at the options.
  Failing that, look at this page's source :-)

--
Christophe Porteneuve aka TDD
tdd@tddsworld.com

bcamp1973 a écrit :
>> Is there a way to change the slider position dynamically when using
>> the scriptaculous slider.js library?  obviously you can click and
>> drag, but i'd like to be able to change it to a step or percentage
>> based on other actions besides clicking and dragging it...
>
>As per the examples on:
>
>   http://wiki.script.aculo.us/scriptaculous/show/SliderDemo
>

Hi Christophe, thanks for replying to my post.  I've seen that demo and 
unfortunately that doesn't really cover what i'm trying to accomplish. 
That sets up steps for the thumb to travel. However, i need to *control* 
the position of the thumb without actually grabbing and dragging it with 
the cursor. Unfortunately the javascript in the slider.js file is a bit 
over my head so reverse engineering it is beyond my skillset :P

Hey Brian,

I think the setValue and setValueBy methods are what you're looking for.
  Didn't test, but judging by their contents, this looks good enough :-)

--
Christophe Porteneuve aka TDD
tdd@tddsworld.com

On Thursday, February 22, 2007, at 11:28AM, "Christophe Porteneuve" 
<tdd@tddsworld.com> wrote:
>I think the setValue and setValueBy methods are what you're looking for. 
>  Didn't test, but judging by their contents, this looks good enough :-)

I was eyeing those, just wasn't sure how to use them.  The problem is i 
have almost no experience with classes in JS (If this was PHP i'd be 
fine :).  So, i've initialized the slider using the following code, and 
it's working great...

new Control.Slider('mthumb','mslider',{
   range:$R(0,100),
   onSlide:function(v){do something...},
   onChange:function(v){do something...}
});

But, once it's initialized, what's the syntax to call the setValue() and 
setValueBy() functions?  Is it just Control.Slider.setValue()?  I have 
more than one slider on the page so i'm guessing there must be a way to 
differentiate?

Brian Campbell wrote:

> I was eyeing those, just wasn't sure how to use them.  The problem is i have almost no experience with classes in JS (If this was PHP i'd be fine :).  So, i've initialized the slider using the following code, and it's working great...
> 
> new Control.Slider('mthumb','mslider',{
>    range:$R(0,100),
>    onSlide:function(v){do something...},
>    onChange:function(v){do something...}
> });

new() will return an object. Sometimes you don't need it. But in this 
case you do.

> But, once it's initialized, what's the syntax to call the setValue() and setValueBy() functions?  Is it just Control.Slider.setValue()?  I have more than one slider on the page so i'm guessing there must be a way to differentiate?

No, get the object back and then call it's setValue() and setValueBy() 
methods.

var slider = new Control.Slider(...);
slider.setValue(...);


--
Michael Peters
Developer
Plus Three, LP

On Thursday, February 22, 2007, at 12:35PM, "Michael Peters" 
<mpeters@plusthree.com> wrote:
>new() will return an object. Sometimes you don't need it. But in this case you do.
>
>> But, once it's initialized, what's the syntax to call the setValue() and setValueBy() functions?  Is it just Control.Slider.setValue()?  I have more than one slider on the page so i'm guessing there must be a way to differentiate?
>
>No, get the object back and then call it's setValue() and setValueBy() methods.
>
>var slider = new Control.Slider(...);
>slider.setValue(...);

Perfect!  Thanks Michael, that's exactly what i needed :)

Brian Campbell wrote:
> On Thursday, February 22, 2007, at 12:35PM, "Michael Peters" 
> <mpeters@plusthree.com> wrote:
>>new() will return an object. Sometimes you don't need it. But in this case you do.
>>
>>> But, once it's initialized, what's the syntax to call the setValue() and setValueBy() functions?  Is it just Control.Slider.setValue()?  I have more than one slider on the page so i'm guessing there must be a way to differentiate?
>>
>>No, get the object back and then call it's setValue() and setValueBy() methods.
>>
>>var slider = new Control.Slider(...);
>>slider.setValue(...);
> 
> Perfect!  Thanks Michael, that's exactly what i needed :)

Hello,

I am working on sliders . My problem is that I want to set the value of 
the sliders on the onchange event by setValueBy() functions. Once the 
values are set, button click event is called.
Now the problem is that the onChange function is called twice.My page is 
posted back twice and the due to which the performance to too slow. How 
can I solve this problem.

Regards,

Realize this is an old thread, but its one of few relevant results on 
google for onChange firing twice.

In my case, the control was getting initialized multiple times, and each 
initialization caused onChange to fire once more than before. Each init 
will cause an additional event to fire.

If the control needs to get initialized multiple times, store the object 
and manually dispose it before re-initing

var sldMatching = new Control.Slider(...);
// blah blah blah
sldMatching.dispose(); // prevents events from stacking up
sldMatching = new Control.Slider(...); // re-init on a clean slate

Hope this helps!

Deepesh wrote:
> Brian Campbell wrote:
>> On Thursday, February 22, 2007, at 12:35PM, "Michael Peters" 
>> <mpeters@plusthree.com> wrote:
>>>new() will return an object. Sometimes you don't need it. But in this case you do.
>>>
>>>> But, once it's initialized, what's the syntax to call the setValue() and setValueBy() functions?  Is it just Control.Slider.setValue()?  I have more than one slider on the page so i'm guessing there must be a way to differentiate?
>>>
>>>No, get the object back and then call it's setValue() and setValueBy() methods.
>>>
>>>var slider = new Control.Slider(...);
>>>slider.setValue(...);
>> 
>> Perfect!  Thanks Michael, that's exactly what i needed :)
> 
> Hello,
> 
> I am working on sliders . My problem is that I want to set the value of 
> the sliders on the onchange event by setValueBy() functions. Once the 
> values are set, button click event is called.
> Now the problem is that the onChange function is called twice.My page is 
> posted back twice and the due to which the performance to too slow. How 
> can I solve this problem.
> 
> Regards,