티스토리 뷰

반응형
Ajax에서 Controller로 값(parameter) 넘기기
$.ajax({
	url : "test.action",
	type : 'post',
	data : {
		name : "이름",
		age : "20",
		gender : "man"
	},
	success : function(data) {
				
     },
	error : function() {
		alert("error");
	}
});

방법 1.

@RequestMapping(value = "/test.action", method = { RequestMethod.POST })	
public void test(@RequestParam("name") String name,@RequestParam("age") String age,@RequestParam(
"gender") String gender) {

	System.out.println(name);
        System.out.println(age);
        System.out.println(gender);
		
}

방법 2.

@RequestMapping(value = "/test.action", method = { RequestMethod.POST })	
public void test(@RequestParam Map<String, Object> map) {

	System.out.println((String)map.get("name")); //Object여서 형 변환
        System.out.println((String)map.get("age"));
        System.out.println((String)map.get("gender"));
		
}

방법 3.

@RequestMapping(value = "/test.action", method = { RequestMethod.POST })	
public void test(@RequestBody UserDTO dto) throws Exception { 

	System.out.println(dto.getUserName()); 
        System.out.println(dto.getUserAge());
        System.out.println(dto.getUserGender());
		
}

UserDTO

public class UserDTO {
	private String UserName;
	private String UserAge;
	private String UserGender;
	public String getUserName() {
		return UserName;
	}
	public void setUserName(String userName) {
		UserName = userName;
	}
	public String getUserAge() {
		return UserAge;
	}
	public void setUserAge(String userAge) {
		UserAge = userAge;
	}
	public String getUserGender() {
		return UserGender;
	}
	public void setUserGender(String userGender) {
		UserGender = userGender;
	}
}

주의할 점 - @RequestParam, @RequestBody 가 다르다.


Controller에서  Ajax로 값(parameter) 넘기기

 

1. Controller

@RequestMapping(value = "/test.action", method = { RequestMethod.POST })
@ResponseBody // 자바 객체를 HTTP 응답 본문의 객체로 변환
public Object test(){ // Object 대신에 String, list<DTO>, Map<String,Object> 등 .. 도 사용 가능
	
   	// ex_1
        String text = "답변";
        
        // ex_2  
     	Map<String, String> map = new HashMap<String,String>(); 
        
        map.put("dog","강아지");
        map.put("cat","고양이");
        
        // ex_3
        List<MainDTO> list = service.main_list(map); // (Service, Dao 구현 되어야함)
        // list에 id, pw, content를 키값으로 값이 담겨있음
        // {"id":"admin"},{"pw":"1234"},{"content":"내용 입니다."}
        
	return list; // Ajax로 넘겨줄 값 text, map, list
    	
}

2. Ajax

$.ajax({
	url : "test.action",
	type : 'post',
	data : {
    
	},
	success : function(data) { // controllor에서 list를 return 받았음
    			alert(data);
                	alert(data.id); 
                    	alert(data.pw);
                    	alert(data.content);
                $.each(data,function(index, value) { // 값이 여러개 일 때는 반복문 사용
                	alert(index);
                    	alert(value.id); 
                	alert(value.pw); 
                    	alert(value.content);
                }
     },
	error : function() {
		alert("error");
	}
});

Controller와 Ajax 간의 데이터 교환이다.

데이터가 잘 넘어가는 확인 후 활용하자.

  • System.out.println();
  • alert();
  • console.log();

 

반응형

'[Ajax]' 카테고리의 다른 글

[Ajax] 동기 방식 - 비동기 방식 비교  (0) 2021.07.16
[Ajax] Ajax에서 값 return하기  (0) 2021.07.16
댓글
반응형