<jQuery> 페이지 이동 시키기 (location.replace())

우선 이건 내가 프로젝트 진행중에 겪었던 일을 바탕으로 했기 때문에 필요한 사람만 참고하면 될 것 같다.

 

우리 페이지의 게시판 후기 등록 페이지인데 기존의 <form> 태그를 사용하지 않고 진행중이어서 저 등록버튼도 <submit> 기능을 담고 있지 않은 그저 일반 버튼에 불과한 상태다. 데이터를 컨트롤러단에 보내는 작업은 전부다 jquery ajax 를 이용해서 처리했다. 물론 <form>을 이용해서 submit 으로 편하게 처리를 해줄 수 있었지만 한번 새롭게 해보고 싶어서 데이터를 주고 받고 하는 작업을 ajax를 통해서 했었다. 

 

문제점은 post 방식으로 보내주고 나서 컨트롤러에서 redirect 로 페이지를 변경해주고 싶었지만 작동을 하지 않았다. 글을 등록하면 바로 그 등록된 페이지(detail 페이지)로 가고 싶었는데 그 방법을 찾다가 location.replace() 함수를 이용해보았다. 

 

우선 나는 ajax로 처리를 해주고 있기 때문에 success 부분에서 페이지 리로딩을 시켜주었다. 

 

 

 

이런식으로 저장시킬 데이터들을 보내고 받아올때 내가 방금 등록한 그 디테일 페이지의 id 값이 필요해서 data 라는 이름으로 받아주어서  url 매핑에 적어주었다. 

location.replace() 인자값으로 내가 보내고 싶은 페이지의 url 정보를 넣어주면 되겠다.

 

등록 전

 

등록을 누그면 바로 넘어간 자세한 페이지

 

 

간단한 정리!

 

** 스크립트에서 페이지 이동을 시켜주고 싶으면 location.replace() 사용

    다만 reaplace는 history 가 남지 않으므로 location.assign 혹은 href 사용

** 물론 ajax 는 싱글페이지로 화면의 데이터를 바꿔주면서 처리해주기 위함이니 웬만하면 <form> <submit> 을 이용해서 컨트롤러에서 redirect: 를 써주면 쉽게 해결되겠다. (나만...복잡하게...ㅠㅠ)