학교 도서관 홈피의 책검색을 구현하고 싶습니다.
html인줄 알았더니 아니더군요(jsp 속에 ajax 가 있는거같은데;;;;)
그래서 ajax 파싱이라는 검색을 가지고 찾고 있는데 자료들이 없네요~;
그래서 혹시 ajax 파싱이 불가능 한건지
아니면 제가 검색을 못하고 있는지에 대해 문의드립니다.
가능하다면 힌트좀 주시면 안될까요?
어떤 메소드를 알아보라 등등 부탁드리겠습니다.
ps. 아래 소스는 그냥 제가 홈피에서 도서 검색 관련 ajax 소스 인거같아 뽑아서 올려봅니다.
굳이 안보셔도 되구요
추가 질문 드리면 바로 밑에 함수 data_load()도 ajax인가요>? 아니면 그냥 jsp 기능? 인가요?
function data_load() {
var varQuery = "";
varQuery = varQuery + "websysdiv=TOT";
varQuery = varQuery + "&queryString=([안드로이드,TOT,2,0,3])";
varQuery = varQuery + "&countPerPage=10";
varQuery = varQuery + "&selPageIndex=1";
varQuery = varQuery + "&sortQuery=";
varQuery = varQuery + "&statistics=";
varQuery = varQuery + "&searchType=KWRD";
//SchSug_setcoor();//자동완성기능 div위치 잡아주기.
getResult("BriefResult.jsp?timeStamp="+new Date().getTime(), varQuery)
}
//Ajax통신을 통하여 결과를 가져온다.
var xhr;
function createXMLHttpRequest(){
if(window.ActiveXObject){
try {
// IE6
xhr = new ActiveXObject("Microsoft.XMLHTTP");
//
} catch (e) {
try {
// IE4, IE5
xhr = new ActiveXObject("Msxml2.XMLHTTP");
} catch (e2) {
xhr = new ActiveXObject("Msxml2.ServerXMLHTTP.4.0");
}
}
}
else{
xhr = new XMLHttpRequest();
}
}
/**********************************
* 간략정보 AJAX
***********************************/
function getResult(url,querystring) {
createXMLHttpRequest();
xhr.open('POST', url, true);
xhr.onreadystatechange = tr_result;
xhr.setRequestHeader("Content-Type","application/x-www-form-urlencoded;");
xhr.send(querystring);
}
function tr_result() {
//xml = xhr.responseText
if (xhr.readyState == 4){
if(xhr.status == 200){
parseResults(xhr);
Element.hide('indicator');
}
}
}
/********************************************************
* 간략정보 AJAX - html 출력(검색결과 건수, 간략정보)
*********************************************************/
var MAX_RECORD ="10";
function parseResults(xhr_local){
var xdoc = xhr_local.responseXML;
var data = null;
var node = null;
var DISP01="",DISP02="",DISP03="",DISP04="",DISP05="",DISP06="";
var DISP07="",DISP08="",DISP09="",DISP10="",DISP11="",DISP12="";
var disp="";
var limit01="";
var sysdiv="";
var controlno="";
var number="";
var IMGYN,VODYN,OLDYN,ABSYN,OABSYN,CONTYN,CRITYN,NEWYN,URLEXIST,REFYN,AODYN,M01YN,M02YN,M03YN,M04YN,M05YN;
var count = xdoc.getElementsByTagName("count")[0].firstChild.nodeValue;
total_page = Math.ceil(count / 10);
byId("result_count").innerHTML = "<font color=#000033>" + "총" + count + "건"
+"</font><strong>[1/"+total_page+"]</strong>";
byId("total").innerHTML = "<strong>총 " + total_page + " </strong>페이지중 ";
var data_list = xdoc.getElementsByTagName("data");
paging(count);
for(var i = 0; i < data_list.length; i++)
{
data = data_list[i];
node = data.getElementsByTagName("LIMT01")[0].firstChild;
if(node != null) limit01 = node.nodeValue;
disp = "";
var prtNode;
prtNode = data.getElementsByTagName("DISP01")[0];
if(prtNode != null)
{
node = data.getElementsByTagName("DISP01")[0].firstChild;
if(node != null) DISP01 = node.nodeValue;
else DISP01 = "";
if(0 != 0)
disp = disp + "/" + DISP01;
}
prtNode = data.getElementsByTagName("DISP02")[0];
if(prtNode != null)
{
node = data.getElementsByTagName("DISP02")[0].firstChild;
if(node != null) DISP02 = node.nodeValue;
else DISP02 = "";
if(1 != 0)
disp = disp + "/" + DISP02;
}
prtNode = data.getElementsByTagName("DISP03")[0];
if(prtNode != null)
{
node = data.getElementsByTagName("DISP03")[0].firstChild;
if(node != null) DISP03 = node.nodeValue;
else DISP03 = "";
if(2 != 0)
disp = disp + "/" + DISP03;
}
prtNode = data.getElementsByTagName("DISP06")[0];
if(prtNode != null)
{
node = data.getElementsByTagName("DISP06")[0].firstChild;
if(node != null) DISP06 = node.nodeValue;
else DISP06 = "";
if(3 != 0)
disp = disp + "/" + DISP06;
}
prtNode = data.getElementsByTagName("DISP07")[0];
if(prtNode != null)
{
node = data.getElementsByTagName("DISP07")[0].firstChild;
if(node != null) DISP07 = node.nodeValue;
else DISP07 = "";
if(4 != 0)
disp = disp + "/" + DISP07;
}
sysdiv = data.getAttribute("SYSD");
controlno = data.getAttribute("CTRL");
number = data.getAttribute("num");
var media ="";
var isFirst = true;
for (var ini = 0; ini < INCLUDINGS_4_IR.length; ini++) {
if ( data.getAttribute(INCLUDINGS_4_IR[ini]) == "Y") {
if (isFirst)
{
media = "<br>";
isFirst = false;
}
media = media + "<a href=\"Javascript:openMedia('" + sysdiv + "','" + controlno + "','"+ INCLUDINGS_4_IR[ini] + "');\">"
+ "<img src=\"/cju/images/cju/images_ko/" + INCLUDINGS_IMAGE[ini] + "\" border=\"0\">" + "</a>";
}
}
addTableRow(i, number, DISP01, disp, limit01, sysdiv, controlno,media);
if(i < MAX_RECORD -1){// dot_print
row = creatDotLine();
byId("resultsBody").appendChild(row);
}
} // end for
예를 들어 함수 내부의 var count = xdoc.getElementsByTagName("count")[0].firstChild.nodeValue 부분은 XML로 넘어오는 데이터중 count 객체의 값을 가지고 오라는 자바스크립함수입니다.
그리고 이런 질문은 여기보다는 http://www.okjsp.pe.kr/ --> 이 싸이트가 훨씬 대답이 빠를겁니다.
Ajax라는 것이 자바스크립트함수와 XML을 통한 서버와 클라이언트간의 비동기 호출이기 때문에 XML파싱하듯이 하면 됩니다.
특별히 Ajax용 파싱함수가 따로 있는것은 아닙니다.
아 물론 최근에 나온 Ajax개발을 쉽게 해주는 라이브러리를 이용하시면 이런 함수들이 있을지도 모르겠습니다.
따라서 위의 함수도 Ajax를 통해 어떤 특정 기능을 구현한 자바스크립트 함수로 보시면 되겠습니다.
Ajax관련 책을 얇은 것이라도 하나 보시는 것이 훨씬 이해가 빠를듯 합니다.
참고로 저도 서블릿-JSP사이에 Ajax를 통한 기능구현시 일일히 자바스크립트 함수로 파싱했습니다.ㅜㅜ
서블릿에선 XML로 결과를 던지면 JSP페이지에서 자바스크립트로 XML을 받아서 DOM객체(예를 들면 TABLE라던가..)를 일일히 다시 그렸습니다.