Fatal编程技术网
  • php/
  • 动态下拉列表-PHP和Javascript

动态下拉列表-PHP和Javascript

php javascript ajax drop-down-menu

动态下拉列表-PHP和Javascript,php,javascript,ajax,drop-down-menu,Php,Javascript,Ajax,Drop Down Menu,我想创建一个基于mysql数据库和表的动态下拉列表。我搜索了一下网，最近的一次是 我已经按照示例实现了这段代码，第一个下拉框工作正常，但是第二个下拉框在选择“类别”后不会填充 代码是： main.php <html> <body> <script type="text/javascript"> function AjaxFunction(cat_id) { var httpxml; try { // Firefox, Ope

我想创建一个基于mysql数据库和表的动态下拉列表。我搜索了一下网，最近的一次是

我已经按照示例实现了这段代码，第一个下拉框工作正常，但是第二个下拉框在选择“类别”后不会填充

代码是：

main.php

<html>
<body>

<script type="text/javascript">

  function AjaxFunction(cat_id) {
    var httpxml;
    try {
      // Firefox, Opera 8.0+, Safari
      httpxml = new XMLHttpRequest();
    } catch (e) {
      // Internet Explorer
      try {
        httpxml = new ActiveXObject("Msxml2.XMLHTTP");
      } catch (e) {
        try {
          httpxml = new ActiveXObject("Microsoft.XMLHTTP");
        } catch (e) {
          alert("Your browser does not support AJAX!");
          return false;
        }
      }
    }
    function stateck() {
      if (httpxml.readyState == 4) {
        var myarray = eval(httpxml.responseText);
        // Before adding new we must remove previously loaded elements
        for (j = document.testform.subcat.options.length - 1; j >= 0; j--) {
          document.testform.subcat.remove(j);
        }
        for (i = 0; i < myarray.length; i++) {
          var optn = document.createElement("OPTION");
          optn.text = myarray[i];
          optn.value = myarray[i];
          document.testform.subcat.options.add(optn);
        } 
      }
    }
    var url="dd.php";
    url = url+"?cat_id="+cat_id;
    url = url+"&sid="+Math.random();
    httpxml.onreadystatechange = stateck;
    httpxml.open("GET",url,true);
    httpxml.send(null);
  }

</script>

<form name="testform" method='POST' action='mainck.php'>Name:<input type=text name=fname>
Select first one <select name=cat onchange="AjaxFunction(this.value);">
<option value=''>Select One</option>
<?

  require "config.php";// connection to database 
  $q=mysql_query("select * from categories");
  while($n=mysql_fetch_array($q)){
    echo "<option value=$n[cat_id]>$n[category]</option>";
  }

?>
</select>

<select name=subcat>

</select><input type=submit value=submit>
</form>

</body>
</html>

<form name='testform' method='POST' action='mainck.php'> 
      Name: <input type='text' name='fname'> 
      Select first one 
      <select name='cat' onchange='AjaxFunction(this);'> 
        <option value=''>Select One</option> 

<?php 

  require "config.php";// connection to database 

  // I will continue to use mysql_query(), but please migrate you code to 
  // PDO or MySQLi ASAP 
  $query = " 
    SELECT cat_id,category 
    FROM categories
  "; 
  $result = mysql_query($query); 

  while ($row = mysql_fetch_assoc($result)) { 
    echo "<option value='{$row['cat_id']}'>{$row['category']}</option>"; 
  } 

?> 

      </select> 
      <select name='subcat' id='subcat_select'> 
      </select> 
      <input type='submit' value='Submit'> 
    </form> 

<?php 

  require "config.php"; 

  $query = " 
   SELECT packcode 
    FROM skudata
    WHERE cat_id='".mysql_real_escape_string($_GET['cat_id'])."'       "; 
  $result = mysql_query($query); 

  $array = array(); 
  while ($row = mysql_fetch_assoc($result)) { 
    $array[] = $row['packcode']; 
  } 

  echo json_encode($array); 

?>
到

然后在选择“类别”时填充第二个框。我认为选择的值没有正确地从main.php传递到dd.php

$cat_id=$_GET['cat_id'];
在此方面的任何帮助都将不胜感激。我有一种感觉，这是一件很小的事情，但我不能完全把手指放在上面

和往常一样，我要提前表示感谢。 更新的问题

main.php

<html>
<body>

<script type="text/javascript">

  function AjaxFunction(cat_id) {
    var httpxml;
    try {
      // Firefox, Opera 8.0+, Safari
      httpxml = new XMLHttpRequest();
    } catch (e) {
      // Internet Explorer
      try {
        httpxml = new ActiveXObject("Msxml2.XMLHTTP");
      } catch (e) {
        try {
          httpxml = new ActiveXObject("Microsoft.XMLHTTP");
        } catch (e) {
          alert("Your browser does not support AJAX!");
          return false;
        }
      }
    }
    function stateck() {
      if (httpxml.readyState == 4) {
        var myarray = eval(httpxml.responseText);
        // Before adding new we must remove previously loaded elements
        for (j = document.testform.subcat.options.length - 1; j >= 0; j--) {
          document.testform.subcat.remove(j);
        }
        for (i = 0; i < myarray.length; i++) {
          var optn = document.createElement("OPTION");
          optn.text = myarray[i];
          optn.value = myarray[i];
          document.testform.subcat.options.add(optn);
        } 
      }
    }
    var url="dd.php";
    url = url+"?cat_id="+cat_id;
    url = url+"&sid="+Math.random();
    httpxml.onreadystatechange = stateck;
    httpxml.open("GET",url,true);
    httpxml.send(null);
  }

</script>

<form name="testform" method='POST' action='mainck.php'>Name:<input type=text name=fname>
Select first one <select name=cat onchange="AjaxFunction(this.value);">
<option value=''>Select One</option>
<?

  require "config.php";// connection to database 
  $q=mysql_query("select * from categories");
  while($n=mysql_fetch_array($q)){
    echo "<option value=$n[cat_id]>$n[category]</option>";
  }

?>
</select>

<select name=subcat>

</select><input type=submit value=submit>
</form>

</body>
</html>

<form name='testform' method='POST' action='mainck.php'> 
      Name: <input type='text' name='fname'> 
      Select first one 
      <select name='cat' onchange='AjaxFunction(this);'> 
        <option value=''>Select One</option> 

<?php 

  require "config.php";// connection to database 

  // I will continue to use mysql_query(), but please migrate you code to 
  // PDO or MySQLi ASAP 
  $query = " 
    SELECT cat_id,category 
    FROM categories
  "; 
  $result = mysql_query($query); 

  while ($row = mysql_fetch_assoc($result)) { 
    echo "<option value='{$row['cat_id']}'>{$row['category']}</option>"; 
  } 

?> 

      </select> 
      <select name='subcat' id='subcat_select'> 
      </select> 
      <input type='submit' value='Submit'> 
    </form> 

<?php 

  require "config.php"; 

  $query = " 
   SELECT packcode 
    FROM skudata
    WHERE cat_id='".mysql_real_escape_string($_GET['cat_id'])."'       "; 
  $result = mysql_query($query); 

  $array = array(); 
  while ($row = mysql_fetch_assoc($result)) { 
    $array[] = $row['packcode']; 
  } 

  echo json_encode($array); 

?> 


姓名：
选择第一个
选择一个

首先，阻止代码工作的一件小事是传递给函数的值。对于
元素
此值将不起作用。相反，您需要使用
this.options[this.selectedIndex].value
。像这样：


<select name=cat onchange="AjaxFunction(this.options[this.selectedIndex].value);">


dd.php


此代码不起作用，因为所有这些都是main.php文件






功能AJAX功能（cat_id）
{
var-httpxml；
尝试
{
//Firefox、Opera 8.0+、Safari
httpxml=新的XMLHttpRequest（）；
}
捕获（e）
{
//Internet Explorer
尝试
{
httpxml=新的ActiveXObject（“Msxml2.XMLHTTP”）；
}
捕获（e）
{
尝试
{
httpxml=新的ActiveXObject（“Microsoft.XMLHTTP”）；
}
捕获（e）
{
警告（“您的浏览器不支持AJAX！”）；
返回false；
}
}
}
函数stateck（）
{
if（httpxml.readyState==4）
{
var myarray=eval（httpxml.responseText）；
//在添加新元素之前，我们必须删除以前加载的元素
对于（j=document.testform.subcat.options.length-1；j>=0；j--）
{
document.testform.subcat.remove（j）；
}
对于（i=0；i


这是dd.php


<?
$cat_id=$_GET['cat_id'];
require "config.php";
$q=mysql_query("select * from it_subcategory where cat_id='$cat_id'");
echo mysql_error();
$myarray=array();
$str="";
while($nt=mysql_fetch_array($q)){
$str=$str . "\"$nt[subcategory]\"".",";
}
$str=substr($str,0,(strLen($str)-1)); // Removing the last char , from the string
echo "new Array($str)";

?>



url=url+”？cat_id=“+cat_id；url=url+”&sid=“+Math.random（）；URL覆盖我猜Hi Swapnesh，谢谢。我更改了这两行，但没有成功。还有其他建议吗？选择第一行选择第一行。但是这不起作用。代码的任何其他方面不正确吗？@Smudger给我几分钟时间，我将发布如何编写代码。@Smudger请参阅上面的编辑。请随意询问任何问题关于它，汉克斯·戴夫，你已经给我分配了帮助听力。它100%有效，我需要检查它以确保我正确理解它。如果我有任何问题，我会毫不犹豫地发到这里。非常感谢。你能描述一下为什么以及你的答案如何解决这个问题吗？

<?php

  require "config.php";

  $query = "
    SELECT subcategory
    FROM subcategory
    WHERE cat_id='".mysql_real_escape_string($_GET['cat_id'])."'
  ";
  $result = mysql_query($query);

  $array = array();
  while ($row = mysql_fetch_assoc($result)) {
    $array[] = $row['subcategory'];
  }

  echo json_encode($array);

?>



<script type="text/javascript">
function AjaxFunction(cat_id)
{
var httpxml;
try
  {
  // Firefox, Opera 8.0+, Safari
  httpxml=new XMLHttpRequest();
  }
catch (e)
  {
  // Internet Explorer
          try
                    {
                 httpxml=new ActiveXObject("Msxml2.XMLHTTP");
                    }
            catch (e)
                    {
                try
            {
            httpxml=new ActiveXObject("Microsoft.XMLHTTP");
             }
                catch (e)
            {
            alert("Your browser does not support AJAX!");
            return false;
            }
            }
  }
function stateck() 
    {
    if(httpxml.readyState==4)
      {

var myarray=eval(httpxml.responseText);
// Before adding new we must remove previously loaded elements
for(j=document.testform.subcat.options.length-1;j>=0;j--)
{
document.testform.subcat.remove(j);
}


for (i=0;i<myarray.length;i++)
{
var optn = document.createElement("OPTION");
optn.text = myarray[i];
optn.value = myarray[i];
document.testform.subcat.options.add(optn);

} 
      }
    }
    var url="dd.php";
url=url+"?cat_id="+cat_id;
url=url+"&sid="+Math.random();
httpxml.onreadystatechange=stateck;
httpxml.open("GET",url,true);
httpxml.send(null);
  }
</script>

<form name="testform" method='POST' action='mainck.php'>
Select first one <select name=cat onchange="AjaxFunction(this.value);">
<option value=''>Select One</option>
<?
require "config.php";// connection to database 
$q=mysql_query("select * from it_category ");
while($n=mysql_fetch_array($q)){
echo "<option value=$n[cat_id]>$n[category]</option>";
}

?>
</select>

<select name=subcat>

</select><input type=submit value=submit>
</form>

</body>
</html>



<?
$cat_id=$_GET['cat_id'];
require "config.php";
$q=mysql_query("select * from it_subcategory where cat_id='$cat_id'");
echo mysql_error();
$myarray=array();
$str="";
while($nt=mysql_fetch_array($q)){
$str=$str . "\"$nt[subcategory]\"".",";
}
$str=substr($str,0,(strLen($str)-1)); // Removing the last char , from the string
echo "new Array($str)";

?>