1月28日(2)

45310 ワード

きょう習った

  • 連絡先アプリケーションの完了(1)
  • DBデータの受信方法の作成

    	public ContactDAO(DataSource dataSource) {
    		this.dataSource = dataSource; // 객체 생성시 Connection pool에 DataSource를 입력
    	}
    	
    	// 모든 연락처를 list로 return
    	public List<Contact> findAll() {
    		List<Contact> list = new ArrayList<Contact>();
    		
    		try {
    			conn = dataSource.getConnection();
    			pstmt = conn.prepareStatement("select * from contacts");
    			rs = pstmt.executeQuery();
    			
    			while (rs.next()) {
    				Contact contact = new Contact();
    				contact.setId(rs.getInt("id"));
    				contact.setName(rs.getString("name"));
    				contact.setEmail(rs.getString("email"));
    				contact.setPhone(rs.getString("phone"));
    				
    				list.add(contact);
    			}
    		} catch (SQLException e) {
    			System.out.println("SQL에러");
    		} finally {
    			closeAll();
    		}
    		
    		return list;
    	}

    ControllerはDBデータを「連絡先」に保存してリストします。jspに移動

    	private void list(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
    		List<Contact> list = contactDao.findAll();
    		request.setAttribute("contacts", list);
    		
    		RequestDispatcher dispatcher = request.getRequestDispatcher("contact/list.jsp");
    		dispatcher.forward(request, response);

    tableを使用して行ごとに変更、削除ボタンを追加し、入力したデータを出力します。

            <table class="table table-hover">
            	<thead>
                	<tr>
                    	<th>#</th>
                        <th>이름</th>
                        <th>이메일</th>
                        <th>연락처</th>
                        <th width="5%">&nbsp;</th>
                        <th width="5%">&nbsp;</th>
                    </tr>
                </thead>
                <tbody>
                <c:forEach var="contact" items="${contacts}">
                	<tr>
                    	<td><c:out value="${contact.id}" /></td>
                        <td><c:out value="${contact.name}" /></td>
                        <td><c:out value="${contact.email}" /></td>
                        <td><c:out value="${contact.phone}" /></td>
                        <td>
                        	<button type="button" class="btn btn-info btn-sm btn-edit" data-id="<c:out value='${contact.id}' />">
                        		수정
                        	</button>
                        </td>
                        <td>
                        	<button type="button" class="btn btn-danger btn-sm btn-delete" data-id="<c:out value='${contact.id}' />" data-toggle="modal" data-target="#modal-delete">
                                                            삭제
                            </button>
                        </td>
                    </tr>
                </c:forEach>
                </tbody>
            </table>

    [追加](Add)ボタンをクリックすると

  • モデムウィンドウ
  • 			<button type="button" class="btn btn-primary btn-add" data-toggle="modal" data-target="#modal-add-update">
    				추 가 
    			</button>
    フォーム文を使用して
  • モードウィンドウで作成されたデータ転送
  •     <div class="modal fade" id="modal-add-update" tabindex="-1" aria-labelledby="addUpdateLabel" aria-hidden="true">
    	    <div class="modal-dialog">
    	        <div class="modal-content">
    	            <div class="modal-header">
    	                <h5 id="title-add-upd" class="modal-title"></h5>
    	                <button type="button" class="close" data-dismiss="modal" aria-label="Close">
    	                    <span aria-hidden="true">&times;</span>
    	                </button>
    	            </div>
    	            <form autocomplete="off" action="<%= request.getContextPath()%>/Contacts">
    	            <input type="hidden" name="action" value="post" > 
    		            <div class="modal-body">
    	                	<div class="form-group">
    		                    <label for="name">name</label>
    		                    <input type="text" class="form-control" id="name" name="name" required>
    		                </div>
    		
    		                <div class="form-group">
    		                    <label for="email">Email</label>
    		                    <input type="email" class="form-control" id="email" name="email" required>
    		                </div>
    		
    		                <div class="form-group">
    		                    <label for="phone">phone</label>
    		                    <input type="text" class="form-control" id="phone" name="phone" required maxlength="15">
    		                </div>
    		            </div>
    		            <div class="modal-footer">
    		            	<button type="submit" class="btn btn-success btn-action">저장</button>
    		                <button type="button" class="btn btn-secondary btn-action" data-dismiss="modal">취소</button>
    		            </div>
    	            </form>
    	        </div>
    	    </div>
    	</div>
    データは
  • コントローラに送信され、データベースに保存される
  • .
    	private void save(HttpServletRequest request, HttpServletResponse response) throws IOException {
    		request.setCharacterEncoding("UTF8");
    		
    		String name = request.getParameter("name");
    		String email = request.getParameter("email");
    		String phone = request.getParameter("phone");
    		
    		Contact contact = new Contact(name, email, phone);
    		
    		contactDao.save(contact);
    		
    		response.sendRedirect("Contacts?action=list");
    	}
  • DB記憶方法
  • 	public boolean save(Contact contact) {
    		boolean rowAffected = false;
    		try {
    			conn = dataSource.getConnection();
    			pstmt = conn.prepareStatement("insert into contacts(name, email, phone) values(?,?,?)");
    			
    			pstmt.setString(1, contact.getName());
    			pstmt.setString(2, contact.getEmail());
    			pstmt.setString(3, contact.getPhone());
    			
    			rowAffected = pstmt.executeUpdate() > 0;
    		} catch (SQLException e) {
    			System.out.println("DB 저장 실패");
    		}
    		return rowAffected;
    	}