Изменить положение ползунка jquery путем изменения ввода (keyup)

Question

Я пытаюсь изменить положение ползунка jQuery не путем скольжения, а путем изменения ввода:

Посмотрите на мой код:

Ввод HTML-ползунка

<input class="range-slider-single" type="text" id="width_range" data-slider-min="350" data-slider-max="6260" data-slider-step="1" data-slider-value="850" data-value="850" value="850">

Ввод HTML

<input type="text" id="width" class="form-control text-center" value="850">

JS / jQuery

Для вызова ползунка

$(".range-slider-single").slider();

$(".range-slider").slider({
    formatter: function(value) {
        return currencyAttr + ThousandSeparator(parseInt(value[0])) + " - " + currencyAttr + ThousandSeparator(parseInt(value[1]));
    }
});

Изменение ввода с помощью ползунка:

$("#width_range").on("slide, change", function(slideEvt) {
     $("#width").val(slideEvt.value.newValue);
});

И для изменения ползунка с помощью ввода

$("#width").keyup(function() {
     $("#width_range").slider("value" , $(this).val())
});

Однако на последнем шаге я получаю ошибку "" нет такого метода "значение" для экземпляра ползунка "" из bootstrap-slider.min.js: 4

Кажется, что я не могу изменить значение ползунка через вход, потому что (возможно) я использовал атрибуты, чтобы определить минимальное и максимальное значение ??

Answer 1

Нашел решение.

Я звонил ползунку перед раздачей.

Код обновлен:

$("#width_range").on("slide, change", function(slideEvt) {
   $("#width").val(slideEvt.value.newValue);
});
$("#height_range").on("slide, change", function(slideEvt) {
    $("#height").val(slideEvt.value.newValue);
});

$('#width').on('input', function() {
    width_range.slider('setValue', $(this).val())
});
$('#height').on('input', function() {
    height_range.slider('setValue', $(this).val())
});