显示用户选择

Displaying the user selection

本文关键字:选择 用户 显示      更新时间:2023-09-26

我在php搜索表单中添加了一个价格范围滑块,它使用Prototype。这是表单代码:

<input type="text" name="pmin" id="pmin" value="0" onkeypress="return isNumberKey(event)"
/>
<input type="text" name="pmax" id="pmax" value="500" onkeypress="return isNumberKey(event)"
/>
<div id="price-range" class="filter-track"> <span id="pminx" class="filter-handle" title="Scroll to set minimum value"></span>
    <span
    id="pmaxx" class="filter-handle" title="Scroll to set maximum value"></span>
</div>

以下是处理滑块的javascript代码:

<script>
    var loadPriceSlider = function () {
        var handles = [$('pminx'), $('pmaxx')];
        // horizontal slider control with preset values
        priceRange = new Control.Slider(handles, 'price-range', {
            range: $R(0, 500, false),
            sliderValue: [0, 500],
            values: [0, 10, 20, 30, 40, 50, 60, 70, 80, 90, 100, 110, 120, 130, 140, 150, 160, 170, 180, 190, 200, 210, 220, 230, 240, 250, 260, 270, 280, 290, 300, 310, 320, 330, 340, 350, 360, 370, 380, 390, 400, 410, 420, 430, 440, 450, 460, 470, 480, 490, 500],
            restricted: true,
            onSlide: function (v) {
                $('pmin').value = ((v[0] != null) ? v[0] : 0);
                $('pmax').value = ((v[1] != null) ? v[1] : 0);
            },
            onChange: function (v) {
                if (v.length > 0) {
                    $('pmin').value = ((v[0] != null) ? v[0] : 0);
                    $('pmax').value = ((v[1] != null) ? v[1] : 0);
                }
            }
        });
    };
    loadPriceSlider();
</script>

我需要在搜索结果页面中显示用户所做的选择。目前该表单可以工作,如果用户在此价格滑块上进行一些选择,则会显示正确的结果,但输入显示的最小值和最大值分别为0和500,即默认值。

要在jquery中赋值,应该像一样使用

$('#pmin').val((v[0] != null) ? v[0] : 0));
$('#pmax').val((v[1] != null) ? v[1] : 0));

我不知道你在用什么插件。但如果它有default选项或initial value选项,则可以从php传递默认值。。。类似的东西

priceRange = new Control.Slider(handles, 'price-range', {
        range: $R(0, 500, false),
   ---> default: [<?php echo $min; ?>, <?php echo $max; ?>], // or initial or something
        sliderValue: [0, 500],

并从php控制$min和$max。因此,在提交搜索后,您将把以前的值传递给JS插件。

希望这能帮助