php - ajax リクエストの積み重ね

Question

これをチェックしていただきありがとうございます。

現在ドロップダウンメニューを埋めているmysqlにデータベースがあり、選択するxmlhttprequestと、mysqlクエリを実行するphpファイルへのajaxを使用して2番目のドロップダウンが埋められます。

最初のドロップダウンを機能させたまま、2番目のドロップダウンからの選択に基づいてテーブルを表示したいと思います。

これまでのところ、メインドキュメントに 2 番目の 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);
 ?>

score 1 · Accepted Answer

私の提案は、いくつかの小さな手順に従ってコードを再編成することです。

サーバー側のコード応答は json データになります
jquery を使用してクライアント呼び出しを行い、低レベルの HTTP 呼び出しの管理を避ける
jquery ハンドラーインジェクションをオンザフライで使用して、コードをレンダリングし、クライアントにイベントハンドラーを追加します。

jquery に関するいくつかの参照:

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

いくつかの例：

test.php への単純な GET HTTP 呼び出し

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

id = foo の要素にクリックを追加する

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

php - ajax リクエストの積み重ね

1 に答える 1

Related

Reference