2017-07-13 11 views
0

私は結果のリストを返すPHPサイトに検索結果ページを持っています。検索結果ページにフィルタオプションを追加する必要があります。これにより、ユーザーは一部の選択メニューの検索結果をさらに絞り込むことができます。検索結果のURLは次のようになります。選択メニューからHTTP GETリクエストを更新してください。変更

findProducts.php?action=searchAssets&orderNumber=xxxx&productName=zzz 

検索フォームページのGETリクエストからURLが検索されます。

私はこのような選択メニューを使用して、いくつかのフィルタを追加しました:

<div class="panel panel-primary"> 
 
    <div class="panel-heading"> 
 
    <h3 class="panel-title">Filter By</h3> 
 
    </div> 
 
    <div class="panel-body"> 
 
    <form class="form-horizontal" id="filter" action="filter.php" method="get" role="form"> 
 
     <input type="hidden" name="action" value="filterSearch"> 
 
     <div class="form-group"> 
 
     <div class="col-sm-9"> 
 
      <select class="form-control" name="productType" id="productType"> 
 

 
      \t \t \t \t <option selected="selected">By Product Type</option> 
 
                  <option value="Cars">Cars</option> 
 
                  <option value="Trains">Trains</option> 
 
                  <option value="Planes">Planes</option> 
 
           
 
     \t \t \t \t </select> 
 
     </div> 
 
     </div> 
 
    </form> 
 
    </div> 
 
</div>

私は今これを行う方法について確認起こり、そしてないために必要なものは、そのときの選択でありますメニューが変更されて、再度検索が実行されます。ユーザーが選択メニューから車のオプションを選択した場合

findProducts.php?action=searchAssets&orderNumber=xxxx&productName=zzz&productType=Cars 

:GETリクエストは現在、このようなものになるだろう。私はPHPとブートストラップを使用しているので、ここではjQuery/PHPソリューションを使用できます。

答えて

0

オンチャージイベントをドロップダウンにアタッチし、トリガーするとその値を現在のURLに追加し、ページをリロードします。

$(document).ready(function(){ 
    $('#productType').change(function(){ 
     window.location.href = window.location.href + '&productType=' + $(this).val(); 
    }); 
}); 
+0

コンソールでこのエラーが発生します。 演算子 '='の左辺は参照でなければなりません。あなたのスクリプトの3行目の – user982124

+0

私は ".. = $(this)).val"と入力しておいてください(window.location.href = window.location.href + '&productType =' = $(this).val();) () '"、" ... + $(this).val(); "にする必要があります。私の答えを更新しました、もう一度やり直せますか? – phpd

0

オンン「変更」イベントを選択し、次のように...あなたの検索結果のURLにAJAX呼び出しを行うだろう機能を呼び出すことができます。

$(「#1でProductType」)「(上変更 '、function(){

var product_type = $(this).val(); //selected product type 
var your_search_url = "path/to/findProducts.php?action=searchAssets&orderNumber=xxxx&productName=zzz&productType="+product_type; 
$.get(your_search_url, function(data, status){ 
    // your code here to deal with the search results 
}); 

});

0

これはあなたがさえ連鎖ドロップダウンを行うことができますhttps://www.w3schools.com/php/php_ajax_database.asp

を必要とするものです。より多くの1つのparamを送信したいのであれば、そのPHPページに何か '=' a 'とb =' c 'を実行します。隠しフォームのfeildとjavascriptを使用します。

関連する問題