AJAX는 데이터베이스와 대화식으로 통신하는 데 사용할 수 있습니다.
AJAX 데이터베이스 예제
다음 예제는 웹 페이지가 AJAX를 사용하여 데이터베이스에서 정보를 가져올 수있는 방법을 보여줍니다:
Example
Customer info will be listed here…
The XMLHttpRequest Object
Customer info will be listed here...
예제 설명 – showCustomer() 함수
사용자가 위의 드롭 다운 목록에서 고객을 선택하면, “showCustomer()”라는 함수가 실행됩니다. 함수는 “onchange”이벤트에 의해 트리거됩니다:
showCustomer
function showCustomer(str) {
var xhttp;
if (str == "") {
document.getElementById("txtHint").innerHTML = "";
return;
}
xhttp = new XMLHttpRequest();
xhttp.onreadystatechange = function() {
if (this.readyState == 4 && this.status == 200) {
document.getElementById("txtHint").innerHTML = this.responseText;
}
};
xhttp.open("GET", "getcustomer.asp?q="+str, true);
xhttp.send();
}
showCustomer() 함수는 다음을 수행합니다:
- 고객이 선택되어 있는지 확인합니다.
- XMLHttpRequest 객체를 만듭니다.
- 서버 응답이 준비되었을 때 실행될 함수를 생성합니다.
- 요청을 서버의 파일로 전송합니다.
- 매개변수(q)가 URL (드롭다운 목록의 내용으로)에 추가되었는지 확인합니다.
AJAX 서버 페이지
위 자바스크립트에 의해 호출된 서버의 페이지는 “getcustomer.asp”라는 ASP 파일입니다.
서버 파일은 PHP 나 다른 서버 언어로 쉽게 재 작성될 수 있습니다.
PHP ajax database에서 해당 예제를 보십시오 .
“getcustomer.asp”의 소스 코드는 데이터베이스에 대해 쿼리를 실행하고 그 결과를 HTML 테이블에 반환합니다:
<%
response.expires=-1
sql="SELECT * FROM CUSTOMERS WHERE CUSTOMERID="
sql=sql & "'" & request.querystring("q") & "'"
set conn=Server.CreateObject("ADODB.Connection")
conn.Provider="Microsoft.Jet.OLEDB.4.0"
conn.Open(Server.Mappath("/datafolder/northwind.mdb"))
set rs=Server.CreateObject("ADODB.recordset")
rs.Open sql,conn
response.write("")
do until rs.EOF
for each x in rs.Fields
response.write("" & x.name & " ")
response.write("" & x.value & "
")
%>