使用PHP / SQL - 如何单击列表中的项目以显示与所单击项目相关联的另一项目列表

时间:2012-11-26 16:16:38

标签: php javascript mysql ajax

  

可能重复:
  How can I refresh a detail select list when my master select changes using AJAX

我只是在一段时间之后再次学习PHP并且在环顾四周后认为我需要使用JS / ajax来实现这一点,我打算在学习PHP之后更多地了解它。我想学习如何为我现在正在做的事情做这件事。

我有一个父项目表,我将其显示为链接列表。单击父项时,我希望单击的父项的子项显示在另一个列表中。我可以通过简单的查询显示2个列表我只是不知道如何在单击时更新页面/ sql查询。

<?php require ('connection.inc.php'); ?>

<div id="lists">
    <h3>Lists</h3>
     <?php      
    $lists = mysql_query("SELECT * FROM lists") 
    or die(mysql_error());
    while($info = mysql_fetch_array( $lists )) 
    {  
    echo "<a href=\"#\">".$info['ListName']."</a><br />";
    } 
    ?>      
</div>  

<div id='listitems'>
    <h3>List <?php $parent=2; echo $parent?> Items</h3> 
     <?php
    $listitems = mysql_query("SELECT * FROM listitems WHERE parent=$parent") 
    or die(mysql_error()); 
    while($info = mysql_fetch_array( $listitems )) 
    { 
    echo $info['itemName']."<br />";
    }   
    ?>
</div>

1 个答案:

答案 0 :(得分:1)

除了代码问题(mysql_ * == mucho deprecato),你需要检查请求是否是AJAX并输出listitems。

我使用jquery来简化ajax请求。

<?php
require ('connection.inc.php');

/* AJAX request */
if(!empty($_SERVER['HTTP_X_REQUESTED_WITH']) && 
        strtolower($_SERVER['HTTP_X_REQUESTED_WITH']) == 'xmlhttprequest')
{
    $query = sprintf('SELECT * FROM listitems WHERE parent=%d',
            mysql_real_escape_string($_REQUEST['parent']));
    $listitems = mysql_query($query)
            or die(mysql_error()); 
    printf('<h3>List %d Items</h3>', $_REQUEST['parent']);
    while($info = mysql_fetch_array( $listitems )) 
    { 
        echo $info['itemName']."<br />";
    }
    exit;
}

/* Normal request */
?>

<div id="lists">
    <h3>Lists</h3>
    <?php      
    $lists = mysql_query("SELECT * FROM lists") 
            or die(mysql_error());
    while($info = mysql_fetch_array( $lists )) 
    {  
        echo "<a href=\"#\">".$info['ListName']."</a><br />";
    } 
    ?>      
</div>  

<div id='listitems'>
</div>

<script src="//ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
<script>
jQuery(function($)){
     $('#lists').delegate('a', 'click', function(){
         $('#listitems').load(window.location.pathname, {parent: $(this).text()});
         return false;
     });
}
</script>