選項選擇無需重新加載頁面即可獲取值

Question

我想使用選擇選項對頁面內容進行排序，但如何防止重新加載頁面？

我知道它不能在 PHP 中完成，所以我需要幫助，如何在 javascript 或 ajax 中執行此操作。

這是我的代碼

<select name="quantity">
   <option value="1"></option>
   <option value="2"></option>
</select>

 <?php
    $redirect_url = "example.com/process.php?&quantity=" . $_POST['quantity'];
    header("Location: " . $redirect_url);
?>

更新

這是我想要排序的代碼：

$sql = '';

                            if(isset($_POST['search'])){
                                $search = sanitize($_POST['search']);
                                $cat = sanitize($_POST['category']);

                                if(!empty($search)){
                                    $search_query = mysql_query("SELECT * FROM products WHERE `product_name` LIKE '%$search%' OR `category` LIKE '%$cat%'".$sql);

                                    while ($results_row = mysql_fetch_assoc($search_query)){
                                            echo '<div class="product"><a href="product.php?id='.$results_row['id'].'"><img style="border:1px solid black;" src="'.$results_row['img_path'].'/'.$results_row['img_name'].'" width="230px" height="230px"/></a><br><div class="br"></div><strong>'.$results_row['product_name'].'</strong><br>Cijena: '.$results_row['price'].'kn</div>';
                                        }
                                }
                            }else{

                            }

我是這樣排序的：

$sql = '';

            if(isset($_GET['sort'])){
                if ($_GET['sort'] == 'year')
                {
                    $sql = " ORDER BY year";
                }
                elseif ($_GET['sort'] == 'IMDBrating')
                {
                    $sql = " ORDER BY IMDBrating";
                }
                elseif ($_GET['sort'] == 'userrating')
                {
                    $sql = " ORDER BY userrating";
                } 
            }

        ?>

            <th><a href="http://localhost/New folder (3)/index.php?sort=year">Year</a></th>
            <th><a href="http://localhost/New folder (3)/index.php?sort=IMDBrating">IMDB rating</a></th>
            <th><a href="http://localhost/New folder (3)/index.php?sort=userrating">user rating</a></th>

但我想用<select><option> not with `

Answer 1

沒有通過sort my page content with select option清除您想要的sort my page content with select option ，但是對於重新加載功能，請為此使用jQuery ajax 。

html

<select name="quantity" id="quantity">
 <option value="1"></option>
 <option value="2"></option>
</select>

JS

<script>
$(function(){
  $('#quantity').change(function(){
    var value = $(this).val();
    $.ajax({
     type: "POST",
     url: "example.com/process.php", // url to request
     data: { 
      quantity: value  // send data
     },
     success : function(data){
       // populate data here
     }
    });
  });
});
</script>

進程.php

$quantity = $_POST['quantity'];
echo $quantity // this value will available in success callback function

Answer 2

您可以在事件發生時對其進行排序，例如：

 document.getElementsByName('quantity').onclick=function(){

//then put here what you want to be executed
}

那么整個頁面將不會被重新加載。只會運行那段代碼。