how to get range slider min max value in php variable?

Question

I have created a range slider with below code:

HTML:

  <input type="text" class="salary" id="salary" name="salary" style="border:0; color:#f6931f; font-weight:bold;" >
   <div id="slider-range"></div>

JS:

 <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.0.0/jquery.min.js"></script>
 <link rel="stylesheet" href="//code.jquery.com/ui/1.10.4/themes/smoothness/jquery-ui.css">
 <script src="//code.jquery.com/ui/1.10.4/jquery-ui.js"></script>

 <script>
 $(function() {

 $("#slider-range").slider({
  range: true,
  min: 0,
  max: 20000,
  values: [0, 3000],
  slide: function(event, ui) {
  $("#salary").val("Rs. " + ui.values[0] + " - Rs. " + ui.values[1]);
  },
  stop: function(event, ui) {
  $("#salary").submit();  
  var [min, max] = $("#slider-range").slider("option", "values");
  console.log(min);
  //alert(min);
  console.log(max);
  //alert(max);
  },

 });
});
</script>

I want to receive the value of "var [min, max]" which i am receiving now in console "console.log(max);" & "console.log(min);" in two different php variable.

like below i wnat to receive value from the above code on same page:

 <?php 
  $min_value = 
  $max_value =   
 ?>

Upon selection scroller value is getting submitted automatically.

you have not accepted any answers to any of your questions. please hit the check marks next to the answers that helped you solve your problems. you get rep points for doing so and it will help future readers solve their problems too. — I wrestled a bear once., Aug 31 '20 at 20:54

score 1 · Answer 1 · answered Aug 31 '20 at 17:53

You need to use the values option: $("#slider-range").slider("option", "values");

Example:

$(function() {

  $("#slider-range").slider({
    range: true,
    min: 0,
    max: 20000,
    values: [0, 3000],
    slide: function(event, ui) {
      $("#salary").val("Rs. " + ui.values[0] + " - Rs. " + ui.values[1]);
    }
  });
  
  $("#button").click(function(e){
    e.preventDefault();
    // get value
    var [min, max] = $("#slider-range").slider("option", "values");
    console.log(min, max);
  });
  
});

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.0.0/jquery.min.js"></script>
<link rel="stylesheet" href="//code.jquery.com/ui/1.10.4/themes/smoothness/jquery-ui.css">
<script src="//code.jquery.com/ui/1.10.4/jquery-ui.js"></script>

<form method="post">
  <input type="text" id="salary" name="salary" class="salary" style="border:0; color:#f6931f; font-weight:bold;">

  <div id="slider-range"></div>

  <button id=button>Get value</button>
</form>

Thanks for your help. But this wont work for me. I want console value in php without the submit button. As soon as range is set, i want to receive that value. — Raj Shekhar, Sep 01 '20 at 11:06
Then you need to use AJAX. I answered the question you asked. If you have another question make a new post. Please accept the answers people have given you on all your other questions. — I wrestled a bear once., Sep 01 '20 at 13:21
But my question itself says "Receive the value of range slider on same page without submit in php?" Thanks for your help. — Raj Shekhar, Sep 01 '20 at 13:27

how to get range slider min max value in php variable?

1 Answers1