根据两个下拉选择值在索引页面中获取图像和其他详细信息?

时间:2012-10-22 09:45:47

标签: php javascript ajax

我是php的新手。我的下拉列表有问题。让我详细解释一下。我有一个包含两个表的数据库:firstCata和subCata。表subCata引用firstCata ID。现在在我的index.php页面中,我有一个包含2个下拉菜单的表单。第一个是firstCata,第二个是根据我的数据库中的第一个显示值。我使用Ajax.Code做的所有这些都是下面的。问题是使用ajax我在index.php中的标签上显示了第二个下拉列表。如何在index.php页面中显示subCata的其他详细信息?

<head>
<script type="text/javascript">
function getSubCata(str)
{
if (window.XMLHttpRequest)
  {// code for IE7+, Firefox, Chrome, Opera, Safari
  xmlhttp=new XMLHttpRequest();
  }
else
  {// code for IE6, IE5
  xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
  }
xmlhttp.onreadystatechange=function()
  {
  if (xmlhttp.readyState==4 && xmlhttp.status==200)
    {
    document.getElementById("result").innerHTML=xmlhttp.responseText;
    }
  }
xmlhttp.open("GET","getSunCata.php?q="+str.value,true);
xmlhttp.send();
}
</script>
</head>
<select onchange='getSubCata(this)'>
<?php 
$query=mysql_query("SELECT * FROM firstCata") or die(mysql_error());
while($rec=mysql_fetch_array($query))
{
?>
<option value="<?php echo $rec['firstCata_id'];?>"><?php echo $rec['firstCata_name'];?></option>
<?php } ?>
</select>

和我的getSunCata.php代码就像

<?php
mysql_connect('localhost','root','');
mysql_select_db('mainCata') or die(mysql_error());

?>
<select>
<?php
$id=$_GET['q'];
echo $id;
$query=mysql_query("SELECT * FROM subcata where firstCata_id=$id") or die(mysql_error());
while($rec=mysql_fetch_array($query))
{
echo $rec['subCata_name'];
?>
 <option id="a"value="echo $rec['subCata_id'];">
    <?php echo $rec['subCata_name']; ?>
</option>
    <?php
}
?>
</select>

1 个答案:

答案 0 :(得分:1)

如果我理解正确,您需要在第二个选择中打印所有子数据。 那么为什么你需要ajax,如果你想显示所有的subCata值呢? 这是我的解决方案:

// MySQL query
$sql = '
    SELECT
        *
    FROM
        firstCata
    JOIN
        subCata
    ON
        firstCata_id = subCata_id';

使用jQuery的模板html脚本

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
<script type="text/javascript">
$(function(){
    var selects_pair = $('select[name="firstCata"], select[name="subCata"]')
    selects_pair.change(function(){
        // get selected id
        var selected_id = $(':selected', this).val();
        // set another selectd corresponding value
        $('[value="' + selected_id + '"]', selects_pair.not(this)).attr("selected", "selected");
    });
});
</script>

模板html标记

// looping through the data like this, add foreach cycle as you want

<select name="firstCata">
    <option value="<?php echo $rec['firstCata_id'];?>"><?php echo $rec['firstCata_name'];?></option>
</select>

<select name="subCata">
    <option value="<?php echo $rec['subCata_id'];?>"><?php echo $rec['subCata_name'];?></option>
</select>