Pretty straightforward. This is my very inefficient code:

var slider1 = new Slider("#survey1", {
    precision: 2,
    value: 5
})
var slider2 = new Slider("#survey2", {
    precision: 2,
    value: 5
})
var slider3 = new Slider("#survey3", {
    precision: 2,
    value: 5
})
var slider4 = new Slider("#survey4", {
    precision: 2,
    value: 5
})
var slider5 = new Slider("#survey5", {
    precision: 2,
    value: 5
})

I'm sure this can be made way more efficiently, It should go up to "#survey13" but I skipped the rest to save space. Maybe a for loop? How could I add the counter to the name of the variable and referenced id?

Pretty straightforward. This is my very inefficient code:

var slider1 = new Slider("#survey1", {
    precision: 2,
    value: 5
})
var slider2 = new Slider("#survey2", {
    precision: 2,
    value: 5
})
var slider3 = new Slider("#survey3", {
    precision: 2,
    value: 5
})
var slider4 = new Slider("#survey4", {
    precision: 2,
    value: 5
})
var slider5 = new Slider("#survey5", {
    precision: 2,
    value: 5
})

I'm sure this can be made way more efficiently, It should go up to "#survey13" but I skipped the rest to save space. Maybe a for loop? How could I add the counter to the name of the variable and referenced id?

• javascript

5 Answers 5

You can say like bellow

var sliders = []
for (var i = 1; i <= 13; i++) {
    var slider = new Slider("#survey" + i, {
        precision: 2,
        value: 5
    });
    sliders.push(slider);
}

So actually your slider1 is sliders[0] and slider2 is sliders[1] and so on.

You can use for loop to create a slider with the each item. You can add the slider instance in the array and use it later.

var options = {
    precision: 2,
    value: 5
};
var slider = [];

for (var i = 1; i <= 13; i++) {
    slider.push(new Slider("#survey" + i, options));
}

If the plugin support multiple selectors

var slider = new Slider("#survey1, #survey2, #survey3 ...", {
    precision: 2,
    value: 5
});

Another way would be assigning a common class to all the elements and using this class to assign slider. As said above, this depends on the definition of Slider.

var slider = new Slider(".slider", {
    precision: 2,
    value: 5
});

Try with array:

var sliders = [];
var cfg = {
   precision: 2,
   value: 5
};
for (var i = 1; 13 >= i; i++)
   sliders[i] = new Slider("#survey" + i, cfg);

If you wish to have named variables then go for object:

var sliders = {};
var cfg = {
   precision: 2,
   value: 5
};
for (var i = 1; 13 >= i; i++)
   sliders['survey' + i] = new Slider("#survey" + i, cfg);

Better than an array, as the others suggested, is to use an object:

var id = 'survey',
    sliders = {},
    i = 13;

do {
  sliders[id + i] = new Slider('#' + id + i, {
    precision: 2,
    value: 5
  });
} while(i--);

Then you can use the object you've created: sliders.survey1, sliders.survey2 etc!

you can not change referenced id but you can create it with php before load page

<?php
$i=0;
for($i;$i<n;$i++)
{
 echo 'var slider = new Slider("#survey'+$i+'", {
precision: 2,
value: 5
})';}
?>