Với CSS3, các nhà phát triển có thể sử dụng hiệu ứng như bóng, gradient, chuyên động, và thậm chí là hoạt hình để tăng cường trải nghiệm người dùng.. Không giống như HTML và CSS, JavaScr
Javabean 3 Business
Tại sao sử dụng JSP?
Các trang JavaServer thường phục vụ cùng một mục đích như các chương trình được thực hién bang cach sir dung Common Gateway Interface (CGI) Nhung JSP cung cấp một số lợi thế so vi CGI
- _ Hiệu suất tốt hơn đáng kế vì JSP cho phép nhúng các thành phần động trong các trang HTML thay vì có các tệp CGI riêng biệt
- _ JSP luôn được biên soạn trước khi chúng được xử lý bởi máy chủ không giống như CGI/ Perl, yéu cau may chu tải một trình thông dịch và tập lệnh đích mỗi khi trang duoc request
- Giống như Servlet, JSP cũng có quyền truy cập vao tat ca cac Enterprise Java APIs, bao gm JDBC, JNDI, EJB, JAXP vv
- Cac trang JSP c6 thé duoc str dung két hop vdi cac servlet xử lý logic nghiệp vụ model được hỗ trợ bởi Java servlet
JSP là một phần của Java EE, một nên tảng hoàn chỉnh cho các ứng dụng enterprise.
Thư viện JSTL : Thư viện thẻ tiêu chuẩn của trang JavaServer (JSTL) gói gọn chức năng cốt lõi chung cho
rằng việc triển khai các thẻ được tối ưu hóa
JSTL có các thẻ lặp và thẻ điều kiện để xử lý điều khiến luồng, các thẻ để thao tác Tài liệu XML, thẻ quốc tế hóa, thẻ để truy cập cơ sở dữ liệu bằng SQL và các chức năng thường dùng kết nối cơ sở dữ liệu (API) Java API Kết nối cơ sở dữ liệu Java (IDBC) cho phép bạn gọi các lệnh SQL từ Phương pháp ngôn ngữ lập trình Java Bạn sử dụng API JDBC khi bạn có một truy cập cơ sở dữ liệu
Bạn cũng có thể sử dụng API JDBC từ một servlet hoặc một Trang JSP để truy cập cơ sở dữ liệu trực tiếp mà không cần thông qua Enterprise Bean
API JDBC co hai phan: giao dién cap img dung được ứng dụng sử dụng các thành phần để truy cập cơ sở dữ liệu và giao diện của nhà cung cấp dịch vụ để đính kèm trình điều khiên JDBC vào nền tảng Java EE
Dựa vào trang chủ của thư vién JSTL chung ta co 5 loại chính như sau:
Chức năng Mô tả - Khai báo
Chứa các lệnh điều khiến như như if, choose when otherwise,vòng lặp như forEach Để sử dụng JSTL core tags, bạn cần khai báo vào trong trang JSP đang sử dụng như sau:
(Formatting and Localization Tags) Các thẻ cơ bản
Core Tags) s
Các thẻ định dạng và Thông thường loại thẻ này dùng để định dạng và quốc tế hóa, thường sử dụng như để định dạng số, ngày địa phương hóa (quốc _ | tháng năm muốn sử dụng bạn cần khai báo vào trong trang JSP đang sử dụng như sau: tế hóa) ô
Chức năng chính của loại thé nay là phân tích và đọc dữ liệu từ file XML.Muốn sử dụng bạn cần khai báo Các thẻ XML vào trong trang JSP đang sử dụng như sau:
XML Tags) °
Mô hình MVC
Mô hình MVC làm mô hình phần mềm dùng đề tạo lập giao diện người dùng , mô hình này gồm 3 thành phân chính:
Model có chức năng quản ly và xử lý dữ liệu
View có nhiệm vụ hiền thị dữ liệu cho người dùng
Controller có chức năng điều khiến tương tác giữa Model và View
jm 5 —() request-?>| Controller Model
send data model
response——————_ View
MVC là một trong mô hình lập trình hiện đại nhất hiện nay Database a Model
Một trong những thành phần quan trọng nhất của mô hình MVC trong Java Đây là bộ phận làm nhiệm vụ quản lý dữ liệu Model có chức năng vận chuyển thông tin từ nội hàm đề hiển thị đến người dùng thông qua màn hình và xử lý các thông tin để người dùng dễ dàng tiếp cận nhất
Model hoàn toàn độc lập với các thành phan còn lại trong MVC và nó chứa các tác vụ cần thiết nhất cho quá trình lập trình b View Thành phân tiếp theo chúng ta sẽ nhắc đến ở mô hình MVC trong Java, đó là View Đối với người dùng thì View có vai trò thiết yếu Nó thực hiện nhiệm vụ tạo tương tác với người dùng và hiển thị các kết quả từ tầng Controller Đồng thời, View cũng thực hiện việc tiếp nhận các hoạt động, yêu cầu của người dùng để chuyển đến Controller xử lý.Nói một cách dễ hiều Các thành phần trong MVC giống như một website View chính là các trang giao diện hiển thị những gì mà người dùng nhìn thay c Controller Khi nhắc tới các thành phần ở mô hình MVC nhất định không thê bỏ qua Controller Nếu không có thành phân này thì mợi hoạt động của Model hay View đều không còn giá trị
Controller thực hiện chức năng kết nỗi tương tác giữa View và Model Nó định nghĩa các lệnh và thực hiện xử lý các lệnh trong hệ thống Controller đối chiếu hành động của người dùng từ View và tương tác với Model đề chuyên tải thông tin cần thiết đến người dùng
——> ch set processing result models Repository
: == mu: " | reference processing result models eee implemented by developers ees provided by Spring Source
(sess ~ Provided sometimes implemented by developers by SpringSource
Mô hình MVC được ứng dụng để tối ưu lập trình web
Database 1 Biéu dé database
id firstName userId lastName role status total
2 Mô tả dữ liệu Tạo các thuộc tính của sản phâm:
Danh mục sản phâm được chia gồm 3 phần gồm: Food, Drink và combo
Lọc các sản phẩm là FOOD từ ALL
Pork meatball Bread, pork meatball, salad, tomato, 50 bread cucumber beef steak Beef, lemon, salad, pepper, cucumber 70
Beef soup Beef, water, red pumpkin, cilantro 30
Vegetable fried rice | Rice, egg, cucumber, pepper, cilantro 40
`“ beef Bread, beef, tomato, cheese 30
Spaghetti Pasta, tomato, cheese 35 cat with tomato Pasta, tomato, vegetable 40
Mixed pasta Pasta, egg, tomato 50
Grilled pork Pork, pepper, vegetable 35
Middel rare beef Beef, lemon, salad, pepper, cucumber 60
16 banh mi thit heo Bo bit tét Bo ham
Cơm chiên rau củ Hamberger thập Mì sốt cà chua cẩm
Nui sốt cà chua Nui xào thập Thịt nướng mọi cẩm
Lọc các sản phẩm là DRINK tir ALL
Ice blended matcha | Matcha, ice, cheese cream 20
Carrot juice Carrot, water, sugar 20
Beetroot juice Beetroot, water, sugar 20
Pineapple juice Pineaapple, green apple 25
Pree mixed milk Oreo, cheese cream, milk tea 25
Kon va Tea, orange, lemongrass, peach 25
Strawberry tea Strawberry, tea, lemon, sugar 25
Cream cheese tea Cream, cheese, tea 20
Brown sugar pearl brown sugar, milk tea, pearl 25 milk tea
Lemon tea Lemon, tea, sugar 15
Bang 2 Thuéc tinh DRINK
18 beetroot _juice brown_sugar_pea carrot_juice rl_milk_tea cream_cheese te ice_blended_mat lemon_tea a cha oreo_mixed_milk peach_orange le pineapple juice
Hinh 2 Drink Image 19
Là các phần combo gồm nhiều phan FOOD va DRINK
Tên Miéu ta Gia k fe Combo onea fora Salad, traditional korea food, 2 drinks 200 family
Combo chicken Chicken soup, | drink 100 soup
Combo lunch meal Rice, kimchi, 3 foods, 2 drinks 150 for 2 people
Combo fast food Spaghetti, pepsi, French fries 100
Combo kimbap Kimbap, onigiri, fruit 200 korea
Combo Hot pot Seafood hotpot, drinks 200
Combo K oneal Korean mixed rice, drinks 150 mixed rice
Combo Korean K Korean barbecue, drinks 150 barbecue
Combo Kimbap for Kimbap and drink 80
combo 2 nguoi
combo gà nước combo no cành hong kimbap nước combo cháo combo cơm thập nước cẩm nước j ea ey | combo thi trifng combo thit nướng
Hinh 3 Combo Image
Demo code
[id] INT IDENTITY (1, 1) NOT NULL, [name] VARCHAR (255) NOT NULL, PRIMARY KEY CLUSTERED ([id] ASC)
INSERT INTO [dbo].[Category] ([name]) VALUES
bang Product CREATE TABLE [dbo].[Product] ( [id] INT IDENTITY (1, 1) NOT NULL, [idcategory] INT NOT NULL, [name] VARCHAR (255) NOT NULL, [description] VARCHAR (255) NOT NULL, [price] FLOAT (53) NOT NULL, [image] VARCHAR (255) NOT NULL, PRIMARY KEY CLUSTERED ([id] ASC),
FOREIGN KEY ([idcategory]) REFERENCES [dbo].[Category] ([id]) )
INSERT INTO [dbo].[Product] ([idcategory], [name], [description], [price], [image]) VALUES
(1, ‘Pork meatball bread’, 'Bread, pork meatball, salad, tomato, cucumber’, 50, 'pork_meatball_bread.jpg'), (1, ‘Beef steak’, 'Beef, lemon, salad, pepper, cucumber’, 70, 'beef_steak.jpg'),
(1, ‘Beef soup’, 'Beef, water, red pumpkin, cilantro’, 30, 'beef_soup.jpg'), (1, 'Vegetable fried rice’, ‘Rice, egg, cucumber, pepper, cilantro’, 40, 'vegetable_fried_rice.jpg'), (1, ‘Hamburger beef steak’, ‘Bread, beef, tomato, cheese’, 30, ‘hamburger_beef_steak.jpg'), (1, ‘Spaghetti’, ‘Pasta, tomato, cheese’, 35, 'spaghetti.jpg'),
(1, 'Pasta with tomato sauce’, 'Pasta, tomato, vegetable’, 40, 'pasta_with_tomato_sauce.jpg'), (1, 'Mixed pasta’, ‘Pasta, egg, tomato’, 50, 'mixed_pasta.jpg'),
(1, 'Grilled pork’, ‘Pork, pepper, vegetable’, 35, ‘grilled_pork.jpg'), (1, ‘Middle rare beef’, ‘Beef, lemon, salad, pepper, cucumber’, 60, 'middle_rare_beef.jpg'), (2, ‘Ice blended matcha’, 'Matcha, ice, cheese cream’, 20, 'ice_blended_matcha.jpg'), (2, ‘Carrot juice’, ‘Carrot, water, sugar’, 20, 'carrot_juice.jpg'),
(2, ‘Beetroot juice’, ‘Beetroot, water, sugar’, 20, beetroot _juice.jpg'), (2, ‘Pineapple juice’, Pineapple, green apple’, 25, ‘pineapple _juice.jpg'), (2, ‘Oreo mixed milk tea’, ‘Oreo, cheese cream, milk tea’, 25, 'oreo_mixed_milk_tea.jpg'), (2, "Peach orange lemongrass tea’, 'Tea, orange, lemongrass, peach’, 25,
"peach_orange_lemongrass_tea.jpg'), (2, 'Strawberry tea', 'Strawberry, tea, lemon, sugar', 25, 'strawberry_tea.jpg'), (2, 'Cream cheese tea', 'Cream, cheese, tea', 20, 'cream_cheese_tea.jpg'), (2, 'Brown sugar pearl milk tea', 'Brown sugar, milk tea, pearl', 25, 'brown_sugar_pearl_milk_tea.jpg'), (2, 'Lemon tea', 'Lemon, tea, sugar"', 15, 'lemon_tea.jpg'),
(3, 'Combo Korea for a family', 'Salad, traditional korea food, 2 drinks', 200, 'combo_korea_for_family.jpg'), (3, 'Combo chicken soup', 'Chicken soup, 1 drink', 100, 'combo_chicken_soup.jpg'),
(3, 'Combo lunch meal for 2 people’, 'Rice, kimchi, 3 foods, 2 drinks', 150, 'combo_lunch_meal_for_2.jpg'), (3, ‘Combo fast food’, ‘Spaghetti, pepsi, French fries', 100, ‘combo_fast_food.jpg'),
(3, ‘Combo kimbap korea’, 'Kimbap, onigiri, fruit', 200, 'combo_kimbap_korea.jpg'), (3, ‘Combo hot pot', 'Seafood hotpot, drinks', 200, 'combo_hot_pot.jpg'), (3, ‘Combo salad’, ‘Salad, fruit’, 100, 'combo_salad.jpg'),
(3, ‘Combo Korean mixed rice’, ‘Korean mixed rice, drinks', 150, ‘combo_korean_mixed_rice.jpg'), (3, ‘Combo Korean barbecue’, 'Korean barbecue, drinks’, 150, 'combo_korean_barbecue.jpg'), (3, ‘Combo kimbap for 1 person’, 'Kimbap and drink’, 80, 'combo_kimbap_for_1.jpg');
CREATE TABLE [dbo].[User] ( [ID] INT NOT NULL, [username] NVARCHAR (50) NULL, [firstName] NVARCHAR (50) NULL, [lastName] NVARCHAR (50) NULL, [role] VARCHAR (10) NULL, CONSTRAINT [PK_User] PRIMARY KEY CLUSTERED ([ID] ASC) );
INSERT INTO [dbo].[User] ([ID], [username], [firstName], [lastName], [role]) VALUES
(1, 'john_doe', 'John', 'Doe', 'admin'), (2, 'jane_smith', 'Jane', 'Smith', 'user'), (3, 'bob_jones', 'Bob', 'Jones', 'user');
bang OrderOrder CREATE TABLE [dbo].[Order] ( [id] INT IDENTITY (1, 1) NOT NULL, {userld] INT NULL,
[status] VARCHAR (50) NOT NULL, [total] DECIMAL (10, 2) NOT NULL, PRIMARY KEY CLUSTERED ([id] ASC), FOREIGN KEY ([userld]) REFERENCES [dbo].[User] ([ID]) );
INSERT INTO [dbo].[Order] ([userid], [status], [total]) VALUES
bang OrderDetail CREATE TABLE [dbo].[OrderDetail] ( [id] INT IDENTITY (1, 1) NOT NULL, [idorder] INT NULL,
{idproduct] INT NULL, [price] DECIMAL (10, 2) NOT NULL, [quantity] INT NOT NULL, PRIMARY KEY CLUSTERED ([id] ASC), FOREIGN KEY ([idorder]) REFERENCES [dbo].[Order] ([id]), FOREIGN KEY ([idproduct]) REFERENCES [dbo].[Product] ([id]) )
INSERT INTO [dbo].[OrderDetail] ([idorder], [idproduct], [price], [quantity ]) VALUES
~ Hiển thị dữ liệu từ bang Category SELECT * FROM [dbo].[Category];
Hién thi d& liéu tir bang User SELECT * FROM [dbo].[User];
Hién thi dé liéu tir bang Product SELECT * FROM [dbo].[Product];
Hién thị dữ liệu từ bảng Order SELECT * FROM [dbo].[Order];
Hiển thị dữ liệu từ bảng OrderDetail SELECT * FROM [dbo].[OrderDetail ];
Mô tả chức nang
Thêm, sửa, xóa category admin
Xem các product bao gém giá, hinh anh, mé ta
Thêm product vào giỏ hàng
Xem sản phẩm theo danh mục như{( Nước ăn, food)
Giao dién
Pork meatball bread Beef steak Beef soup Vegetable fried rice Hamburger beef steak —
Bread, pork meatball, salad tomato, Beef, lemon, salad pepper Beef, water, red pumpkin, cilantro Rice, egg, cucumber, pepper, Bread, beef, tomato, cheese cucumber cucumber Price: $30.0 cilantro Price: $30.0
Hinh 8 Trang Login
Product's Name Enter Ode 1D ID Category Name Price Image Action
Price 1 Mark Hamburger 105 fa oo
Chọn tệp | Chưa có tệp nào được chọn
L5 CC TU overview Userid Status
Status of Order erie ® Products Total
Hinh 10 Trang Order
Code
® orderManagement fe Web Pages fo META-INF fo WEB-INF [a images home.jsp loginadmin.jsp order.jsp product.jsp (@ Remote Files fa RESTful Web Services fe Source Packages
{ com.mycompany.ordermanagement EEl com.mycompany.ordermanagement.resources { controller
AdminController.java CategoryController.java HomeController.java LoginController.java OrderController.java { dbcontext
& model Category.java CategoryDAO java Order.java
1 Kết nối cơ sở dữ liệu package dbcontext;
* public interface Databaselnfor { public static String driverName = “com.microsoft.sqlserver.jdbc.SQLServerDriver"; public static String url = “jdbc:sqlserver://127.0.0.1:1433;databaseName=menu; "; public static String user = "sa"; public static String pass = "Chauyeuai22";
7 import java.sql Connection; import java.sql DriverManager;
+ public class ConnectDB implements DatabaselInfor { private static ConnectDB instance;
= public Connection openConnection() throws Exception { Class forName(classWame: driverName) ;
Connection con = DriverManager.getConnection(url, user, password:pass); return con;
/Get instance of dbms only one time
= if (instance = null) instance = new ConnectDB() ; } return instance;
=] import java.io IOException; import java.util.logging.Level; import java.util.logging.Logger; import javax.servlet.ServletException; import javax.servlet annotation.WepServlet; import javax.servlet http.KttpServlot; import javax.servlet http.HttpServletRequest ; import jévax.servlet http.HttpServletResponse; I import jévax.servlet http.HttpSession; import model.User; import model.UserDA0;
QWebServlet ["/Login") public class LoginController extends HttpServlet {
Private static final long serialVersionUID = 1L; protected void dePost(HttpServletRequest request, HttpServletResponse response)
{ String username = request getParameter( string: “username”
String password = request getParameter|string: "password");
User user = userDAO.getUserByUsername(usemame) ; if (user != null && user.getPassword() equals(sndsjcct:password)) { HttpSession session = request.getSession(); session.setAttribute(string: "user", o: user); response sendRediract (string: “order.jsp");
} else { request setAttribute(string: “errorMessage", o: "Invalid usermame ojr password."); request getRequestDispatcher(string: “Loginedmin.jsp").forward(sr: request, sri: response) ;
Logger getLogger (name: LoginController.class.getName()) Log(level: Level SEVERE, msg: NULL, thrown: eX);
O oO import import import import import import import import import model Order; model OrderDAO; java.io 10Exception; java.util.List; jJavax.servlet ServletException; j] avax.servLet annetatien WebSe rvLet ; javax.servLet http.HttpServLet ; ]avax se rv1 at hrtp HrtrpSe rưLetReqLiesr ; j avax.servLet http HttpSe rvLetResponse;
(@WebServLet (name = "OrderControlier", urlPatterns = {"/OrderController"}) public cless OrderController extends HttpServlet { private final OrderDAO orcerDAO = new 0rderDA0() ;
@0verride protected void doGet(HttpServletRequest request, HttpServletResponse respons
List prders = orcerDAO.getOrders() ; request setAttribute(string: "orders", o: orders); request getRequestDispetcher(string: “orcer.jsp").forward(sr: request, } catch (Exception ex) {
/⁄/ Xử Lý ngoại tệ ex QO: rasponse sendRedirect( request gotContextPath() + “/oerror.jsp");
@0verride protected void doPost(HttpServletRequest request, HttpServletResponse raspon throws ServLetException, I0Exception { try
String action = request getParamoter( string: “action"); if (action != null) { switch (action) { case “add": sdd0rde r [ request, response) ; break; case "update": updateOrder(request, response) ; break; case "delete": deleteOrder( request, response) ; break; default: break;
catch (Exception ex) {
Home Controller
package controller; import java.io.10Exception; import java.util.logging.Level; import java.util logging.Logger; import java.util.List; import javax.servlet ServletException; import javax.servlet.annotation.WebServlet ; import javax.servlet http.HttpServlet; import javax.servlet http.HttpServletRequest ; import javax.servlet http.HttpServletResponse; import model.Product;| I - import model.ProductDA0;
@WebServlet (name = “HomeController", urlPatterns = {"/HomeController"}) public class HomeController extends HttpServlet {
* Processes requests for both HITP GET and P0ST
* @throws ServLetException if a servlet-specific error occurs
* @throws i0Exception if an 1/0 error occurs
“/ protected void processRequest(HttpServletRequest request, HttpServletResponse response) throws ServletException, I0Exception { response.setContentType(string: “text/html ;charset=UTF-8"); try { // Assuming you have instantiatad your ProductDA0 ProductDAO productDAOQ = new ProductDAO() ;
// Retrieve the list of products from the database List productList = productDAO.getProducts() ;
// Set the productList as an attribute in the request request setAttribute(string: "productList", o: productList) ;
// Forward the request to the home.jsp file request getRequestDispatcher(string: “home.jsp") forward(sr: request, s } catch (Exception ex) {
Logger getLogger (name: HomeController.class.getName()).Log(level: Level
// Handle any exceptions response getWriter() println("An error occurred: + ex.getMessage())
// return categories; I } public Category getCategor yById(int id) throws Exception { Category category String sql = SELECT * FROM Category WHERE id=?"; try (Connection connection = ConnectDB.getInstance[) openConnection();
ProparedStatement statement = 7 commection prepareStatement(sql)) { statement setInt(parancterIndex: 1, 3 try (ResultSet resultSet = Statement cxecuteduery()) { if [resultSet.next()) { category = new Category(); category.setId(id: resultSet getInt(colunntabel: “id")); category setName(name: resultSet getString(colunntabel: “name")) >
} catch (SQLException ex) } Logger getLogger(nanc: CategoryDAQ.class.getName()) Log(tevel: Level SEVERE, nsg: null, thrown: ex);