Post 방식으로 페이지 이동하기

jsp에서 <a>태그에 href값을 주면 get방식으로 넘어간다. 

하지만 post로 넘기고 싶다면?

=> onClick이벤트로 자바스크립트 함수를 추가하고 그 함수안에서 post로 넘기면 된다.

 

 

1. 컨트롤러로 넘기는 값이 없을때

(1) JSP (form 태그로 안감싸도 된다.)

<a href="javascript:void(0)" onClick="javascript:goPost()">클릭시 POST로 페이지 </a>

(2) Javascript 함수 (method는 post, 컨트롤러 주소는 goPost.do)

function goPost(){
    let f = document.createElement('form');
    f.setAttribute('method', 'post');
    f.setAttribute('action', 'goPost.do');
    document.body.appendChild(f);
    f.submit();
}

 

(3)Controller (goPost.do로 호출되고 post.jsp라는 페이지로 이동한다)

@PostMapping("goPost.do")
public String go_post(){
    return "post";
}

 

 

2. 컨트롤러로 넘기는 값이 있을때

(1) JSP (jstl 태그의 값을 인수로 넘겨준다고 쳤을때)

<a href="javascript:listView('${list.userid}')">유저아이디</a>

<a href="getView.do?userid=${list.userid}">유저아</a>

 

 

(2) Javascript 함수

hidden 타입의 input태그를 만들어서 그 value값에 전달하고자 하는 인수를 집어넣고, userid란 이름으로 넘기겠다는 뜻이다.

method는 post, 컨트롤러 주소는 view.do이다.

function listView(userid){
    let f = document.createElement('form');
    
    let obj;
    obj = document.createElement('input');
    obj.setAttribute('type', 'hidden');
    obj.setAttribute('name', 'userid');
    obj.setAttribute('value', userid);
    
    f.appendChild(obj);
    f.setAttribute('method', 'post');
    f.setAttribute('action', 'view.do');
    document.body.appendChild(f);
    f.submit();
}

@PostMapping("view.do")
public String getView(String userid, Model model){
    User userView = userService.view(userid);
    model.addAttribute("userView", userView);
    return "view";
}