코린이의 기록

[javascript] ajax list object 가져오기 본문

javascript,HTML,CSS

[javascript] ajax list object 가져오기

코린이예요 2018. 10. 17. 18:13
반응형

ajax를 이용하여 컨트롤러단에서 @ResponseBody로 return 되는 List object를 전달해주어야함


Controller

1
2
3
4
5
6
    @RequestMapping(value = "/management/campaign/popup/device_model_form", method = RequestMethod.GET)
    @PreAuthorize("hasAnyRole('ROLE_ADMIN, management/campaign|C')")
    public @ResponseBody List<CarModelHasDevModel> device_model_form(@RequestParam(value="carModelId") Integer carModelId, ModelMap modelMap) {
        List<CarModelHasDevModel> CarModelHasDevModels = carModelHasModelDevService.findByCarModelId(carModelId);
        return CarModelHasDevModels;
    }
cs

line 5 : select로 find하여 받아온 object list를 return함

Jsp

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
$('div#addPopup2').on('show.bs.modal'function () {
 
             var carModelId = $('#car_create_form [id="carModelId"]').val();
             $.ajax({
                url : '${ctx}/management/campaign/popup/device_model_form',
                type : 'GET',
                data : {carModelId:carModelId},
                beforeSend: function(xhr) { 
                           xhr.setRequestHeader(csrfHeader, csrfToken);
                      }, 
                      success: function(data) {
                                for(var i=0 in data){                            
                            alert(data[i].id.deviceModelId);    
                              }      
                              document.getElementsByClassName(modal-body).innerHTML=data;
                        
                      },
                      error: function(xhr, status, error){
                          alert("xhr:"+xhr+", status:"+ status + ", error:"+error);
                      }
            
            });  
});
cs

line 13 : ajax로 받아온 data 객체를 alert으로 띄운다. 

CarModelHasDevModels.get(i).id.getDeviceModelId 와 유사하다. (여기서 id는 pk가 multi key라 id객체로 한번 더 묶임)

반응형
Comments