[Java Script] 자바스크립트 Ajax사용 및 컨트롤러

---

 

일단 나는.. 한 js파일에 하나의 Ajax를 넣는 형태로 넣고 있다.

 

근데 한 js 파일안에 여러개 Ajax가 가능 하지 않을까?. 이건 구글링 

 

더해봐야 될것 같다.

 

-> 한 .js안에 여러 Ajax 삽입이 가능함😁😁

---

 

 

(function () {
   
   "use strict";
   
   const init = () => {
      
      $.ajax({
         async : false,
         cache : false,
         type : "post",
         url : "/index/location/locationAjax",  // controller에 내가 사용할 주소와 일치 / root-context 유의 // 먼저 데이터가 들어오는지 확인이 필요 (controller에서 syso 찍어보자)
         contentType : "application/json; charset=UTF-8",
         dataType : 'json',
         success : function(data) { // 여기서 response 객체나 data 객체나 바꾸어 사용해도 상관은 없음.
            
            console.log(data); 
            
            let html = ''; // 선언할때 보통 처음에는 null을 넣어주고 시작해야 중복 또는 값이 여러개 생기는 오류가 발생안함.
            
            data.RESULT.map((value, index) => {
               console.log(`순서: ${index}, 값: ${value}`);  // 이것도 console.log() = system.out.println() 이거랑 비슷한 느낌이라 없어도 상관은 없음 오류 안남
               html += `<option value=${value.EMD_CD}>${value.EMD_CD}</option>` // value={value.[colume 이름] 컬럼이름 바뀌어도 아작스 오류는 안남}
            });
            // 여기까지는 단순 선언 해주는것이기 Error가 발생하지 않음
            document.querySelector('#location').innerHTML = html;
            
            document.querySelector('#location').addEventListener('change', event => {
               
               const locationValue = event.target.value;
               
               // 조건문
               if (locationValue === '서초동') {
                  console.log('서초동');
               }
               
            });
                  
         },
         // Ajax 오류 
         error : function(jqXHR, textStatus, errorThrown) {
            alert("ajaxUpdate " + jqXHR.textStatus + " : "
                  + jqXHR.errorThrown);
         }
      });
      
   }
   
   init();
   
})();

 

 

 

이건 그냥 원본 파일이고 어렵다면 참고하면 되겠다.

 

+ 그냥 통째로 외워 버리자 그게 고급 개발자가 되기 위한 지름길 같다.

 

 

 

 

 

 

 

 

분명 다른 주소 인데

 

result 값을 같은 객체로 쓰고있다.

 

이말은 즉슨, 다른 주소 값안에서는 

 

같은 객체명을 써도 상관이 없다는 의미인것 같다.

 

 

 

 

여기서도 보면 list는 여기서 1, 2 로 나눠서 사용 하고 있지만

 

다른 url에서 list3 으로 사용하는게 아니라 그냥 다시 list 를 사용한다.

 

즉 다른 url 영역에는 덮쳐지지 않는것 같다.

 

 

 

 

개발은 위대하다.

 

 

 

---

 

 

To be continue..