如果没有使用jquery和PHP的提交按钮，价格过滤器无法正常工作

Question

I have tried various solutions but all are working if i used with submit button. But I need a solution- passing value to php POST/GET(method) with jquery submit only. Thanks in advance.

 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;

My javascript code

<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

 <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>

Answer 1

If the submit button has a name="submit", when the form is submit with the submit button, this field is also sent with the form. If you'd like to submit the form via JavaScript, then this field will not be sent along with the form. So if you're checking for if(isset($_POST['submit'])){ in PHP, then you'll either need to revise your PHP logic to detect the form being submit via JavaScript in some manner. A few options, depending on your needs, would be to revise your JavaScript to insert a hidden field into the form with the name "submit" or you can revise your PHP to check for the HTTP Request method used to submit the form. Thus you'd adjust your condition to:
if ($_SERVER['REQUEST_METHOD'] === 'POST'){ you can also check for fields you're expecting to be submit with the form, like your code expects $_POST['amount'] to exist, so you could adjust your if-statement to check that it exists:
if(isset($_POST['amount'])){
Which you use is personal preference, I prefer the latter though to make sure all the fields I need are set before I expect them to exist in order to prevent errors if someone forged a request without the required field.

Edit: it sounds like your code never worked in the first place, submit button or not. You'll need to add all the post data you need to the form. Thus, you'll need to add:

    <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; ?>">

Next, you'll need to adjust your JavaScript, so when you change the slider, that you update the hidden fields:

    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']);

     }

You'll also need to make a few adjusts after that probably. Try adding: print_r($_POST); to the top of your page to make sure the post data is getting sent properly. From there, it should be easy sailing to make final adjustments.

As a final point, the mysql_* functions are depreciated. Switch over to mysqli or pdo when writing new code.

Edit 2:

The logic $('#filter_product').trigger('submit',['select_min_value','select_max_value']); will not submit the form if your form has an element named "submit" in it, since then myForm.submit() will error since it's a reference to the form's "submit" element, and thus you cannot submit the form like this. So if you remove such an element from your form, then myForm.submit will reference the function rather than the element, and you can submit the form dynamically like this. The same goes for using jQuery's trigger with submit on the form.

Once you remove this element from your form, JavaScript should submit the form successfully, and you'll have to adjust your PHP for the absence of the element.

But if removing the "submit" element is not an option, you can get the submit function in another manner:

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