如何使用 ajax、php 和 html 填充一个下拉列表

Posted

技术标签:

【中文标题】如何使用 ajax、php 和 html 填充一个下拉列表【英文标题】：How to populate one drop down with another using ajx, php and html 【发布时间】：2013-05-02 02:03:28 【问题描述】：

我想根据另一个使用 ajax 的输入来填充下拉列表。但是有一个死胡同，无法弄清楚问题所在。它使用公司名称打开该公司制造的手机的下拉列表。

这是源php文件：

 <body>
 <div class="ex">
 <form id="mob1" >
  <label></br> Select Mobile 1:</label>
  <label></br> --Company-- <label>
  <select id="d1mob1" onchange="getmob(this.value)">
  <?php 
    $q1=mysqli_query($con,"select distinct compName from umobile order by compName ASC");
    while($row = mysqli_fetch_array($q1)) 
    
        $options .="<option value=\"". $row['compName'] ."\">" . $row['compName'] . "</option>";
    
    echo $options;
  ?>
  </select>
  <label class="ey" name="mlabel"></br> --Mobile--<label>

  <select id="d2mob1" >
  <?php 
    if($q2=mysqli_prepare($con,"SELECT DISTINCT mobname FROM umobile WHERE compName=? "))
    
        mysqli_stmt_bind_param($q2,"s",$comp);
        mysqli_stmt_execute($q2);
        mysqli_stmt_bind_result($q2,$r);
       

    while(mysqli_stmt_fetch($q2))
    
        $name .="<option value=\"".$r."\" >".$r."</option>";        
    
    echo $name;
?>
</select>

</form>
</div>

 </body>

这是为了查询手机名称而引用的 getmob php 文件：

  <?php 
$name="";
$comp=$_GET['d1mob1'];
if($q2=mysqli_prepare($con,"SELECT DISTINCT mobname FROM umobile WHERE compName=? "))

    mysqli_stmt_bind_param($q2,"s",$comp);
    mysqli_stmt_execute($q2);
    mysqli_stmt_bind_result($q2,$r);
   

while(mysqli_stmt_fetch($q2))

    $name .="<option value=\"".$r."\" >".$r."</option>";        

echo $name;
   ?>

最后这是下拉列表中使用的javascript：

  function getmob(compname)
  
    var strURL="getmob.php?d1mob1="+compname;
    var req = getXMLHTTP();
    if (req)
    
     req.onreadystatechange = function()
     
       if (req.readyState == 4) // only if "OK"
       
         if (req.status == 200)
         
           document.getElementById('mlabel').innerhtml=req.responseText;
          else 
          alert("There was a problem while using XMLHTTP:\n" + req.statusText);
        
      
    
   req.open("GET", strURL, true);
   req.send(null);

我错过了什么？请帮忙。

【问题讨论】：

【参考方案1】：

document.getElementById('mlabel')??? r 你想把 responseText 放在d2mob1？

【讨论】：

哎呀！！我是 ajax 新手。我已经为此苦恼了一段时间。只是没有注意到这一点。谢谢！！

以上是关于如何使用 ajax、php 和 html 填充一个下拉列表的主要内容，如果未能解决你的问题，请参考以下文章

如何使用 Ajax 和 Jquery 从 PHP 数据库中提取信息，并使用该信息填充元素？

如何根据使用 jQuery/AJAX 和 PHP/MySQL 选择的第一个下拉列表填充第二个下拉列表？

PHP-AJAX：如何通过 php/json 数组从查询中填充 jquery 数据表

从服务器目录填充选择 PHP jQuery AJAX

使用 JQUERY、AJAX 和 PHP 填充选择框

使用 ajax、sql 和 php 的动态下拉列表