2017-08-25 233 views
2

我试图根据另一个选择菜单上选定的值填充选择菜单。从另一个下拉列表填充下拉列表

到目前为止,我设法得到了值,我的PHP代码确实将值作为JSON返回。但是,我似乎无法弄清楚如何在下一个选择菜单中显示数据。

<div class="form-group"> 
    <label for="laptopBrand">Laptop Brand</label> 
    <select class="form-control" id="laptopBrand"> 
     <?php foreach($laptop_brands as $laptop_brand): ?> 
      <option value="<?= $laptop_brand['Lbrand'] ?>"><?= $laptop_brand['Lbrand'] ?></option> 
     <?php endforeach; ?> 
    </select> 
</div> 

<div class="form-group"> 
    <label for="laptopSeries">Laptop Series</label> 
    <select class="form-control" id="laptopSeries"> 
    </select> 
</div> 

JQuery的

$("#laptopBrand").change(function(){ 
    var lbrand = $(this).val(); 
    $.ajax({ 
     type: "POST", 
     data: 'laptopSeries='+lbrand, 
     url: 'includes/fetch.php', 
     dataType: 'json', 
     success: function(json) { 
      var a = JSON.parse(json); 
      alert(a); 
      var $el = $("#laptopSeries"); 
      $el.empty(); // remove old options 
      $el.append($("<option></option>") 
        .attr("value", '').text('Please Select')); 
      $.each(json, function(value, key) { 
       $el.append($("<option></option>") 
         .attr("value", value).text(key)); 
      }); 
     } 
    }); 
}); 

PHP

if($_POST){ 
     $laptopSeries = $_POST['laptopSeries']; 
     try{  
      $stmt = $db_con->prepare("SELECT `Lseries` FROM `laptop` WHERE `Lbrand` = '$laptopSeries'"); 
      $stmt->execute(); 
      $series = $stmt->fetchAll(PDO::FETCH_ASSOC); 

      foreach ($series as $series) { 
       $array = array($series['Lseries'] => $series['Lseries']); 
       echo json_encode($array); 
      } 

     }catch(PDOException $e){ 
      echo $e->getMessage(); 
     } 
    } 
+0

如果你正在使用' - > prepare()'/' - > execute()',那么你真的应该使用占位符来防止sql注入https://stackoverflow.com/questions/60174/how-can-i -prevent-sql -injection-in-php – Sean

+0

@Sean谢谢你指出。我知道我应该使用binParam()。但现在,这不是我主要关心的问题,因为我试图确定下拉菜单。 – nTuply

+0

这是从哪里来的? '$ laptop_brands'还是不相关? –

回答

0

这样输入,并确保你的服务器代码回报,你要填写键和值是什么。

$.each(a,function(key, value) // a or jsondata 

{

$select.append('<option value=' + key + '>' + value + '</option>'); 

});

+0

这似乎与我所做的相似。这并没有多大帮助 – nTuply