没有使用jquery和PHP的提交按钮,价格过滤器就无法工作


Price filter is not working without submit button using jquery and PHP

我尝试过各种解决方案,但如果我使用提交按钮,所有解决方案都能正常工作。但我需要一个解决方案——只使用jquery-submit将值传递给phpPOST/GET(方法)。提前谢谢。

 if(isset($_POST['submit']))
   {
    mysql_real_escape_string($_POST['amount']);
    $values = str_replace(' ','',$_POST['amount']);
    $values = str_replace('$','',$values);
    $values = explode('-',$values);
    $min = $values[0];
    $max = $values[1];
    $select_min_value = $_POST['select_min_value'];
    $select_max_value = $_POST['select_max_value'];
    $res = mysql_query('select id,name,image,price,discount from products where price BETWEEN "'.$select_min_value.'" AND "'.$select_max_value.'"');
    $count = mysql_num_rows($res);
    $HTML='';
    if($count > 0)
    {
    while($row=mysql_fetch_array($res))
    {
    code;
     }
     }
     else {
     $HTML ='no products';
    }}
    else{
    $min =0;
    $max=35000;
    $HTML='search products';
     }
    echo $HTMl;

我的javascript代码

<script>
     $(function () {
        $("#slider-range").slider({
            range: true,
            min: 0,
            max: 350000,
            values: [ <?php echo $min; ?>, <?php echo $max; ?> ],
            slide: function (event, ui) {
                $("#amount").val("$" + ui.values[ 0 ] + " - $" + ui.values[ 1 ]);
                var select_min_value = ui.values[ 0 ];
                var select_max_value = ui.values[ 1 ];
                $("#amount_txt").val(select_min_value + '-' + select_max_value);
                $("#filter_min_price").text("$" + select_min_value);
                $("#filter_max_price").text("$" + select_max_value);
            },
            change: function (event, ui) {
                var select_min_value = ui.values[ 0 ];
                var select_max_value = ui.values[ 1 ];
                 alert(select_min_value);
                alert(select_max_value);
            $('#filter_product').trigger('submit',['select_min_value','select_max_value']);
             }
        });
        $("#amount").val("$" + $("#slider-range").slider("values", 0) +
                " - $" + $("#slider-range").slider("values", 1));
    });
</script>

HTML表单

 <form action="filter.php" id="filter_product" name="filter_product" method="post" accept-charset="utf-8">
                   <div id="slider-range"></div>
                        <div class="range_cont clearfix">
                            <div  class="pull-left" id="filter_min_price">$<?php echo $min; ?></div>
                            <div  class="pull-right" id="filter_max_price">$<?php echo $max; ?></div>
                        </div>
                   <input type="hidden" name="submit" id="submit" />
                          </form>

如果提交按钮有一个name="submit",当使用提交按钮提交表单时,该字段也会随表单一起发送。如果您想通过JavaScript提交表单,则该字段不会随表单一同发送。因此,如果您在PHP中检查if(isset($_POST['submit'])){,那么您要么需要修改PHP逻辑,以检测通过JavaScript以某种方式提交的表单。根据您的需要,有几个选项是修改JavaScript,在表单中插入一个名为"submit"的隐藏字段,或者您可以修改PHP,检查用于提交表单的HTTP请求方法。因此,您可以将条件调整为:
if ($_SERVER['REQUEST_METHOD'] === 'POST'){您还可以检查希望与表单一起提交的字段,就像您的代码希望$_POST['amount']存在一样,因此您可以调整if语句以检查它是否存在:
if(isset($_POST['amount'])){
您使用的是个人偏好,但我更喜欢后者,以确保在我希望它们存在之前设置好我需要的所有字段,以防止有人在没有所需字段的情况下伪造请求时出错。

编辑:不管提交按钮与否,听起来你的代码一开始就不起作用。你需要将你需要的所有帖子数据添加到表单中。因此,你需要添加:

    <input type="hidden" id="select_min" name="select_min" value="<?php echo $min; ?>">
    <input type="hidden" id="select_max" name="select_max" value="<?php echo $min; ?>">

接下来,你需要调整你的JavaScript,这样当你改变滑块时,你就会更新隐藏的字段:

    change: function (event, ui) {
        var select_min_value = ui.values[ 0 ];
        var select_max_value = ui.values[ 1 ];
        $('#select_min').val(select_min_value);
        $('#select_max').val(select_max_value);
        $('#filter_product').trigger('submit',['select_min_value','select_max_value']);
     }

在那之后,你可能还需要做一些调整。尝试在页面顶部添加:print_r($_POST);,以确保邮件数据正确发送。从那时起,做出最终调整应该很容易。

作为最后一点,mysql_*函数被折旧。在编写新代码时切换到mysqli或pdo。

编辑2:

如果您的表单中有一个名为"submit"的元素,逻辑$('#filter_product').trigger('submit',['select_min_value','select_max_value']);将不会提交表单,因为myForm.submit()会出错,因为它引用了表单的"提交"元素,因此您不能像这样提交表单。因此,如果您从表单中删除这样的元素,那么myForm.submit将引用函数而不是元素,您可以像这样动态提交表单。使用jQuery的触发器在表单上提交也是如此。

一旦你从表单中删除了这个元素,JavaScript应该会成功提交表单,并且你必须调整你的PHP以适应没有这个元素的情况。

但是,如果删除"提交"元素不是一个选项,您可以通过另一种方式获得提交功能:

document.createElement('form').submit.call(document.getElementById('filter_product'));