0.0.76 upd range-slider

This commit is contained in:
2023-08-07 16:09:48 +03:00
parent 6b8511da3d
commit 712287785a
2 changed files with 49 additions and 12 deletions

View File

@@ -229,16 +229,48 @@ function onblurInputField(event,el){
// }
function sliderInit() {
$('#id_weight').ionRangeSlider({
skin: "round",
type: "single",
min: 0,
max: 1000,
from: 0,
step: 1,
grid: true,
grid_num: 5,
});
let $range = $("#id_weight"),
$input = $(".js-input"),
instance,
min = 0,
max = 1000,
start_value = document.querySelector(".range-slider")
$range.ionRangeSlider({
skin: "round",
type: "single",
min: min,
max: max,
from: start_value,
step: 1,
grid: true,
grid_num: 5,
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() {
let val = $(this).prop("value");
// validate
if (val < min) {
val = min;
} else if (val > max) {
val = max;
}
instance.update({
from: val
});
});
}

View File

@@ -208,6 +208,10 @@
<hr>
<div class="extra-controls">
<input type="text" class="js-input" value="0" />
</div>
<div class="range-slider">
<label for="id_weight">{{ form.fields.weight.label }}</label>
<input
@@ -215,8 +219,9 @@
id="id_weight"
{% if form.fields.weight.required %} required{% endif %}
name="weight"
value=""
{% if form.initial.weight %}value="{{ form.initial.weight }}"{% endif %}
{% if form.initial.weight %}
value="{{ form.initial.weight }}"
{% endif %}
/>
{% if not errors_off and form.errors and form.errors.weight %}
<span>{{ form.errors.weight }}</span>