본문 바로가기
웹관련/Ajax

[Ajax] Xml 데이터 끌고오기

by 착한덕환 2018. 9. 12.



웹 작업을 하다 보면 간혹 데이터를 DB가 아닌 Xml데이터에서 끌고 와야하는경우가 있습니다.

그럴때 Ajax로 간단하게 끌고 올수가 있습니다.


Xml 파일이 같은 폴더에 존재한다는 가정하에 아래소스를

사용하면 됩니다.



HTML 소스

    
번호 성명 학교 학과


JavaScript 소스

    function xmlDataReturn() {
        var xmlDataUser = null;
        if (xmlDataUser == null) {
            $.ajax({
                type: "GET",
                dataType: "xml",
                url: "TransStatus.xml",
                success: function (xml) {
                    xmlDataUser = xml;
                    UserList(xmlDataUser);              
                },
                error: function (xmlHttpRequest, textStatus, errorThrown) {
                    alert("처리중 에러가 발생하였습니다.\n\n잠시후 다시 시도해 주세요.\n\n");
                }
            });
        }
    }

    function UserList(xmlData) {
        var strHtml = '';
        var prnCnt = 0;
        if ($(xmlData).find('user').length > 0) {
            $(xmlData).find('user').each(function(){
                prnCnt++;
                strHtml += '';
                strHtml += '' + prnCnt + '';
                strHtml += '' + $(this).find("uName").text().substring(0,1) + 'OO';
                strHtml += '' + $(this).find("uCollage").text() + '';
                strHtml += '' + $(this).find("uSubject").text() + '';
                strHtml += '';
            });

            $('#userList tbody').html(strHtml);
        }
    }

    $(function () {
        xmlDataReturn();
    });



Xml 데이터 (파일명 : TransStatus.xml )



	
		
			김우열
			가천대학교
			영미영문(야)
		
		
			박연우
			가천대학교
			세무회계학과
		
		
			김다현
			가천대학교
			경영학과
		
		
			성기영
			가천대학교
			전자공학
		
		
			강정아
			가천대학교
			중국어과
		
		
			김수인
			가천대학교
			행정학과
		
		
			이지현
			가천대학교
			간호학과
		
	

위 소스를 잘 보면 Xml 데이터를 어떻게 Ajax로 가져올수 있는지 쉽게 알수있습니다 ^^

댓글