728x90
반응형
SMALL
Spring Container 구도
게시판에 글쓰기 만들기
1. list.jsp 에 글쓰기 버튼 추가
2. head태그에 자바 스크립트 추가
(버튼을 클릭했을 때 다른 페이지로 이동해주기위해서)
3. boardController.java에 register로 이동하는 메서드 생성
4. register.jsp 새로만들기 ( template.jsp 복붙)
5. bootstrap 가져오기
https://www.w3schools.com/bootstrap4/
Bootstrap 4 Tutorial
W3Schools offers free online tutorials, references and exercises in all the major languages of the web. Covering popular subjects like HTML, CSS, JavaScript, Python, SQL, Java, and many, many more.
www.w3schools.com
다음 폼의 코드를 복사하여 register.jsp의 card-body 태그 내에 붙여넣기
6. 제목, 내용, 작성자를 입력할 수 있게 수정
글쓰기 버튼 누르면 넘어가는 register.do 페이지
<최종 list.jsp 코드>
<%@page import="kr.smhrd.entity.Board"%>
<%@page import="java.util.List"%>
<%@ page language="java" contentType="text/html; charset=UTF-8"
pageEncoding="UTF-8"%>
<%
List<Board> list = (List<Board>)request.getAttribute("list");
%>
<!DOCTYPE html>
<html lang="en">
<head>
<title>Bootstrap Example</title>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap@4.6.1/dist/css/bootstrap.min.css">
<script src="https://cdn.jsdelivr.net/npm/jquery@3.6.0/dist/jquery.slim.min.js"></script>
<script src="https://cdn.jsdelivr.net/npm/popper.js@1.16.1/dist/umd/popper.min.js"></script>
<script src="https://cdn.jsdelivr.net/npm/bootstrap@4.6.1/dist/js/bootstrap.bundle.min.js"></script>
<script>
$(document).ready(function(){
$("button").click(function(){
location.href="register.do";
});
});
</script>
</head>
<body>
<div class="container">
<h2>Spring MVC01</h2>
<div class="card">
<div class="card-header">BOARD</div>
<div class="card-body">
<table class = "table table-bordered table-hover">
<thead>
<th>번호</th>
<th>제목</th>
<th>작성자</th>
<th>작성일</th>
<th>조회수</th>
</thead>
<tbody>
<%for(Board vo : list){%>
<tr>
<td><%=vo.getIdx() %></td>
<td><%=vo.getTitle()%></td>
<td><%=vo.getWriter()%></td>
<td><%=vo.getIndate() %></td>
<td><%=vo.getCount() %></td>
</tr>
<% }%>
</tbody>
</table>
<button class="btn btn-sm btn-primary">글쓰기</button>
</div>
<div class="card-footer">AI.BigData 취업역량강화_조정은</div>
</div>
</div>
</body>
</html>
BoardController.java에 insert 메서드 추가하기
BoardMapper.java에 메서드 추가
BoardMapper.xml에 id가 register인 insert 태그 추가
register.jsp 내에 action과 method 추가
register.jsp 최종코드
<%@ page language="java" contentType="text/html; charset=UTF-8"
pageEncoding="UTF-8"%>
<!DOCTYPE html>
<html lang="en">
<head>
<title>Bootstrap Card</title>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap@4.6.1/dist/css/bootstrap.min.css">
<script src="https://cdn.jsdelivr.net/npm/jquery@3.6.0/dist/jquery.slim.min.js"></script>
<script src="https://cdn.jsdelivr.net/npm/popper.js@1.16.1/dist/umd/popper.min.js"></script>
<script src="https://cdn.jsdelivr.net/npm/bootstrap@4.6.1/dist/js/bootstrap.bundle.min.js"></script>
</head>
<body>
<div class="container">
<h2>Spring MVC01</h2>
<div class="card">
<div class="card-header">BOARD</div>
<div class="card-body">
<form action="insert.do" method="post">
<div class="form-group">
<label for="title">제목:</label>
<input type="text" class="form-control" placeholder="Enter title" name="title">
</div>
<div class="form-group">
<label for="content">내용:</label>
<textarea rows="7" class="form-control" name="content"></textarea>
</div>
<div class="form-group">
<label for="writer">작성자:</label>
<input type="text" class="form-control" placeholder="Enter writer" name="writer">
</div>
<button type="submit" class="btn btn-sm btn-primary">등록</button>
<button type="reset" class="btn btn-sm btn-warning">취소</button>
<button type="button" class="btn btn-sm btn-success">목록</button>
</form>
</div>
<div class="card-footer">AI.BigData 취업역량강화_조정은</div>
</div>
</div>
</body>
</html>
글쓰기에서 등록을 하면
잘 들어가 있습니당
<깨지는 한글 안깨지게 하기>
다음 코드를 web.xml의 web-app태그 내에 붙여넣기
<filter>
<filter-name>encoding-filter</filter-name>
<filter-class>org.springframework.web.filter.CharacterEncodingFilter</filter-class>
<init-param>
<param-name>encoding</param-name>
<param-value>UTF-8</param-value>
</init-param>
</filter>
<filter-mapping>
<filter-name>encoding-filter</filter-name>
<url-pattern>/*</url-pattern>
</filter-mapping>
안깨지고 잘 나옵니당
Parameter 구도
728x90
반응형
LIST
'스마트인재개발원 > Spring' 카테고리의 다른 글
| [Spring]게시판 만들기(8) - list를 활용한 foreach문 사용 / jstl 날짜형식변경 (0) | 2022.10.21 |
|---|---|
| [Spring] 스프링 JSTL/EL 사용법 (0) | 2022.10.20 |
| [Spring] DB연결 최종 코드들 (0) | 2022.10.20 |
| [Spring]게시판 만들기(6) - DB연결 최종 (0) | 2022.10.20 |
| [Spring] 게시판 만들기(5) - root-context.xml에 DB연결 ( HikariCP, JDBC, Spring-jdbc API) (0) | 2022.10.20 |
