2011-08-29 34 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來製作具有選項的魔術......這就像你需要的一樣?