http://jubuntu.tistory.com/93 참조
AJAX를 데이터베이스와 함께 사용하면 좀 더 상호적일 수 있다.
AJAX 데이터베이스 예제
다음의 예제는 AJAX 기술을 이용해 데이터베이스로부터 정보를 얻어오는 방법에 대해 보여준다.
AJAX 예제 설명
예제는 단순한 HTML 폼과 자바스크립트 연결을 포함하고 있다.<html>
<head>
<script type="text/javascript" src="selectcustomer.js"></script>
</head>
<body>
<form>
Select a Customer:
<select name="customers" onchange="showCustomer(this.value)">
<option value="ALFKI">Alfreds Futterkiste</option>
<option value="NORTS ">North/South</option>
<option value="WOLZA">Wolski Zajazd</option>
</select>
</form>
<div id="txtHint"><b>Customer info will be listed here.</b></div>
</body>
</html>
AJAX 자바스크립트
"selectcustomer.js"라는 파일명으로 저장한다.var xmlhttp
function showCustomer(str)
{
xmlhttp=GetXmlHttpObject();
if (xmlhttp==null)
{
alert ("Your browser does not support AJAX!");
return;
}
var url="getcustomer.php";
url=url+"?q="+str;
url=url+"&sid="+Math.random();
xmlhttp.onreadystatechange=stateChanged;
xmlhttp.open("GET",url,true);
xmlhttp.send(null);
}
function stateChanged()
{
if (xmlhttp.readyState==4)
{
document.getElementById("txtHint").innerHTML=xmlhttp.responseText;
}
}
function GetXmlHttpObject()
{
if (window.XMLHttpRequest)
{
// code for IE7+, Firefox, Chrome, Opera, Safari
return new XMLHttpRequest();
}
if (window.ActiveXObject)
{
// code for IE6, IE5
return new ActiveXObject("Microsoft.XMLHTTP");
}
return null;
}
AJAX 서버 페이지
위의 자바스크립트가 "getcustomer.php"라는 서버 페이지를 호출하게 된다.<?php
$q=$_GET["q"];
$con = mysql_connect('localhost', 'peter', 'abc
123');
if (!$con)
{
die('Could not connect: ' . mysql_error());
}
mysql_select_db("ajax_demo", $con);
$sql="SELECT * FROM customers WHERE customerid = '".$q."'";
$result = mysql_query($sql);
echo "<table>";
while($row = mysql_fetch_array($result))
{
echo "<tr><td><b>CustomerID</b></td><td>".$row['CustomerID']."</td></tr>";
echo "<tr><td><b>CompanyName</b></td><td>".$row['CompanyName']."</td></tr>";
echo "<tr><td><b>ContactName</b></td><td>".$row['ContactName']."</td></tr>";
echo "<tr><td><b>Address</b></td><td>".$row['Address']."</td></tr>";
echo "<tr><td><b>City</b></td><td>".$row['City']."</td></tr>";
echo "<tr><td><b>PostalCode</b></td><td>".$row['PostalCode']."</td></tr>";
echo "<tr><td><b>Country</b></td><td>".$row['Country']."</td></tr>";
}
echo "</table>";
mysql_close($con);
?>
