Как выбрать обратный диапазон в слайдере Bootstrap range?

Question

Я использую Ползунок диапазона начальной загрузки У меня есть 2 вопроса, где я полностью застрял.

Мой вопрос заключается в том, как выбрать реверсивный диапазон, как у меня есть ползунок со значениямиОт 1 до 10, затем я должен выбрать от 9 до 3, как я могу это сделать?

Здесь у меня есть ползунок с диапазоном месяцевя хочу выбрать как oct - feb как я могу это сделать ???

И еще вопрос, как я могу добавить метки моих двух ручек?

Здесьмой HTML-код,

<input id="ex1" type="hidden" data-clear-delay="true" data-provide="slider" data-slider-selection="none" data-slider-value="[0,100]" data-slider-ticks="[1,2,3,4,5,6,7,8,9,10,11,12]" data-slider-ticks-labels='["Jan","Feb","Mar","Apr","May","Jun","Jul","Aug","Sep","Oct","Nov","Dec"]' data-slider-ticks-positions="[0, 9.09, 18.18, 27.27, 36.36, 45.45, 54.54, 63.63, 72.72, 81.81, 90.90, 100]" data-val="true" name="prefered_travel_period" value="" />

, а javascript,

jQuery(function($) {
  $('#ex1').slider({
    formatter: function(value) {
        return ;
    },
    id: "slider12c",
    labelledby:["min","max"]
 });
});

Пожалуйста, помогите мне из этого, спасибо заранее.

Answer 1

Для поддержки выбора диапазонов месяцев в течение нового года вы можете просто сделать ползунок по двум общим годам, вместо того, чтобы просто охватывать диапазон месяцев только по одному общему году.

Например:

<input id="ex1" type="hidden" data-clear-delay="true" data-provide="slider" data-slider-selection="none" data-slider-value="[0,100]" data-slider-ticks="[1,2,3,4,5,6,7,8,9,10,11,12,13,14,15,16,17,18,19,20,21,22,23,24]" data-slider-ticks-labels='["Jan","Feb","Mar","Apr","May","Jun","Jul","Aug","Sep","Oct","Nov","Dec","Jan2","Feb2","Mar2","Apr2","May2","Jun2","Jul2","Aug2","Sep2","Oct2","Nov2","Dec2"]' data-slider-ticks-positions="[0, 4.34, 8.69, 13.04, 17.39, 21.73, 26.08, 30.43, 34.78, 39.13, 43.47, 47.82, 52.17, 56.52, 60.86, 65.21, 69.56, 73.91, 78.26, 82.60, 86.95, 91.30, 95.65, 100]" data-val="true" name="prefered_travel_period" value="" />

Это всегда точка зрения, которая является "интуитивной", но я думаю, что это лучше, чем любая обратная концепция, например, типа "пожалуйста, выберите месяцы, которые вы НЕ хотите использовать".

Answer 2

У вас есть: data-slider-ticks и data-slider-ticks-labels

Если вы хотите отобразить только январь - июнь. Вам нужно изменить это на:

• data-slider-ticks="[1,2,3,4,5,6]"

• data-slider-ticks-labels='["Jan","Feb","Mar","Apr","May","Jun"]'