[AJAX] 서버로 데이터를 전송하여 조회된 객체를 응답데이터로 받기

jsp

회원번호 입력: <input type="number" id="input3">
<button onclick="test3();">조회</button>
	
<div id="output3"></div>
    <script>
        function test3(){
            $.ajax({
                url: "jqAjax3.do",
                data: {no: $("#input3").val()},
                success: function(result){
                    var resultStr = "회원번호: "+result.memberNo+"<br>"
                                    +"이름: "+result.name+"<br>"
                                    +"나이: "+result.age+"<br>"
                                    +"성별: "+result.gender+"<br>"
                    $("#output3").html(resultStr);
                },
                error: function(){
                    console.log("ajax 통신 실패");
                }
            });
        }
    </script>

 

 

 

AjaxController3

   : 데이터를 조회해왔다는 가정 하에 Member 객체에 해당 정보를 담는다.

 

1) GSON

   ① toJson(응답할 객체, 응답할 스트링(연결통로))

   ② response.getWriter()라는 통로로 객체 m을 응답한다. 이때 변환 시 자동으로 객체의 필드명으로 key값이 정해진다.

@WebServlet("/jqAjax3.do")
public class JqAjaxController3 extends HttpServlet {
    private static final long serialVersionUID = 1L;
       
    public JqAjaxController3() {
        super();
    }

    protected void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
        int memberNo = Integer.parseInt(request.getParameter("no"));
        Member m = new Member(1, "곽도철", 50, "여");
		
        // JSON 객체 형태
//    JSONObject jobj = new JSONObject();  // {}
//    jobj.put("memberNo", m.getMemberNo());  // {memberNo:1}
//    jobj.put("name", m.getName());  // {memberNo:1, name:"곽도철"}
//    jobj.put("age", m.getAge());  // {memberNo:1, name:"곽도철", age:50}
//    jobj.put("gender", m.getGender()); // {memberNo:1, name:"곽도철", age:50, gender:"여"}
//		
//    response.setContentType("application/json; charset=UTF-8");
//    response.getWriter().print(jobj);
		
        // GSON
        response.setContentType("application/json; charset=UTF-8");
        Gson gson = new Gson();
        gson.toJson(m, response.getWriter());
    }

    protected void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
        doGet(request, response);
    }
}

 

 

 

- 기본 화면

 

- 입력 후 화면