[spring MVC]노트정리 : Ajax 사용

💻 Ajax 사용허가

• Ajax 사용 시 servlet-context.xml에 ajax 사용허가를 추가해야함

	<!-- Ajax 사용허가 -->
	<mvc:annotation-driven/>
	
	<!-- spring에서 처리할 수 없는 요청은 tomcat이 처리 -->
	<mvc:default-servlet-handler/>

📌 String을 보내고 String을 받을 때

• home.do

<!-- ajax send(String) recv(String) -->
id:<input type="text" id="checkid"><br><br>
<button type="button" onclick="idcheckBtn()">아이디체크</button>
<br><br>

<script type="text/javascript">
function idcheckBtn() {
	
	$.ajax({
		url:"idcheck.do",
		type:"get",
		/* data:"id=" + $("#checkid").val(), */
		data:{id:$("#checkid").val()},
		success:function(msg){
			/* alert('success'); */
			alert(msg);
		},
		error:function(){
			alert('error');
		}
	})
}
</script>

• controller
  @ResponseBody는 Ajax통신을 의미하며 꼭 꼭 붙여줘야함!

	@ResponseBody	// -> ajax 통신을 의미 
	@RequestMapping(value="idcheck.do", 
    				method = RequestMethod.GET,
                    produces="application/String; charset=utf-8")
    				// utf-8은 String일때만 붙여줌 
	public String idcheck(String id) {
		System.out.println("id:" + id);
		
		String message = "오케이";
		return message;
	}

📌 object를 보내고 list로 받을 때

<!-- send(object) recv(list) -->
id : <input type="text" id="id" value="gdhong"><br>
pw : <input type="text" id="pwd" value="1234"><br>
name:<input type="text" id="name" value="홍길동"><br>
email:<input type="text" id="email" value="gdhong@naver.com"><br>
<button type="button" id="account">회원가입</button>

<script type="text/javascript">
$("#account").click(function(){
	// servlet-context.xml에 ajax 사용허가 
	let member = {
			"id" :$("#id").val(),
			"pwd":$("#pwd").val(),
			"name":$("#name").val(),
			"email":$("#email").val()
	};
	
	$.ajax({
		url:"account.do",
		type:"post",
		dataType:"json",
		data:member,
		async:true,
		success:function(list) {
			// alert('success');
			// alert(JSON.stringify(list));
			
			alert(list[1].name);
			
		},
		error:function(){
			alert('error');
		}
	})
});
</script>

• controller

	@ResponseBody
	@RequestMapping(value = "account.do", method = RequestMethod.POST)
	public List<MemberDto> account(MemberDto dto) {
		System.out.println(dto.toString());
		
		List<MemberDto> list = new ArrayList<>();
		list.add(new MemberDto("abc", "123", "abc", "aemail", 0));
		list.add(new MemberDto("bcd", "234", "bcd", "bemail", 0));
		list.add(new MemberDto("cde", "345", "cde", "cemail", 0));
		
		return list;
	}