AJAX 데이터베이스 예제

Posted bygeo Leave a comment on AJAX 데이터베이스 예제

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("")
    response.write("")
  next
  rs.MoveNext
loop
response.write("
" & x.name & "" & x.value & "
")
%>

출처: AJAX Database Example

Leave a comment