jqueryUI Slider：设置DB范围内的最小值和最大值

问题描述：

I have a jQueryUI slider on my website that deals with price range.

I have a products table in mysql that has various entries.

I am using the slider to filter the results, but I need to set the minimum and maximum prices from the records in my database.

Should I just generate (with php) hidden fields in my html that contain the minimum and maximum and then use jQuery to obtain them? Or is there a better way of achieving this, maybe using AJAX?

Thanks

我的网站上有一个jQueryUI滑块，用于处理价格范围。 p>

我在mysql中有一个包含各种条目的产品表。 p>

我使用滑块来过滤结果，但我需要设置数据库中记录的最小和最大价格。 p>

我是否应该在我的html中生成（使用php）隐藏字段，其中包含最小值和最大值，然后使用jQuery获取它们？或者有更好的方法来实现这一点，也许使用AJAX？ p>

谢谢 p> div>

答

Either of the ways you have described would get the job done, I would probably go for the hidden fields.

Another option might be to have your php put the values into your javascript file directly.

you just need to change the header in your php file to get the output to be read as javascript by the browser.

this would do it.

Header("content-type: application/x-javascript");

you can the set the values right in the javascript via your php (as in any other php file).

Include it on your page as you would any other javascript file and job done, its simple and dynamic. :)

答

If you care about accessibility, the safest way would be to provide the form element, then hide it with Javascript so users without javascript can still use your website. You can then add an AJAX update function.

If the page is dynamic, you should use the form.

答

Get our results using a php script and output it as JSON, like this:

<?php

$sql = 'SELECT MAX(price) as max, MIN(price) as min FROM products';

// .. do query, get row ...

echo(json_encode(array(
    "max"=>$max,
    "min"=>$min
)));

?>

then use $.getJSON or $.ajax (jQuery) to get the results and use them in your slider like this:

<script type="text/javascript">
$(document).ready(function() {
    var max, min;
    $.ajax({
        url: "script.php",
        dataType: "json",
        async: false,
        success: function(data) {
            data = data[0];
            max = data.max;
            min = data.min;
        }
    });

    $.slider({
        max: max,
        min: min
    });
});
</script>

this is quickly written and untested, but i hope your get the all around idea ;)

jqueryUI Slider：设置DB范围内的最小值和最大值

相关推荐