Using Multiple Sliders

2 posts, 0 answers
  1. kevlingo
    kevlingo avatar
    7 posts
    Member since:
    Sep 2006

    Posted 02 Nov 2007 Link to this post


    I am using multiple sliders on a page. They are used to distribute a value to multiple factors. Here's an example:

    Lets say we have a value of 100. There are 4 sliders which are used to distribute that value between 4 factors. By default, the first factor is assigned 75%, the second factor is 25%, the other 2 are assigned 0%.

    As the first factor is decreased, the other 3 will increase evenly. i.e. the first factor is decreased 3%, factor 2 will increase to 26% and the other 2 will increase to 1% each.

    The final requirement is that each factor can be locked to the value currently assigned to it. Lets say in the previous example, factors 3 and 4 were locked at 0%. The result would be factor 1 would be at 72% and factor 2 would be 28%.

    I've been playing with some javascript to implement this functionality, but my javascript skills are newbie at best...=)

    The immediate problem I'm having is issues with recursion. I am trapping the onvaluechanged event so I can update the other sliders to their new values. I thought I could use a global variable that indicates the value is changing as the result of another slider moving, but it's not enough (apparently).

    As I move one slider, all the sliders (including the one I'm moving) take on a life their own. While it's cool to look at, it's not really what I'm after...=)

    Instead of redoing all the js code to address this problem, I thought I would post here to see if there are better ways of implementing this.

    Any help would be greatly appreciated.

  2. Sophy
    Sophy avatar
    636 posts

    Posted 06 Nov 2007 Link to this post

    Hello Kevlingo,

    Excuse us for the delayed reply.

    I prepared an example which demonstrates the desired scenario.  Please, find the example attached.

    Don't hesitate to contact us if you have other questions.

    All the best,
    the Telerik team

    Instantly find answers to your questions at the new Telerik Support Center
  3. DevCraft R3 2016 release webinar banner
Back to Top