2016-08-14 10 views
0

こんにちは私はデータベースからのデータをフィルタリングしてテーブルに表示しようとしている私のコードに問題があります。私はAJAXを使用してPHPページにリクエストを送信しています。私は解決策を探すのに幸運はありませんでした。 (ユーザーが検索ボックス内の場所を入力して検索し、2つのドロップダウンメニューを使用して表示されたデータをフィルタリングできる一般的な不動産Webサイトや小売店などに似ています)。入力ボックスとドロップダウンメニューを使用してデータをフィルタリングする方法

私のindex.phpページは、3つの入力(テキストボックスと2つのドロップダウン)

<form action="<?php echo $_SERVER['PHP_SELF']; ?>">  
    <input type="text" class="searchForm" id="search" placeholder="Stuff" autocomplete="off"> 
    <div id="here"></div> 
    <select class="orderType" name="type" id="orderByType" data-toggle="dropdown" onchange="displaySelection(this.value)"> 
     <option value="" selected>--------</option> 
     <option value="dropdown1" selected>Dropdown1</option> 
     <option value="dropdown1" selected>Dropdown1</option> 
    </select> 
    <select class="order" name="order" id="orderBy" data-toggle="dropdown"> 
     <option value="" selected>--------</option> 
     <option value="lowest">Lowest</option> 
     <option value="highest">Highest</option> 
    </select> 
</form> 
    <div id="searchTable"> 

を持って、私は確信しているとして、次にindex.phpページに私のAJAX呼び出しは(AJAXは、後で別の質問になります)

function fill(Value) 
{ 
    $('#search').val(Value); 
    $('#here').hide(); 
} 
$(document).ready(function(){ 
    $("#search").keyup(function(){ 
     var x = $('#search').val(); 

     if(x==""){ 
      $("#here").html(""); 
      $('#searchTable').html(""); 
     } 
     else{ 
     $.ajax({ 
      type:'POST', 
      url:'test.php', 
      data:'q='+x, 
      success:function(html){ 
       $("#here").html(html).show(); 
      } 
     }); 
     } 
    }); 
    $('.searchForm').change(function(){ 
     var type = $('#search').val(); 
     var city = $('#city').text(); 

     $.ajax({ 
      type: 'POST', 
      url: 'test.php', 
      data: { search : type, city : city }, 
      success: function(response){ 
       $("#searchTable").html(response); 
       $('#search').live("keypress",function(e){ 
       var code = (e.keyCode ? e.keyCode : e.which); 
       if(code == 13){ 
        e.preventDefault(); 
        e.stopPropagation(); 
        $('#searchTable').show(); 
       } 
      }); 
      } 
     }); 
    }); 
     $('.orderClass').change(function(){ 
      var order = $('#orderBy').val(); 
      var city = $('#city').text(); 

      $.ajax({ 
       type: 'POST', 
       url: 'test.php', 
       data: { orderBy : order, city : city }, 
       success: function(response){ 
        $("#searchTable").html(response); 
       } 
      }); 
     }); 
     $('.orderType').change(function(){ 
      var type = $('#orderByType').val(); 
      var city = $('#city').text(); 

      $.ajax({ 
       type: 'POST', 
       url: 'test.php', 
       data: { orderByType : type, city : city}, 
       success: function(response){ 
        $("#searchTable").html(response); 
       } 
      }); 
     }); 
    }); 

そしてtest.phpを (私は2つのドロップダウンメニューを使用してデータをフィルタリングすることができ、それが正常に動作しますが、私は上にデータを送信するために、私は、持っているものよりも良い方法があります検索入力ボックスから表示されるデータをどのようにフィルタリングするかわからない)

 $stmt = "SELECT * FROM places"; 
     if(isset($_POST['search'])){ 
      $search = htmlspecialchars($_POST['search']); 
      $stmt .= " WHERE name = :search"; 
     } 
     if(isset($_POST['orderByType'])){  
      $selection = $_POST['orderByType']; 
      $stmt .= " AND type = :selection"; 
     } 
     if(isset($_POST['orderBy'])){ 
      $order = $_POST['orderBy']; 
      $selection = $_SESSION['id']; 
      $stmt .= " ORDER BY".$order; 
     } 
     $stmt = $conn->prepare($stmt); 
     $search = "%".$search."%"; 
     $stmt->bindValue(':search', $search, PDO::PARAM_STR); 
     $stmt->bindParam(":selection", $selection); 

     if($stmt->rowCount() > 0){ 
      $result = $stmt->fetchAll(); 
      foreach($result as $row){ 
       echo $row['data']; 
      } 
     } 
    //Search input live search 
    if(!empty($_POST['q'])){ 
     $name = $_POST['q']; 
     $name = htmlspecialchars($name); 
     $liveSearch = $conn->prepare("SELECT name, city FROM places WHERE name LIKE :name OR city LIKE :name"); 
     $name = "%".$name."%"; 
     $liveSearch->bindValue(':name', $name, PDO::PARAM_STR); 
     $result = $liveSearch->fetchAll(); 

     if($liveSearch->rowCount() > 0){ 
      foreach($result as $row){ 
        echo $row['name']; 
      } 
     } 
     else{ 
      echo "No results found"; 
     } 
     } 

(ユーザー入力を使用して検索し、ドロップダウンメニューを使用してフィルタリングすることができる場所に大きなシステムがある場合、私に知らせてください)事前に

感謝。

+0

サイドノート、あなただけの1 '$(ドキュメント).ready(関数(){'ドキュメント準備に起こるしたいすべてのものをラップするが必要です。 – Rasclatt

+0

フォームの中の要素の代わりに、フォーム上で 'onchange'オブザーバを単独で行うことができます。 – Rasclatt

+0

また、フォームのクローズタグが「