在下拉列表中选择值,并将此值用作另一个下拉列表中的条件

时间:2016-12-16 16:36:40

标签: php jquery

我想在下拉列表中选择一个值,并将该值用作另一个下拉列表中查询的where条件。 我将值保存在cookie中,并在第二个下拉列表中填充正确的信息,但在选择其他值时,它不会按更改的条件加载数据。

  

Jquery的

<script type='text/javascript'>
   $(function() {
    $('#Marca').change(function() { 
    var x = $(this).val();
    $("#myhidden").val(x); // Estou a passar o valor para um input text
    document.cookie = "x="+x;
    });
});
</script> 
  

PHP下拉列表1

   div class="form-group">
<label>Marca</label>
<?php

include('conetar.php');

$result = $conn->query("select * from marca");
echo "<select name='Marca' class='form-control'id='Marca' placeholder ='Introduza a Marca'>";
echo '<option value=""></option>';
while ($row = $result->fetch_assoc()) {

              unset($IDMarca, $Marca);
              $IDMarca = $row['IDMarca'];
              $Marca = $row['Marca']; 
              echo '<option value="'.$IDMarca.'">'.$Marca.'</option>';

}

echo "</select>";
$conn ->close();

?> 
  

PHP下拉列表2

<div class="form-group">
<label>Modelo</label>

<?php
include('conetar.php');
// to send ajax data with commune   
$marca  =$_GET["marca"];

$query= mysqli_query($conn,"SELECT * FROM modelo WHERE modelo.marca ='$marca'  ");


    echo "<select id='Modelo' name='Modelo' class='form-control' placeholder='Introduza o Modelo'>";
        echo '<option value=""></option>';
   while($getmodelo = mysqli_fetch_array($query)){

          unset($IDModelo, $Modelo);
          $IDModelo = $getmodelo['IDModelo'];
          $Modelo = $getmodelo['Modelo']; 
          echo '<option value="'.$IDModelo.'">'.$Modelo.'</option>';

}

echo "</select>";

mysqli_close($conn);

?> 
</div>

2 个答案:

答案 0 :(得分:0)

这是不好的方法,尝试一些ajax调用它会给你一个更好的结果 试试这样的事情

  $(document).ready(function() {
 $("#Marca").on('change',function() {
    var x = $(this).val();

        $.ajax({
            url: 'ajax/yourquerycode.php',
            type: 'GET',
            data: "marca="+x,
            async: false,
            success: function(response) {

            $("#modelo").html(response);

            },
            cache: false,
            contentType: false,
            processData: false
        });

});
});

modelo是你的选择输入,那么你可以为下一个下拉列表做同样的事情

你的php代码就是这样的

 <?php
include_once("include your configdb here");

// to send ajax data with commune   

if(isset($_GET["marca"]))  {

$marca  =strip_tags($_GET["marca"]);

$query= mysqli_query($db_conx,"select * from modelo where modelo.marca       ='$marca'  ");
if(mysqli_num_rows($query) > 0)
  { 


   while($getmodelo = mysqli_fetch_array($query)){

     $modelo = $getmodelo['modelo']; 
  ?>

<option value="<?php echo $modelo;?>"><?php echo $modelo;?></option>

<?php          

      }

   }   
  }
     ?>

我希望这适合你:)

答案 1 :(得分:0)

更新

使用AJAX将所选品牌的IDMarca值发送到后端PHP页面。随后,使用此modelo值从IDMarca表中获取所需数据,最后填充AJAX请求的success回调函数中的第二个下拉列表。

所以你的代码应该是这样的:

首页将包含第一个下拉列表,第二个下拉列表的框架(稍后您将使用AJAX填充)和您的jQuery / AJAX代码。

<div class="form-group">
<label>Marca</label>
<?php
    include('conetar.php');

    $result = $conn->query("select * from Marca");
    echo "<select name='Marca' class='form-control' id='Marca' placeholder ='Introduza a Marca'>";
    echo '<option value=""></option>';
    while($row = $result->fetch_assoc()){
        unset($IDMarca, $Marca);
        $IDMarca = $row['IDMarca'];
        $Marca = $row['Marca']; 
        echo '<option value="'.$IDMarca.'">'.$Marca.'</option>';
    }
    echo "</select>";
    $conn->close();
?> 


<div class="form-group">
    <label>Modelo</label>
    <select id='Modelo' name='Modelo' class='form-control' placeholder='Introduza o Modelo'>
        <option value=""></option>
    </select>
</div>

<script>
$(document).ready(function(){
    $(document).on('change', '#Marca', function(){
        var IDMarca = $(this).val();
        if(IDMarca.length){
            $.ajax({
                type: 'POST',
                url: 'secondPage.php',
                cache: 'false',
                data: {IDMarca: IDMarca},
                dataType: 'html',
                success: function(data){
                    $('#Modelo').html(data);
                },
                error: function(jqXHR, textStatus, errorThrown){
                    alert(errorThrown);
                }
            });
        }
    });
});
</script>

不要忘记 在AJAX请求的secondPage.php设置中更改url

第二页将处理您的AJAX请求并获取所需的数据,这些数据将用于填充第二个下拉列表。

<?php
    include('conetar.php'); 
    if(isset($_POST['IDMarca'])){
        $IDMarca = $_POST['IDMarca'];
        $query= mysqli_query($conn,"SELECT * FROM modelo WHERE modelo.marca ='$IDMarca'");
        while($getmodelo = mysqli_fetch_array($query)){
            unset($IDModelo, $Modelo);
            $IDModelo = $getmodelo['IDModelo'];
            $Modelo = $getmodelo['Modelo']; 
            echo '<option value="'.$IDModelo.'">'.$Modelo.'</option>';
        }
        mysqli_close($conn);
    }
?>
相关问题