I can not read values from price range slider when sliding
<p>HOW I READ minValue&amp; maxValue</p>

<pre><code>&lt;link rel="stylesheet" href="&lt;?=base_url()?&gt;javascripts/slider/jquery.ui.all.css"&gt;
&lt;script src="&lt;?=base_url()?&gt;javascripts/slider/jquery-1.7.1.js"&gt;&lt;/script&gt;
&lt;script src="&lt;?=base_url()?&gt;javascripts/slider/jquery.ui.widget.js"&gt;&lt;/script&gt;
&lt;script src="&lt;?=base_url()?&gt;javascripts/slider/jquery.ui.mouse.js"&gt;&lt;/script&gt;
&lt;script src="&lt;?=base_url()?&gt;javascripts/slider/jquery.ui.slider.js"&gt;&lt;/script&gt;
&lt;form name="formList" id="formList" method="POST" action="&lt;?php echo site_url();?&gt;/hotels/search" enctype="multipart/form-data"&gt;
&lt;script&gt;
$(function() {
    $( "#slider-range" ).slider({
        range: true,
        min: 0,
        max: 1000,
        values: [ 100, 1000 ],
        slide: function( event, ui ) {
            $( "#amount" ).val( "$" + ui.values[ 0 ] + " - $" + ui.values[ 1 ] );
        }
    });
    $( "#amount" ).val( "$" + $( "#slider-range" ).slider( "values", 0 ) +
        " - $" + $( "#slider-range" ).slider( "values", 1 ) );

        $( "#minValue" ).val( ui.values[ 0 ] );
        $( "#maxValue" ).val( ui.values[ 1 ] );
});
&lt;/script&gt;




&lt;div class="left" id="leftSlider"&gt;
            &lt;label for="amount"&gt;Price range:&lt;/label&gt;
            &lt;input type="text" id="amount" style="border:0; color:#f6931f; font-weight:bold;" /&gt;
           &lt;!-- &lt;div id="range"&gt;Price Range &lt;span id="amount"&gt;&lt;/span&gt;&lt;/div&gt;
           &lt;div id="slider"&gt;&lt;/div&gt;--&gt;
            &lt;div id="slider-range"&gt;&lt;/div&gt;  
</code></pre>
