[JSP] Bài tập JSTL: core,query, update


Trong bài này chúng ta tiếp tục xây dụng trang danh sách và cập nhật

Trang danh sách hiển thị tất cả nội dung trong bảng Employees với ID >9, trên trang danh sách chứa liên kết tới trang thêm,hiệu chỉnh và có xác nhận trước khi xóa.

Thực hiện xây dựng nội dung trang danh sách như sau:

<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<%@ taglib prefix="sql" uri="http://java.sun.com/jsp/jstl/sql" %>
<%@page contentType="text/html" pageEncoding="UTF-8"%>
<!DOCTYPE html>
<html>
    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
        <title>JSP Page</title>
    </head>
    <body>
        <a href="add.jsp">Add</a>
<h1>List!</h1>
<!--connect to db server-->
        <sql:setDataSource var="conn" scope="session"                            user="sa" password="sa"                            url="jdbc:sqlserver://LAB03_GV\\MSSQLSERVER2012;databaseName=northwind;"                            driver="com.microsoft.sqlserver.jdbc.SQLServerDriver"/>

        <!--create delete command and execute it-->
        <c:if test="${! empty param.id}">
            <sql:update sql="delete From employees where employeeid =?"                          dataSource="${conn}"                         var="rowCount" scope="session">
                <!--delete employee <!--create selete command and execute it-id get from url param-->
                <sql:param value="${param.id}"/>
            </sql:update>
        </c:if>
        <!--refresh list-->
        <sql:query sql="Select FirstName, LastName,EmployeeID                     From employees where employeeid > 9"
                   dataSource="${conn}"
                   var="Employees" scope="session">
        </sql:query>
<table style="border: solid thin blue; width: 500px; margin-left: auto; margin-right: auto;">
<tr style="border: solid thin blue;">
                <!--show table header-->
                <c:forEach items="${Employees.columnNames}" var="colName">
<th>
                        <c:out value="${colName}"/></th>
</c:forEach>
<th>
                    Oper.</th>
</tr>
<!--show data-->
            <c:forEach items="${Employees.rowsByIndex}" var="Employee">
<tr>
                    <c:forEach items="${Employee}" var="cell">
<td>
                            <c:out value="${cell}"/></td>
</c:forEach>
<td>
                        <!--confirm delete-->
                        <a href="?id=${Employee[2]}" onclick="return confirm('Are you sure?');">Del</a> |
                        <a href="edit.jsp?id=${Employee[2]}&f=${Employee[0]}&l=${Employee[1]}">edit</a></td>
</tr>
</c:forEach></table>
</body>
</html>

Khi chọn một nhân viên để xóa danh sách sẽ chuyển qua trang edit.jsp như sau:

<%@ taglib prefix="sql" uri="http://java.sun.com/jsp/jstl/sql" %>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<%@page contentType="text/html" pageEncoding="UTF-8"%>
<!DOCTYPE html>
<html>
    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
        <title>JSP Page</title>
    </head>
    <body>
<h1>Employee!</h1>
<c:if test="${! empty param.id}">
            <c:set var="id" value="${param.id}" scope="session"/>
        </c:if>

        <c:if test="${! empty param.btnSave}">
            <!--check f and l input-->
            <c:if test="${! empty param.txtFirstName                            && ! empty param.txtLastName}">
                  <!--connect to db server-->
                  <sql:setDataSource var="conn" scope="session"                                      user="sa" password="sa"                                      url="jdbc:sqlserver://LAB03_GV\\MSSQLSERVER2012;databaseName=northwind;"                                      driver="com.microsoft.sqlserver.jdbc.SQLServerDriver"/>

                  <!--create insert command and execute it-->
                  <sql:update dataSource="${conn}" var="rowCount" scope="session"                               sql="update employees set Firstname=?, LastName=? where employeeid=?">
                      <sql:param value="${param.txtFirstName}"/>
                      <sql:param value="${param.txtLastName}"/>
                      <sql:param value="${sessionScope.id}"/>
                  </sql:update>
                  <!--if add ok-->
                  <c:if test="${rowCount > 0}">
                      <% response.sendRedirect("list.jsp");%>
                  </c:if>
                  <!--Notify if can not add-->
                  <c:if test="${rowCount <= 0}">
                      Can not update this employee
                  </c:if>
            </c:if>
            <!--Display err if Firstname and lastname not valid-->
            <c:if test="${ empty param.txtFirstName                             || empty param.txtLastName}">
                  FirstName and LastName can not be null !!
            </c:if>
        </c:if>
<form method="POST">
            Firstname:

            <input type="text" name="txtFirstName" value="${param.f}" />

            Lastname:

            <input type="text" name="txtLastName" value="${param.l}" />

            <input type="submit" value="Save" name="btnSave" />
        </form>

    </body>
</html>

Video tham khảo:

JSTL phần 1
JSTL phần 3

Advertisements

Phản hồi

Mời bạn điền thông tin vào ô dưới đây hoặc kích vào một biểu tượng để đăng nhập:

WordPress.com Logo

Bạn đang bình luận bằng tài khoản WordPress.com Log Out / Thay đổi )

Twitter picture

Bạn đang bình luận bằng tài khoản Twitter Log Out / Thay đổi )

Facebook photo

Bạn đang bình luận bằng tài khoản Facebook Log Out / Thay đổi )

Google+ photo

Bạn đang bình luận bằng tài khoản Google+ Log Out / Thay đổi )

Connecting to %s