728x90
반응형
환경
- intellij, 자바11, mysql, mybatis, jsp
목록, 수정, 삭제를 만들어 봤습니다.
등록을 한번 만들어보겠습니다.
INSERT INTO study.notice (title, content, create_id, create_at)
VALUES('제목', '내용', '작성자', CURRENT_TIMESTAMP);
테스트로 만들었던 insert문을 이용해서 수정해서 만들겠습니다.
NoticeController
/** 게시판 등록 화면 */
@RequestMapping(value = "/insert-view", method = RequestMethod.GET)
public String noticeInsertView() {
return "notice/noticeInsert";
}
/** 게시판 등록 */
@RequestMapping(value = "/insert", method = RequestMethod.POST)
@ResponseBody
public int insertNotice(@RequestBody NoticeRequest noticeRequest) {
System.out.println("insertNotice noticeRequest ==> " + noticeRequest);
return noticeService.insertNotice(noticeRequest);
}
NoticeService
public int insertNotice(NoticeRequest request) {
return noticeMapper.insertNotice(request);
}
NoticeMapper
int insertNotice(NoticeRequest request);
Notice.xml
<!-- 게시판 등록 -->
<insert id="insertNotice" parameterType="com.example.springbasic.notice.dto.request.NoticeRequest">
INSERT INTO study.notice (title, content, create_id, create_at)
VALUES(#{title}, #{content}, #{createId}, CURRENT_TIMESTAMP);
</insert>
게시판 목록에 등록 버튼을 만들어줍니다.
<div>
<button type="button" onclick="insertNoticeMove();">등록</button>
</div>
// 등록화면 이동
function insertNoticeMove() {
location.href = "notice/insert-view";
}
noticeInsert.jsp 생성
<%@ page language="java" contentType="text/html; charset=utf-8" pageEncoding="utf-8"%>
<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c"%>
<!DOCTYPE html>
<html lang="en">
<head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>
<meta charset="UTF-8">
<title>게시판 등록</title>
</head>
<body>
<table border="1" cellspacing="0" cellpadding="0" width="90%">
<tr width="90%">
<td width="10%" align="center">작성자</td>
<td width="50%"><input type="text" name="createId" id="createId" style="width: 95%;" placeholder="작성자를 입력하세요."></td>
</tr>
<tr>
<td align="center">제목</td>
<td><input type="text" name="title" id="title" style="width: 95%;" placeholder="제목을 입력하세요."></td>
</tr>
<tr>
<td align="center">내용</td>
<td><textarea name="content" id="content" style="width: 95%;height: 200px;" placeholder="내용 입력하세요."></textarea></td>
</tr>
<tr>
<td colspan="2" align="center">
<button type="button" onclick=insertNotice();>등록</button>
<button type="button" onclick="noticeListMove();">목록</button>
</td>
</tr>
</table>
</body>
</html>
<script>
const insertNotice = () => {
const reqData = {
createId : document.querySelector("#createId").value,
title : document.querySelector("#title").value,
content : document.querySelector("#content").value
}
console.log(reqData);
$.ajax({
type: 'post',
url: '/notice/insert',
data: JSON.stringify(reqData),
dataType : "json",
contentType:"application/json",
success: function (resData) {
console.log(resData);
if (resData == 1) {
alert("등록완료")
}
},
error: function (err) {
console.log(err);
}
});
}
</script>
화면
기본적인 CRUD를 완성했습니다!!! 크으.. 너무 행복하네요.
이 게시판에 이제 뭘 더 추가할까 고민입니다.
생각해보고 추가 후 포스팅 하겠습니다.
소스는 깃을 확인해 주세요.
https://github.com/pork1375/spring-basic
GitHub - pork1375/spring-basic
Contribute to pork1375/spring-basic development by creating an account on GitHub.
github.com
감사합니다.
728x90
반응형
'개발 > Spring Boot' 카테고리의 다른 글
스프링부트(Spring Boot) swagger 적용하기 (0) | 2023.11.15 |
---|---|
스프링 부트(springBoot) jsp 파일업로드 만들기 (0) | 2023.10.10 |
스프링부트(Spring Boot) 게시판 만들기 #10 - 게시판 게시글 삭제 (0) | 2023.09.27 |
스프링부트(Spring Boot) 게시판 만들기 #9 - 게시판 상세 업데이트 (0) | 2023.09.26 |
스프링부트(Spring Boot) 게시판 만들기 #8 - 상세 만들기 (0) | 2023.09.25 |