2011-08-29 87 views
0

我想在任何时候在页面上有三个左右多个下拉框。选择多个动态下拉框与每个选择下拉框过滤输出

当我选择第一个下拉框时,它应该在表格视图中显示数据库中的内容。然后当我选择第二个下拉框时,它应该过滤表格中的数据并在3框中显示表格等等。

我知道它可以在Ajax中完成,所以我在PHP中编码一点点。我做了代码,但有一个问题,第一个框可以正常工作,但是当我选择第二个框时,我需要第一个框参数以及第二个框被发送到第三个选择框。

请从动态下拉框的数据库提取中为此提供简单的代码。我正在尝试用户评论审查的代码。

我已经使用这个代码 ​​3210

但在我的情况下,一切来自于数据库和选择的值应该过滤的2选定框,也表明该表。然后当选择3选择框时,它显示取决于前两个选择框。

我尽可能地解释我想要的。我想我很清楚我需要什么。

寻找您的支持。 代码是在这里

<html> 
<head> 
<script type="text/javascript"> 
function showUserM(str) 
{ 
if (str=="") 
    { 
    document.getElementById("txtHint").innerHTML=""; 
    return; 
    } 
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("txtHint").innerHTML=xmlhttp.responseText; 
    } 
    } 

xmlhttp.open("GET","getuser.php?q="+str,true); 
xmlhttp.send(); 
} 

function showUserI(str1,srt2) 
{ 
if (str=="") 
    { 
    document.getElementById("txtHint").innerHTML=""; 
    return; 
    } 
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("txtHint").innerHTML=xmlhttp.responseText; 
    } 
    } 

xmlhttp.open("GET","getuser.php?q="+str1+"&i="+str2,true); 
xmlhttp.send(); 
} 
function showUserA(str1,str2,str3) 
{ 
if (str=="") 
    { 
    document.getElementById("txtHint").innerHTML=""; 
    return; 
    } 
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("txtHint").innerHTML=xmlhttp.responseText; 
    } 
    } 

xmlhttp.open("GET","getuser.php?q="+str1+"&i="+str2+"&a="+str3,true); 
xmlhttp.send(); 
} 


</script> 
</head> 
<body> 
<?php 
$server = 'localhost'; 
$user = 'root'; 
$pass = ''; 
$dbase = 'pub_12wing'; 

$connect = mysql_connect($server, $user, $pass, $dbase); 

mysql_select_db("publisher",$connect); 

/*一些错误是存在这里,在获取根据$ sql_issue数据应该依赖于$ sql_magz选择的查询,因此最后选择框 什么需要的是改变*/

$sql_magz = "select Distinct magz_id from magz_comment where pub_id = '2'"; 
    $sql_issue = "select Distinct issue_id from magz_comment where pub_id = '2'"; 
    $sql_artical = "select Distinct artical_id from magz_comment where pub_id = '2'"; 
    $result_magz = mysql_query($sql_magz); 
    $result_issue = mysql_query($sql_issue); 
    $result_artical = mysql_query($sql_artical); 
    ?> 
    <form> 

<select name="mag_id" onChange="showUserM(document.getElementByID('mag_id').value)" id="mag_id"> 

<option value="" selected>Select a Magazine ID:</option> 
<?php 
while ($row =mysql_fetch_array($result_magz)){ 
echo "<option value=".$row['magz_id'].">{$row['magz_id']}</option>"; 
} 
?> 
</select> 



<select name="issue_id" onchange="showUserI(document.getElementByID('mag_id').value,document.getElementByID('issue_id').value)" id="issue_id"> 
<option value="" selected>Select a Issue ID:</option> 
<?php 
while ($row =mysql_fetch_array($result_issue)){ 
echo "<option value=".$row['issue_id'].">{$row['issue_id']}</option>"; 
} 
?> 
</select> 



<select name="artical_id" onchange="showUserA(document.getElementByID('mag_id').value,document.getElementByID('issue_id').value,document.getElementByID('artical_id').value)" id="artical_id"> 
<option value="" selected>Select a Artical ID:</option> 
<?php 
while ($row =mysql_fetch_array($result_artical)){ 
echo "<option value=".$row['artical_id'].">{$row['artical_id']}</option>"; 
} 
?> 
</select> 


</form> 
<br /> 
<div id="txtHint"><b>Magazine info will be listed here.</b></div> 
<?php //mysql_close();?> 
</body> 
</html> 

请问这个document.getElementByID('mag_id')的值是不是需要改变什么。

在此先感谢。

+0

到目前为止您的代码是什么?您看到的确切错误是什么? – Treffynnon

+3

请勿使用http://w3schools.com的代码,请参阅http://w3fools.com。 –

+0

我需要动态选择框(多个),就像所选框的表格视图一样 – miya

回答

0

第一个组合框有固定值吗? 如果是这样,你生成它的文档中正常:

<select id="mag_id" onchange='PopulatesSecundBox(this)'> 
<?php // prints database's data ?> 
</select> 

这时如果secund和第三连击是dinamically,你可以这样做:

<select id="issue_id" onchange='PopulatesThirdBox(this)'> 
<!-- Yes, it's empty --> 
</select> 

<select id="artical_id"> 
<!-- Yes, it's empty too --> 
</select> 

然后你处理db数据使用ajax的事件,并使用DOM来制作具有选项的魔术......这就像你需要的一样?