0.0.76 upd range-slider

2023-08-07 16:09:48 +03:00
parent 6b8511da3d
commit 712287785a
2 changed files with 49 additions and 12 deletions
--- a/static/js/user_profile.js
+++ b/static/js/user_profile.js
@@ -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
+        });
+    });
+

 }