簡體   English   中英

在數據庫中更改第一個下拉列表中的第二個下拉列表中填充值

[英]Fill value in second dropdown on changing of first from database

嗨,大家好,我是php的新手,我有兩個選擇標簽,我想根據第一個填充數據庫中的第二個選擇標簽,請幫幫我,因為我從最近三天開始就一直在面對這個問題。 我已經從javascript php編寫了代碼,第二頁的名稱是api.php。

 <html>
 <head>
 <script src="js/jquery.min.js" ></script>
 </head>
 <body>
     <form method="post" class="form-horizontal" >
      <label class="col-lg-3 control-label">Category</label>
      <select id="category" class="form-control" name="Category">
         <option>Select Category</option>
        <?php
            $con=mysqli_connect("localhost","root","","keep_shopping");
            $select="select * from tbl_category";
            $result=mysqli_query($con,$select);
             while($row=$result->fetch_assoc()){
              $CategoryName=$row['CategoryName'];   
              $CategoryId=$row['CategoryId'];   
            ?>
           <option  value="<?php echo  $CategoryId;?>"><?php echo $CategoryName;?></option> 
 <?php
 }
 ?>                                        
</select>
          <br />
          <br />
          <br />
            <label class="col-lg-3 control-label">Brand</label>
            <select id="brand" class="form-control" name="Brand">
               <option>Select a Brand</option>
            <script>
                $(document).ready(function(){
                    alert('Change Happened');
                    $('#category').change(function(){
                    var CategoryId=$(this).val();
                    $.ajax({
                         'type':'get',
                         'url':'api.php',
                          'data':{'CategoryId':CategoryId,'btn':1},
                           'success':function(response){
                        document.getElementById("brand").innerHTML=response;
}
});
});
});
    </script>
    </select>
    </form>

</body>
</html>

second page name is api.php

<?php
if(isset($_GET['btn'])){
$CategoryId=$_POST['CategoryId'];
$con=mysqli_connect("localhost","root","","keep_shopping");
$select=mysqli_query($con,"select * from tbl_brand where 
CategoryID='$CategoryId'");
$states='<option>-SELECT CITY-</option>';
while($row=$select->fetch_assoc()){
$states.='<option  
value="'.$row["BrandID"].'">'.$row["BrandName"].'</option>';     
}
echo $states;
}
?>

ajax函數正在使用GET作為方法,但是在api.php腳本中,您嘗試使用$_POST['CategoryId']因此也許您應該將其更改為$_GET['CategoryId']

<?php
    if( isset( $_GET['btn'], $_GET['CategoryId'] ) ){
        /* The ajax method is GET */
        $CategoryId=$_GET['CategoryId'];

        $con=mysqli_connect("localhost","root","","keep_shopping");
        $select=mysqli_query($con,"select * from tbl_brand where CategoryID='$CategoryId'");
        $states='<option>-SELECT CITY-</option>';

        while($row=$select->fetch_assoc()){
            $states.='<option value="'.$row["BrandID"].'">'.$row["BrandName"].'</option>';     
        }
        echo $states;
    }
?>

順帶一提api.php代碼容易受到SQL注入的攻擊,因此您應該使用准備好的語句

<script>
    $(document).ready(function(){
        /* The alert should be within the change callback function */
        $('#category').change(function(){
            var CategoryId=$(this).val();
            alert( 'Change Happened: '+CategoryId );
            $.ajax({
                'type':'get',
                'url':'api.php',
                'data':{'CategoryId':CategoryId,'btn':1},
                'success':function(response){
                    document.getElementById("brand").innerHTML=response;
                }
            });
        });
    });
</script>

要測試以查看onchange事件是否確實在觸發,請使用控制台(當今大多數瀏覽器都具有console)並打開“網絡”標簽。

我只是使用上面的javascript設置了一個測試文檔,它觸發了警報並發送了數據-盡管我顯然使用了其他目標腳本。

function get_state_names($country){ 
$sql_get_state_names = "select *                            
                        from ".main::$db_states."                           
                        where country_id = (select country_id
                                            from ".main::$db_countries."
                                            where number = '".$country."')" ;               
$res_get_state_names = mysql_query ($sql_get_state_names) ; 
if (mysql_num_rows ($res_get_state_names) > 0){ 
    $i = 0 ;
    while ($row_get_state_names = mysql_fetch_object ($res_get_state_names)){
        $tmp = array(           
            'id'=>$row_get_state_names->id,
            'name'=>$row_get_state_names->name
        );
        $this->get_states[$i++] = $tmp ;
    }       
    foreach($this->get_states as $key=>$val){           
        echo "<option value='".$val['id']."'>".$val['name']."</option>" ;           
    }
}   
else echo "<option value='0'>No State</option>" ;   
}


<script>

    $(document).ready(function(){       
        $("#country").on('change', function(){          
            var country = document.getElementById("country").value ;
            var xmlhttp ;
            if (window.XMLHttpRequest){
                xmlhttp = new XMLHttpRequest();
            }
            else{
                xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");
            }
            xmlhttp.open("GET","process.php?action=get_state_names&country="+country,true);
            xmlhttp.send(); 
            xmlhttp.onreadystatechange=function(){
                if (xmlhttp.readyState==4 && xmlhttp.status==200){
                    var result = xmlhttp.responseText ;                 
                    document.getElementById("state").innerHTML = result ;
                }
            }           
        });     
    });

    </script>

暫無
暫無

聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.

 
粵ICP備18138465號  © 2020-2024 STACKOOM.COM