Onchange窗體過濾器，帶下拉

我正在嘗試爲我創建的畫廊創建過濾器。畫廊有5個使用下拉菜單的過濾器。從5個過濾器中選擇一個項目時，必須過濾圖像。當選擇第二個過濾器時，必須過濾第一個過濾器的結果等等。Onchange窗體過濾器，帶下拉

我正在使用onchange='this.form.submit()'腳本，但我不知道如何在選擇某個項目時爲其分配某個操作。這是我在寫作的時刻代碼：

<td> 
    Kleur: 
    <form method="POST"> 
     <select name="kleur" onchange='this.form.submit()'> 
      <option> -- Geen optie -- </option> 
      <?php while ($line1 = mysqli_fetch_array($result1, MYSQLI_ASSOC)) { ?> 
       <option value="<?php echo $line1['kleur']; ?>"> <?php echo $line1['kleur']; ?> 
       </option> 
      <?php } ?> 
     </select> 
    </form> 

    <?php 
    if (isset($_POST['submit'])) { 
     $kleur = $_POST['kleur']; 
     $SQL = "SELECT * FROM `rozen` WHERE `kleur` LIKE '$kleur'"; 
     $result = mysqli_query($connection, $sql); 
     echo $result; 
    } 
    ?> 

    </br> 
</td>

下面的部分似乎不工作：

<?php 
if (isset($_POST['submit'])) { 
    $kleur = $_POST['kleur']; 
    $SQL = "SELECT * FROM `rozen` WHERE `kleur` LIKE '$kleur'"; 
    $result = mysqli_query($connection, $sql); 
    echo $result; 
} 
?>

有誰知道如何使用這個腳本？也許可以解釋如何將所選項目保存在下拉菜單中？

來源

2015-08-03 Arbeon

我想重新加載頁面對於每個過濾器動作它不是一個好主意......你需要綁定一個jQuery的更改事件到選擇，然後隱藏或顯示基於選擇的圖像..但你可以展示更多關於畫廊的東西？ – Vanojx1

@ Vanojx1 我工作的畫廊位於http://82.74.55.31/bbs/public/rozen.php – Arbeon

你可以用你需要過濾到您的圖像的所有信息添加屬性

<img filterInfo="Kleur|Geur|Bloemvorm|Gezondheid|Type|Zoeken">

然後設置一個類所有過濾趕上變化

$(".filters").on("change",function(){ 
    var kleur = $('[name=Kleur]').val(); 
    var Geur = $('[name=Geur]').val(); 
    ... 
    ... 
    ... 

    $.each($('#gallery img'),function(i,v){ 
     var attrs = $(v).attr("filterInfo").slice("|"); 
     if((kleur == "" || kleur == attrs[0]) && (Geur == "" || == attrs[1]) .... other filters) 
      $(this).show(); //or fadeIn(); 
     else 
      $(this).hide(); //or fadeOut(); 
    }); 
});

來源

2015-08-03 11:13:15 Vanojx1

我不知道如何在我的代碼中實現這一點，我得到了我的圖像數據從我的數據庫通過使用： $ query1 =「選擇kleur從rozen GROUP BY kleur」; \t $ result1 = mysqli_query（$ connection，$ query1）; – Arbeon

與你填充圖庫的代碼...你不需要任何其他調用該查詢...並沒有頁面重新加載...你不再需要你選擇的onchange事件...我的代碼檢查更改您的過濾器和循環槽圖像，並隱藏或顯示誰與過濾器匹配 – Vanojx1

Onchange窗體過濾器，帶下拉

回答

相關問題