Добавить диапазон цен с jQuery и php

Question

Я хочу добавить jQuery диапазон цен, но когда я его добавляю, он всегда пуст. Я включил все классы, попробовал учебники и до сих пор не появился.

Вот один из учебников, которые я пробовал ссылка

Это выглядит так когда я выкладываю коды на свою страницу

img

Вот мои занятия:

 <link rel="stylesheet"
       href="https://code.jquery.com/ui/1.10.3/themes/smoothness/jquery-ui.css" />

<script src="https://code.jquery.com/jquery-1.12.4.js"></script>
<script src="https://code.jquery.com/ui/1.12.1/jquery-ui.js"></script>

Код слайдера

 <div class="form-price-range-filter">
    <form method="post" action="">
        <div>
            <input type="" id="min" name="min_price"
                value="<?php echo $min; ?>">
            <div id="slider-range"></div>
            <input type="" id="max" name="max_price"
                value="<?php echo $max; ?>">
        </div>
        <div>
            <input type="submit" name="submit_range"
                value="Filter Product" class="btn-submit">
        </div>
    </form>
</div>

jQuery код

<script type="text/javascript">

  $(function() {
    $( "#slider-range" ).slider({
      range: true,
      min: 0,
      max: 1000,
      values: [ <?php echo $min; ?>, <?php echo $max; ?> ],
      slide: function( event, ui ) {
        $( "#amount" ).html( "$" + ui.values[ 0 ] + " - $" + ui.values[ 1 ] );
        $( "#min" ).val(ui.values[ 0 ]);
        $( "#max" ).val(ui.values[ 1 ]);
      }
      });
    $( "#amount" ).html( "$" + $( "#slider-range" ).slider( "values", 0 ) +
     " - $" + $( "#slider-range" ).slider( "values", 1 ) );
  });
  </script>

Может кто-нибудь сказать мне, что не так? Я попробовал по крайней мере 10 учебных пособий, прежде чем публиковать здесь - все имеют одинаковый результат со мной