1. update-form
{{> /layout/header}} <div class="container p-5"> <!-- 요청을 하면 localhost:8080/board/save POST로 요청됨 title=사용자입력값&content=사용자값 --> <div class="card"> <div class="card-header"><b>글 수정하기 화면입니다</b></div> <div class="card-body"> <form action="/board/1/update" method="post"> <div class="mb-3"> <input type="text" class="form-control" placeholder="Enter username" name="username" value="ssar"> </div> <div class="mb-3"> <input type="text" class="form-control" placeholder="Enter title" name="title" value="제목1"> </div> <div class="mb-3"> <textarea class="form-control" rows="5" name="content">내용1</textarea> </div> <button class="btn btn-primary form-control">글 수정하기 완료</button> </form> </div> </div> </div> {{> /layout/footer}}
이제 수정하기 버튼을 누르면 수정하기 페이지로 이동 됨 → get
휴대폰 apps는 HTML을 돌려받을 필요가 없기 때문에 GET 요청은 사용하지 않는다. 만들 일이 아예 없다.
boardController
@GetMapping("/board/{id}/update-form") public String updateForm(@PathVariable (name = "id") Integer id, HttpServletRequest request) { Board board = boardNativeRepository.findById(id); request.setAttribute("board", board); return "board/update-form"; }
update-form.mustache
화면 확인
action 만들자!
@PostMapping ... 돌려줘야할 페이지 (return)을 내가 결정해서 준다 !
수정 페이지 줘 -> get 요청 클릭해서 수정하기라는 액션이 일어나는거.. 가는거 -> action
BoardController
@PostMapping("/board/{id}/update") public String update(@PathVariable (name = "id") Integer id, String title, String content, String username) { System.out.println("id : " + id); System.out.println("title : " + title); System.out.println("content : " + content); System.out.println("username : " + username); return "redirect:board/" + id; }
만약, 주소 (where = ? 쿼리문)로 받는 대신 session으로 id를 찾아서 update를 받으려고 하면, 무조건 updateForm이 실행이 되어야지만 (updateForm에 session.setAttribute 되어있어야지만) update메소드에서 session id를 가져와서 id를 찾을 수 있기 때문에… XXXX
그냥 처음부터 주소 설계를 잘하자^^!
Repository
@Transactional public void updateById(Integer id, String title, String content, String username) { Query query = em.createNativeQuery("update board_tb set title = ?, content = ?, username = ? where id = ?"); query.setParameter(1, title); query.setParameter(2, content); query.setParameter(3, username); query.setParameter(4, id); query.executeUpdate(); }
테스트 해보기
@Test public void updateById_test() { //given int id = 1; String title = "제목수정1"; String content = "내용수정1"; String username = "bori"; //when boardNativeRepository.updateById(id, title, content, username); //then //해당 id로 조회해서 값 검증 Board board = boardNativeRepository.findById(id); System.out.println("updateById_test/board : " + board); assertThat(board.getTitle()).isEqualTo("제목수정1"); assertThat(board.getContent()).isEqualTo("내용수정1"); assertThat(board.getUsername()).isEqualTo("bori"); }
id, title, content, username이 모두 바뀌어있다.
컨트롤러 정리
@PostMapping("/board/{id}/update") public String update(@PathVariable (name = "id") Integer id, String title, String content, String username) { boardNativeRepository.updateById(id, title, content, username); return "redirect:board/" + id; }
이런걸 서버 사이드 랜더링이라고 한다. 서버에 요청해서 받아오니까 !
쓸데없이 어렵게 AJAX 하지 마라
Share article