2 working independent fields ?

Do not tell me how to do it? I tried to do it like this, but in the end, one field controls both values

var $range = $(".js-range-slider"),
    $input = $(".js-input"),
    instance,
    min = 0,
    max = 4000;

$range.ionRangeSlider({
    type: "single",
    min: min,
    max: max,
    from: 0,
    onStart: function (data) {
        $input.prop("value", data.from);
    },
    onChange: function (data) {
        $input.prop("value", data.from);
    }
});

instance = $range.data("ionRangeSlider");

$input.on("change keyup", function () {
    var val = $(this).prop("value");
    
    // validate
    if (val < min) {
        val = min;
    } else if (val > max) {
        val = max;
    }
    
    instance.update({
        from: val
    });
});

var $range = $(".js-range-slider-to"),
    $inputTo = $(".js-input-to"),
    instance,
    min = 0,
    max = 2000;

$range.ionRangeSlider({
    type: "single",
    min: min,
    max: max,
    from: 0,
    onStart: function (data) {
        $inputTo.prop("value", data.from);
    },
    onChange: function (data) {
        $inputTo.prop("value", data.from);
    }
});

instance = $range.data("ionRangeSlider");

$inputTo.on("change keyup", function () {
    var val = $(this).prop("value");
    
    // validate
    if (val < min) {
        val = min;
    } else if (val > max) {
        val = max;
    }
    
    instance.update({
        from: val
    });
});

[st1mset]

how it’s complicated) thanks, work)

[IonDen]

@st1mset, no. This is for both, you again rewriting vars. You should have different max and min: min_1, max_1, min_2, max_2