Loading ...
Sorry, an error occurred while loading the content.
 

Unknown Number of Sliders

Expand Messages
  • henrdm
    I need to create multiple sliders - one for each element of an array. How can I loop through an array, creating an instance each time? I m having trouble
    Message 1 of 3 , Apr 29, 2009
      I need to create multiple sliders - one for each element of an array. How can I loop through an array, creating an instance each time? I'm having trouble working with dynamic variable names, I guess. I've tried a slider array [i.e., var slider(i) = ...], using an object approach (which I'm not familiar with), and the dreaded eval('slider' + i) approach. Haven't gotten anything to work.

      I've gotten multiple sliders to work using a scheme like this:

      <div id="bg1">
      <div id="thumb1"><img src="thumb_image.gif"></div>
      </div>

      <div id="bg2">
      <div id="thumb2"><img src="thumb_image.gif"></div>
      </div>

      <script type="text/javascript">
      (function () {

      var slider1 = YAHOO.widget.Slider.getHorizSlider('bg1','thumb1',0,200);
      var slider2 = YAHOO.widget.Slider.getHorizSlider('bg2','thumb2',0,200);

      slider1.subscribe("change", function(offsetFromStart) {

      var valnode = Dom.get(valuearea1);
      var fld = Dom.get(textfield1);

      // Display the pixel value of the control
      valnode.innerHTML = offsetFromStart;

      // use the scale factor to convert the pixel offset into a real value
      var actualValue = slider1.getRealValue();

      // update the text box with the actual value
      fld.value = actualValue;

      // Update the title attribute on the background. This helps assistive
      // technology to communicate the state change
      Dom.get(bg).title = "slider value = " + actualValue;

      });

      (etc.)

      })()
      </script>

      But since I don't know the number of sliders in advance, this won't work in general.

      Thanks for any suggestions.
    • Brian McCullough
      ... Does the array change size dynamically, or is the whole page being fed from the server? If the latter, you might want to have the server build the JS
      Message 2 of 3 , Apr 29, 2009
        On Wed, Apr 29, 2009 at 06:45:12PM -0000, henrdm wrote:
        > I need to create multiple sliders - one for each element of an array. How can I loop through an array, creating an instance each time? I'm having trouble working with dynamic variable names, I guess. I've tried a slider array [i.e., var slider(i) = ...], using an object approach (which I'm not familiar with), and the dreaded eval('slider' + i) approach. Haven't gotten anything to work.

        Does the array change size dynamically, or is the whole page being
        fed from the server? If the latter, you might want to have the server
        build the JS according to the data and then look at Caridy's
        Dispatcher. It will separate the HTML, CSS ( if any ), and JS, and put
        each in the right place.


        Brian
      • henrdm
        Excellent, Brian. I m new to javascript altogether - not just YUI - but I think I get the gist of your idea. I just have to figure out this dispatcher thing
        Message 3 of 3 , Apr 29, 2009
          Excellent, Brian. I'm new to javascript altogether - not just YUI - but I think I get the gist of your idea. I just have to figure out this dispatcher thing now.

          Thanks for the pointer.

          --- In ydn-javascript@yahoogroups.com, Brian McCullough <bdmc@...> wrote:
          >

          > Does the array change size dynamically, or is the whole page being
          > fed from the server? If the latter, you might want to have the server
          > build the JS according to the data and then look at Caridy's
          > Dispatcher. It will separate the HTML, CSS ( if any ), and JS, and put
          > each in the right place.
          >
          >
          > Brian
          >
        Your message has been successfully submitted and would be delivered to recipients shortly.