2013-02-15 2 views
2

спасибо за проверку этого.укладывание запросов ajax

У меня есть база данных в mysql, которая в настоящее время заполняет раскрывающееся меню, которое по выбору заполняет второй снимок с помощью ajax xmlhttprequest в php-файл, который запускает запрос mysql.

Я бы хотел отобразить таблицу, основанную на выборе из второго выпадающего списка, в то же время оставив первый функциональный снимок.

До сих пор я пытался добавить второй вызов js к основному документу, а также попытался поместить этот js-вызов в вывод файла php, который был вызван первым.

Ни один вариант, похоже, не работает.

Является ли то, что я пытаюсь сделать возможным?

Лог-файлы никогда не показывают его, пытаясь получить getclubs.php, поэтому я предполагаю, что вызов GetClub никогда не запускается.

test.php:

<html> 
<title> 
demo </title> 
<head> 
<script> 
function GetCounty(str) 
{ 
if (str=="") 
    { 
    document.getElementById("countymenu").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("countymenu").innerHTML=xmlhttp.responseText; 
    } 
} 
xmlhttp.open("GET","getcounty.php?q="+str,true); 
xmlhttp.send(); 
} 
</script> 
<script> 
function GetClubs(str) 
{ 
if (str=="") 
    { 
    document.getElementById("clubtable").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("clubtable").innerHTML=xmlhttp.responseText; 
} 
    } 
xmlhttp.open("GET","getclub.php?q="+str,true); 
xmlhttp.send(); 
    } 
    </script> 
    </head> 
    <body> 


<? 
// Load field datas into List box 
$cn=mysql_connect("localhost","user","password") or die("Note: " . mysql_error()); 
echo "Conn ok<br>"; 
$res=mysql_select_db("snowusa_clubs",$cn) or die("Note: " . mysql_error()); 
echo " Database opened<br>"; 
//$rescounty=mysql_query("SELECT * FROM county WHERE state_id='33' ORDER by name;") or die ("Note: " . mysql_error()); 
    $resstate=mysql_query("SELECT * FROM state ORDER by longstate;") or die("Note: " . mysql_error()); 
echo " qry executed<br>"; 
?> 
<h1>Select</h1> 


State: 
<select name="State" size=1 onchange="GetCounty(this.value)"> 
<option value="">Select a State</option> 
<? 
    while($rs = mysql_fetch_array($resstate)) 
{ 
echo "<option value=" .$rs['id'] . ">" . $rs['longstate'] . "</option>"; 
} 
echo "</select> " 
?> 
<p> 
</p> 
<div id="countymenu"><b>County menu for selected state will be listed here.</b></div> 




</body> 
</html> 

getcounty: PHP:

<?php 
$q=$_GET["q"]; 

$cn=mysql_connect("localhost","user","password"); 
if (!$cn) 
    { 
    die('Could not connect: ' . mysql_error()); 
    } 

mysql_select_db("snowusa_clubs", $cn); 

$sql="SELECT * FROM county WHERE state_id = '".$q."' ORDER by name"; 

$result = mysql_query($sql); 

$fulllist="SELECT * FROM allclubs WHERE stateid = '".$q."' ORDER by clubname"; 
$listresult = mysql_query($fulllist); 




echo "County : <select name=\"County\" size=1 onchange=\"GetClub(this.value)\">"; 

echo "<option value=\"\">Select County</option>"; 

while($rc = mysql_fetch_array($result)) 
{ 
echo "<option value=" .$rc['id'] . ">" . $rc['name'] . "</option>"; 
} 
echo "</select>"; 

echo "<p></p>"; 
echo "Table of All Clubs in Selected State:</br>"; 

echo "<table border='1'> 
<tr> 
<th>County</th> 
<th>Club Name</th> 
<th>Address</th> 
<th>Phone</th> 
<th>Website</th> 
<th>Email</th> 

</tr>"; 

while($row = mysql_fetch_array($listresult)) 
    { 
    echo "<tr>"; 
    echo "<td>" . $row['county'] . "</td>"; 
    echo "<td>" . $row['clubname'] . "</td>"; 
    echo "<td>" . $row['address'] . "</td>"; 
    echo "<td>" . $row['phone'] . "</td>"; 
    echo "<td>" . $row['website'] . "</td>"; 
    echo "<td>" . $row['email'] . "</td>"; 
    echo "</tr>"; 
    } 
    echo "</table>"; 

    echo "<div id='clubtable'><b>Club Listing will appear as a table here.</b></div>"; 

    mysql_close($cn); 
    ?> 

getclub.php

<?php 
$q=$_GET["q"]; 

$cn=mysql_connect("localhost","user","password"); 
if (!$cn) 
    { 
    die('Could not connect: ' . mysql_error()); 
    } 

mysql_select_db("snowusa_clubs", $cn); 

$sql="SELECT * FROM allclubs WHERE countyid = '".$q."' ORDER by clubname"; 

$clubresult = mysql_query($sql); 




echo "<table border='1'> 
<tr> 
<th>County</th> 
<th>Club Name</th> 
<th>Address</th> 
<th>Phone</th> 
<th>Website</th> 
<th>Email</th> 

</tr>"; 

while($row = mysql_fetch_array($clubresult)) 
    { 
    echo "<tr>"; 
    echo "<td>" . $row['county'] . "</td>"; 
    echo "<td>" . $row['clubname'] . "</td>"; 
    echo "<td>" . $row['address'] . "</td>"; 
    echo "<td>" . $row['phone'] . "</td>"; 
    echo "<td>" . $row['website'] . "</td>"; 
    echo "<td>" . $row['email'] . "</td>"; 
    echo "</tr>"; 
    } 
    echo "</table>"; 


mysql_close($cn); 
?> 
+4

OnChange = "GetClub ..." без " s'. Ваше фактическое имя функции имеет 's', GetClubs. – andho

+1

Это было :): smackhead: –

+1

Обратите внимание, что 'XMLHttpRequest' не работает должным образом в IE7 + до 10. Вместо этого вы прекратите изобретать колесо и начнете использовать популярную библиотеку javascript, например' Jquery' – Yang

ответ

1

Мое предложение реорганизовать код следующие несколько небольших шагов:

  1. Ответ сервера на стороне код будет JSON данные
  2. сделать ваш клиент звонков с помощью JQuery, избежать управления низкого уровня HTTP называет
  3. делают код и добавить обработчики событий на клиент с помощью JQuery обработчиков инъекции на лету

некоторые ссылки на JQuery:

- GET HTTP calls with : http://api.jquery.com/jQuery.get/ 
- how to add a event : http://api.jquery.com/bind/ 

некоторые примеры:

простой GET HTTP вызов test.php

$.get("test.php", function(data) { 
    alert("Data Loaded: " + data); 
}); 

добавления нажмите на элемент с идентификатором = Foo

$('#foo').bind('click', function() { 
    alert('User clicked on "foo."'); 
}); 
+2

Почему он использовал '.bind()' когда он может использовать '.on()'? Начиная с jQuery 1.7, метод '.on()' является предпочтительным методом привязки обработчиков событий к документу. –

+0

Спасибо за указатели, я должен посмотреть на эти ссылки и посмотреть, могу ли я их понять :) –

+0

good point @RPM :) просто забыли про '.on()' –

Смежные вопросы