ch4 06. 게시판 읽기, 쓰기, 삭제, 수정 기능 구현(2)

4. 게시물 쓰기 기능의 구현

- 게시물 목록에서 글쓰기 버튼을 하나 추가하고, 글쓰기 버튼을 클릭하면 BoardController의 write() 메서드 호출(/board/wirte GET). 

write()는 board.jsp 파일을 보여주고 읽기일 땐 readonly, 글쓰기일 때는 readonly를 해제해준다. 

글쓰기일땐 mode=new로 주고, board값이 new이면 readonly를 해제하도록 작성

읽기와 글쓰기는 유지 보수 관리 측면에서 같은 화면으로 사용.

 

 

- boardList에 button 생성

boardList.jsp

- board에 mode가 new이면 글쓰기 기능으로 설정

boardList.jsp

- BoardController에 write() 메서드 추가

 

글쓰기 버튼이 생기고, readonly가 해제되어 글을 작성할 수 있게 되었다. 

 

- 제목과 내용을 입력한다음 등록을 누르면 Controller의 write() 메서드를 호출. (POST 맵핑)

그러면 이 writer가 boardService의 wirte() 호출해서 글 내용이 담긴 Dto를 DB에 저장한다. 

그 다음에 redirect:/board/list를 통해 여기 맵핑되어있는 list() 메서드가 호출된다. (redirect는 항상 GET)

그러면 이 list가 getPage()를 호출해서 게시물 목록을 가져오고, 그 게시물 목록을 화면에 보여준다. 

최신글이기 때문에 첫 페이지에 보여준다.(페이지 값을 안주면 첫 페이지에 보일 것이다.)

 

- board.jsp에 writeBtn 생성

 

- BoardController에 write() 메서드 생성(Post Mapping)  

- board.jsp에 알림 추가

- boardList.jsp

 

 

이후 게시물을 작성해서 등록하면 성공적으로 등록되었다는 알림과 함께 새 게시물이 등록되었음을 확인할 수 있다. 

 

 

 

예외도 한 번 확인해보자. 

BoardServiceImpl

다음과 같이 예외가 발생하도록 코드를 수정해준 후 서버를 재실행한다. 

글을 작성하고 등록을 누르면 다음과 같이 예외가 발생하게 된다. 

작성하던 내용이 살아있는걸 볼 수 있다. 

BoardController에서 m.addAttribute(boardDto)를 통해 예외가 발생했을 때 boardDto에 있는 내용을 board.jsp로 

전달해주기 때문에 에러가 나도 입력했던 내용을 잃어버리지 않을 수 있다. 

 

 

 

5. 게시물 수정 기능의 구현

- board.jsp에서 읽기를 하다가 수정 버튼을 누르면, 제목이 수정으로 바뀌고 readonly상태가 해제된다. 

$("input[name=title]", "#form").attr('readonly', false);
$("textarea", "#form").attr('readonly', false);

위 내용에 해당하는 코드이다. 

readonly였던게 false로 바뀌면서 수정할 수 있게 된다. 

내용을 작성하고 등록버튼을 누르면 글쓰기처럼 똑같이 작동한다. 

<input name="title" type="text" value="no title220" placeholder="제목을 입력해주세요." readonly='readonly'>
<textarea name="content" rows="20" placeholder="내용을 입력해주세요." readonly='readonly'}>no content220</textarea>

name, type, value를 다 attribute라고 한다. 

 

attribute VS property

attribute는 html 태그 안에 적어주는 것이고,

property는 태그 하나하나를 브라우저가 읽으면 new InputElement("title","text"..) 이런식으로 생성자의 값이 들어간다. 

해당 정보들을 가지고 브라우저가 객체를 생성한다. (자바로 따지면 iv)

생성된 객체의 속성이다. 

 

작성한 다음 등록 버튼을 누르면 컨트롤러의 modify 메서드에게 POST로 요청이 전송되고, Service의 modify를 호출하면 

작성한 내용이 DB에 등록된다. 

그 다음에 list로 redirect해서 list가 페이지를 보여주는 과정은 같다. 

 

boardMapper.xml

작성자가 일치하는지 확인한다. 

board.jsp

BoardController.java

이 다음 서버를 실행해서 작성한 게시물에 들어가면 처음에는 readonly 상태이기 때문에 글이 수정되지 않는다. 

하지만, 수정 버튼을 누르면 글 수정이 가능해졌다. 

등록을 누르면 내용이 컨트롤러로 전송되면서 DB가 업데이트 된다.