2014-05-23 5 views
0

방금 ​​아약스를 사용하여 여러 개의 체크 박스에 작은 프로젝트를 완료했습니다. 데모는 demo에서 확인할 수 있습니다. 하지만 지금은 필터 옵션에 제출 버튼을 사용하고 싶습니다. 그래서 이제 여러 개의 체크 박스가 선택되고 sumbit 버튼이 클릭 된 후 전화 데이터베이스에서만 변경되어야합니다. 어떤 도움이 필요합니까? 감사. Index.php는체크 박스 선택된 이벤트 및 제출 버튼

<body> 
    <h1>Phones database</h1> 

    <table id="phones"> 
     <thead> 
     <tr> 
      <th>ID</th> 
      <th>Brand</th> 
      <th>Model</th> 
      <th>Price</th> 
     </tr> 
     </thead> 
     <tbody> 
     </tbody> 
    </table> 

    <div id="filter"> 
     <h2>Filter options</h2> 
     <div> 
     <input type="checkbox" id="Samsung" checked> 
     <label for="Samsung">Samsung</label> 
     </div> 
     <div> 
     <input type="checkbox" id="iPhone" checked> 
     <label for="iPhone">iPhone</label> 
     </div> 
     <div> 
     <input type="checkbox" id="HTC" checked> 
     <label for="HTC">HTC</label> 
     </div> 
     <div> 
     <input type="checkbox" id="LG" checked> 
     <label for="LG">LG</label> 
     </div> 
     <div> 
     <input type="checkbox" id="Nokia" checked> 
     <label for="Nokia">Nokia</label> 
     </div> 
    </div> 

    <script src="http://code.jquery.com/jquery-latest.js"></script> 
    <script> 
     function makeTable(data){ 
     console.log(data); 
     var tbl_body = ""; 
      $.each(data, function() { 
      var tbl_row = ""; 
      $.each(this, function(k , v) { 
       tbl_row += "<td>"+v+"</td>"; 
      }) 
      tbl_body += "<tr>"+tbl_row+"</tr>"; 
      }) 

     return tbl_body; 
     } 

     function getPhoneFilterOptions(){ 
     var opts = []; 
     $checkboxes.each(function(){ 
      if(this.checked){ 
      opts.push(this.id); 
      } 
     }); 

     return opts; 
     } 

     function updatePhones(opts){ 
     $.ajax({ 
      type: "POST", 
      url: "submit.php", 
      dataType : 'json', 
      cache: false, 
      data: {filterOpts: opts}, 
      success: function(records){ 
      $('#phones tbody').html(makeTable(records)); 
      } 
     }); 
     } 

     var $checkboxes = $("input:checkbox"); 
     $checkboxes.on("change", function(){ 
     var opts = getPhoneFilterOptions(); 
     updatePhones(opts); 
     }); 

     $checkboxes.trigger("change"); 
    </script> 
    </body> 
</html> 

submit.php이 모델의 ID를 전달해야 data: {filterOpts: opts}, 변화

data: {filterOpts: $(':checked').val('id')} 

<?php 
require 'Database.php'; 
#### TEMP SET NAMES FÜR UTF8 ################################################### 
include 'Json.php'; 
    $opts = $_POST['filterOpts']; 
    $tmp = array(); 
    foreach ($opts as $opt) { 
     $tmp[] = '"'.$opt.'"'; 
    } 
     $query = 
     'SELECT mobile_phone.id, name, model, price FROM mobile_phone INNER JOIN brand ON brand_id = brand.id WHERE name IN ('.implode(",", $tmp).')'; 


    $result = mysql_query($query); 
    $data = array(); 
    while ($row = mysql_fetch_assoc($result)) { 
    $data[] = $row; 
    } 

echo json_encode($data); 
?> 
+1

그건 당신이 거기에 가지고 불쾌한 SQL 주입 구멍이야 ... – lonesomeday

답변

0

이 줄 : 여기 내 코드입니다.

+0

안녕하세요,하지만 지금은 작동하지만 같은 일을 시도 – user3659737

+0

지금은 고마워요 :) – user3659737

관련 문제