NoUislider отображающий массив строк - PullRequest
Новая
       21

NoUislider отображающий массив строк

0 голосов
/ 26 сентября 2019

У меня есть калькулятор цен и мне нужны строковые значения из двухточечного nouislider, который я использую.Например, мой массив будет [«Уровень один», «Уровень два», «Уровень три»] и 1,2,3 на ползунке будет соответствовать этим значениям до 60. Мне нужно положить в массив и иметьдвухточечный ползунок коррелирует.Значения, необходимые для расчета сценария цены, по скрытым значениям в тегах HTML-формы. 


$(document).ready(function() {
  $('.noUi-handle').on('click', function() {
    $(this).width(50);
  });
  var rangeSlider = document.getElementById('slider-range');
  var moneyFormat = wNumb({

  });
  noUiSlider.create(rangeSlider, {
    start: [1, 60],
    step: 1,
    range: {
      'min': [1],
      'max': [60]
    },
    format: moneyFormat,
    connect: true
  });

  // Set visual min and max values and also update value hidden form inputs
  rangeSlider.noUiSlider.on('update', function(values, handle) {
    document.getElementById('slider-range-value1').innerHTML = values[0];
    document.getElementById('slider-range-value2').innerHTML = values[1];
    document.getElementsByName('min-value').value = moneyFormat.from(
      values[0]);
    document.getElementsByName('max-value').value = moneyFormat.from(
      values[1]);
  });
});

<div class="container">
  <div class="row">
    <div class="col-sm-12">
      <div id="slider-range"></div>
    </div>
  </div>
  <div class="row slider-labels">
    <div class="col-xs-6 caption">
      <strong>Min:</strong> <span id="slider-range-value1"></span>
    </div>
    <div class="col-xs-6 text-right caption">
      <strong>Max:</strong> <span id="slider-range-value2"></span>
    </div>
  </div>
  <div class="row">
    <div class="col-sm-12">
      <form>
        <input type="hidden" name="min-value" value="">
        <input type="hidden" name="max-value" value="">
      </form>
    </div>
  </div>
</div>

Я не знаю, как поместить массив и отобразить его.

...