Custom Range/Variable Set with jQuery UI Slider

I wanted to see if I could make a custom data set to use with jQuery UI Slider. I'm working on a site that has dress sizes that come in the range of: [ 0, 2, 4, 6, 8, 10, 12, 14, 16, 18, 16W, 18W, 20W ]

The issue I'm having arises right after 18, when it jumps to "wide" sizes that are a bit unique.

Before I added in the 16W, 18W, and on sizes, I created a working slider using the following code:

$("#slider-size .slider").slider({
  min: 0,
  max: 18,
  step: 2,
  slide: function(event, ui) {
    $(".rsize").text(ui.value);
  }
});

The last argument in that function changes a text value when the slider is changed.

Does anyone know how to go about adding in the 16W, 18W, etc to the end of this list?

Thanks!

Answers


for custom sizes, you may use another array for your labels:

var sizes = ["0","2","4","6","8","10","12","14","16","18","16W","18W","20W"];
$("#slider-size .slider").slider({
  min: 0,
  max: sizes.length - 1,
  step: 1,
  slide: function(event, ui) {
    $(".rsize").text(sizes[ui.value]);
  }
});

Now, to add or remove sizes, just modify the sizes array.


demo

$("#slider-size .slider").slider({
  min: 0,
  max: 24, // max is 24
  step: 2,
  slide: function(event, ui) {
    var s = ui.value;
    switch(ui.value) {
       case 20:
         s = '16W';
         break;
       case 22:
         s = '18W';
         break;
       case 24:
         s = '12W';
         break;
    }
    $(".rsize").text(s);
  }
});

----- or ------

demo

$("#slider-size .slider").slider({
  min: 0,
  max: 24, // max is 24
  step: 2,
  slide: function(event, ui) {
      $(".rsize").text((ui.value >18)?(ui.value-4)+'W':ui.value);
  }
});‚Äč

Need Your Help

C# WebApi Unit Testing and Mocking Controllers

c# unit-testing asp.net-web-api moq xunit

I am working on this WebAPI project and I need to create unit tests for it. The base of the project was created using VS 2010 , and then an WebApi Module was added.

Diagnosing Memory Leaks - Allowed memory size of # bytes exhausted

php memory-leaks

I've encountered the dreaded error-message, possibly through-painstaking effort, PHP has run out of memory: