Báo cáo đặt vé xe trực tuyến viết bẳng JSF

Web bán vé xe trực tuyến là website dành riêng cho lĩnh vực đặt vé trực tuyến. Phù hợp cho các đơn vị chủ quản có thể quản trị toàn bộ thông tin, quản lý toàn bộ tiến trình đặt tour, đặt xe, đặt vé trực tuyến, hỗ trợ mạnh khả năng khai thác và phát triển mạng lưới khách hàng trên internet.

Nong Lam University

Môn: Chuyên đề web

GVHD: ThS.Mai Anh Thơ

KS.Lê Nhật Tùng

Mục Lục

I FSF Framework 3

1.1 Khái niệm về JSF 3

1.2 Ưu điểm của JSF 3

1.3 Các thành phần của JSF 3

1.4 Mục tiêu của JSF 4

1.5 Các pha vòng đời của ứng dụng JSF 4

1.6 Các dịch vụ framework JSF 6

1.7 Các thành phần chính của JSF 7

1.8 Managed Beans 8

1.9 Cấu hình Beans 9

1.10 Beans Scopes 9

1.11 Tổng quan các thẻ JSF core 10

1.12 Tổng quan cá thẻ JSF HTML 11

II Web bán vé xe trực tuyến 13

2.1 Giới thiệu 13

2.2 Trang chủ 13

2.3 Các chức năng của Admin 13

2.3.1 Chức năng login vào hệ thống 14

2.3.2 Chức năng của admin 14

a Quản lý xe 14

b Quản lý đăt vé 15

c Quản lý tài khoản 16

d Quản lý thời gian 17

e Quản lý tuyến 18

2.4 Đặt vé 20 2.5 Bảng giá 23 2.6 Văn phòng đại diện 23

I JSF FRAMEWORK

Công nghệ Java Server Faces(JSF) cung cấp kiến thức về nền tảng của

JavaServerFaces, thường được gọi tắt là JSF, một đặc tả và cũng là một công nghệ then chốt của Sun Microsytems, cho phép lập trình viên xây dựng các ứng dụng web trên nền tảng Java một cách nhanh chóng và hiệu quả hơn Vì JSF không chỉ là một công nghệ mà còn là một đặc tả, cho phép các nhà phát triển khác nhau viết mã thực thi (implementation) cho đặc tả này, làm phong phú thêm trong việc lựa chọn JSF làm nền tảng xây dựng web với Java, như Apache MyFaces, ICEFaces, JBoss RichFaces

1.1 Khái niệm về JSF

- JSF (Java Server Faces) là một framework Java

- JSF là một framework phát triển các ứng dụng web viết bằng Java nhằm làm đơn

giản hóa quá trình phát triển giao diện người dùng cho các ứng dụng J2EE

- Là tập hợp các điều khiển giao diện trên nền web

- Là framework cung cấp điều khiển giao diện không phụ thuộc thiết bị

- JSF có thể sử dụng để tạo ra các giao diện ở các định dạng khác ngoài HTML và

sử dụng các protocol khác ngoài HTTP

- Là một framework ứng dụng web dựa trên mô hình MVC

1.2 Ưu điểm của JSF

- JSF là một kiến trúc mà các nhà phát triển dễ dàng sử dụng

- Giao diện người dùng có thể tạo ra một cách dễ dàng cùng với thư viện thành

phần giao diện người dùng của nó, xử lý hầu hết những phức tạp của quản lý giao diện người dùng

- Một trong những lợi điểm lớn nhất của công nghệ JSF là nó cho phép một sự

phân chia rạch ròi giữa behavior (cách xử lý) và presentation (cách trình bày)

- Công nghệ JSF cung cấp một kiến trúc dành cho việc quản lý trạng thái các thành

phần, xử lý dữ liệu thành phần, kiểm tra nhập liệu của người dùng và xử lý các sự kiện

- Cơ chế xử lý sự kiện mạnh mẽ

1.3 Các thành phần của JSF

Java Server Faces là một UI framework cho phép xây dựng các ứng dụng web chạy trên Java server và thay thế UI phía sau cho client Các thành phần chính của công nghệ JSF bao gồm:

- Một tập các hàm API để biểu diễn các thành phần UI (giao diện người dùng) và

quản lý trạng thái của chúng, xử lí các sự kiện và kiểm tra dữ liệu vào, qui định việc di chuyển trang, hỗ trợ tính đa ngôn ngữ và hỗ trợ cho người dùng

- Một số thành phần có sẵn

- Hai thư viện chứa các thẻ tùy biến JSP để có thể biểu diễn một JavaServer Faces

interface bên trong một trang JSP

- Mô hình sự kiện ở dưới máy chủ

- Khả năng quản lý trạng thái

- Managed Bean

1.4 Mục tiêu của JSF

- Tạo ra một bộ khung gồm các thành phần giao diện người dùng chuẩn (standard

GUI component framework) nhằm giúp cho các công cụ phát triển dễ dàng hơn

cho người dùng trong việc tạo GUI chất lượng cao đồng thời quản lí các kết quả của GUI với xử lí thực thi của chương trình

- Định ra một tập các lớp cơ sở của Java (lightweight Java base classes) biểu diễn

cho các thành phần UI, trạng thái mỗi thành phần, và các sự kiện đầu vào Những lớp này sẽ xử lí những vấn đề liên quan đến chu kì sống của GUI, đặc biệt là quản

lí trạng thái trong suốt chu trình sống của một trang của thành phần GUI đó

- Cung cấp một tập các thành phần GUI chung, bao gồm các thành phần HTML

form input Những thành phần này sẽ được dẫn xuất từ tập đơn giản các lớp cơ sở

để từ đó có thể định ra các thành phần mới

- Cung cấp một mô hình JavaBeans để có thể truyền đi (dispatch) các sự kiện từ

các GUI controls phía máy khách đến các xử lí hiện thực cụ thể từ phía ứng dụng máy chủ

- Chỉ định một mô hình để có thể đa ngôn ngữ hóa hay địa phương hóa các GUI

- Khởi tạo tự động dữ liệu ra phù hợp cho máy khách đích, dựa vào mọi dữ liệu cấu

hình ở máy khách đó, bao gồm cả dựa vào phiên bản trình duyệt

1.5 Các pha vòng đời của ứng dụng JSF

Sáu pha xuất hiện theo trình tự mà JSF xử lý tiêu biểu một biểu mẫu (form) GUI Danh sách hiển thị các pha theo thứ tự thực hiện của chúng với việc xử lý sự kiện

ở mỗi pha, nhưng vòng đời JSF hầu như không được thiết lập cứng nhắc như vậy Chúng ta có thể thay đổi thứ tự thực hiện bằng cách bỏ qua các pha Ví dụ, nếu một giá trị yêu cầu không hợp lệ được sao chép vào một thành phần, khung nhìn hiện tại sẽ được hiển thị lại, và một số pha có thể không thực hiện được

Hình 4.5: Vòng đời của ứng dụng JSF

1.5.1 Pha 1 – Restore view (Khôi phục khung nhìn)

- Thực hiện xây dựng các thành phần giao diện từ form yêu cầu của người dùng

- Các UI Component được tổ chức theo dạng hình cây và trạng thái của các control

hay nói cách khác là giá trị nhập liệu của người dùng (State), trạng thái kích hoạt biến cố mà người dùng chọn lựa kích hoạt được thu thập, tổng hợp và đưa vào Faces Servlet

1.5.2 Pha 2 – Apply request values; process events (Áp dụng các giá trị yêu cầu;

xử lý sự kiện)

- Từ thông tin thu thập được, JSF chuyển qua ép kiểu tương ứng thành kiểu dữ liệu

khai báo từ trong managed bean hay tương ứng với loại control của form nhập liệu

- Nếu dữ liệu không thể ép kiểu thì tức thời JSF thông báo lỗi và response cho

Faces Context hay Faces Servlet để Faces Servlet thông báo cho người dùng

- Nếu việc ép kiểu – chuyển kiểu diễn ra thông thường, JSF chuyển dữ liệu sang

giai đoạn tiếp theo

1.5.3 Pha 3 – Process validations; process events (Xử lý duyệt tính hợp lệ dữ liệu)

- Dữ liệu tiếp tục được kiểm tra ràng buộc tương ứng với yêu cầu xây dựng ứng

dụng và cấu hình trong thành phần validators, trong bean

- Nếu dữ liệu validators bị sai thì tức thời JSF thông báo lỗi và response cho Faces

Context hay Faces Servlet để Faces Servlet thông báo cho người dùng

- Nếu đúng thì chuyển dữ liệu cập nhật vào trong managed beans

1.5.4 Pha 4 – Update model values; process events (Cập nhập các giá trị của

model)

- Cập nhật giá trị tương ứng vào các thuộc tính trong backing beans – managed

beans

1.5.5 Pha 5 – Invoke application; process events (Gọi ứng dụng)

- Khi cập nhật thành công, Faces Servlet hay Faces Context dựa trên biến cố kích

hoạt, thực hiện gọi (invoke) phương thức xử lý tương ứng, xác định trang jsf kết xuất

- Đón nhận kết quả xử lý

1.5.6 Pha 6 – Render response (Hoàn trả đáp ứng)

- Dữ liệu kết xuất khi xử lý xong sẽ được chuyển đổi tương ứng nạp vào form, cập

Data Conversion: JSF hỗ trợ chuyển đổi bằng thẻ (<f:converter>), khi dữ liệu

người dùng nhập vào qua giao diện dữ liệu ở dạng String các đối tượng chúng ta khai báo có thể ở dạng dữ liệu khác, bởi thế JSF hỗ trợ quá trình conversion dữ liệu sang dạng khác khi dữ liệu xử lý ở tầng nghiệp vụ

Validation: JSF hỗ trợ chuyển đổi bằng thẻ (<f:validator>) và có thể validation

tùy chỉnh(bằng cách thực thi các interface validation) trong ứng dụng web

Error Handling: JSF hỗ trợ bạn kiểm soát dữ liệu ngay khi nhập vào từ giao diện

như ‘giá trị nhập vào phải là 1 số’ hoặc ‘nhập sai định dạng dữ liệu’ Thông báo lỗi

sẽ được hiển thị ngay khi người dùng submit dữ liệu

Hình 1.1: Mô hình MVC trong JSF Framework 1.7 Các thành phần chính của JSF

JSF có những quy định của nó nhằm đưa ra các khái niệm cơ bản cho những element mà nó cung cấp Để sử dụng được các element của JSF bạn phải hiểu được những khái niệm và những quy đinh trong JSF

UI Component (còn gọi là một control hay đơn giản là component)

- Hỗ trợ trình bày giao diện để người dùng tương tác trực tiếp và trình bày kết quả

vào giá trị của component

- Renderer có thể được thiết kế để làm việc với một hoặc nhiều UI component, và một UI component có thể tập hợp với nhiều renderer khác nhau

Validator

- Hỗ trợ cơ chế kiểm tra dữ liệu trên các thành phần UI để đảm bảo dữ liệu được

nhập đúng và có ràng buộc theo đúng yêu cầu của ứng dụng

Backing beans (hay còn gọi là Managed Bean)

- Backing beans phải được đăng ký với tập tin cấu hình (faces-config.xml) của ứng

dụng để ứng dụng có thể cơ chế để lưu trữ và tương tác với bean

- Tương tác giữa form, UI component với Backing Beans sử dụng EL language với

syntax #{EL expression} (dùng dấu # thay cho dấu $)

- Beans có khả năng hỗ trợ Biến cố - Event Handling, hỗ trợ chuyển trang

Navigation, thực hiện Validation

Converter

- Hỗ trợ cơ chế ép kiểu dữ liệu trong quá trình xử lý

Event/listener

- Hỗ trợ cơ chế đón nhận biến cố và xử lý biến cố (Event Handling) trên khái niệm

của M (Model) trong MVC kết hợp với Managed Bean

Messages

- Hỗ trợ trình bày các thông tin – message về phía người dùng, thông báo lỗi hay

hỗ trợ cơ chế I18N – hỗ trợ ứng dụng đa ngôn ngữ

Navigation

- Cung cấp cơ chế chuyển trang, chuyển xử lý trong quá trình ứng dụng thực hiện,

tượng tự khái niệm C (Controller) trong mô hình MVC

- Có 02 loại mô hình Static và Dynamic Model:

 Static Model: di chuyển đến duy nhất một trang cụ thể và không thay đổi hay không thể thay đổi từ lúc lập trình hay trong quá trình trang thực thi

(trang chuyển đến đã được xác định chính xác)

 Dynamic Model: cấu hình để chuyển đến trang tương ứng tùy theo kết quả

ManagedBean: đăng ký java class là managed bean, với thuộc tính name, nếu

không chỉ rõ thuộc tính name thì managed bean sẽ mặc định lấy tên class với chữ cái đầu tiên viết thường là tên managed bean Trong trường hợp trên, tên của managed bean là userBean Mỗi khi bean được định nghĩa, nó có thể được truy cập bởi các UI components của JSF (khi JSF render một page, nó sẽ gọi phương thức getName, khi user submit page, nó sẽ gọi phương thức setName để thiết lập lại giá trị của managed bean)

.

</web-app>

- Danh sách các file trong tham số javax.faces.CONFIG_FILES bên trong WEB

INF/web.xml

- Một bean được định nghĩa bằng element managed-bean bên trong element faces

config Bạn có thể xác định tên, lớp và scope của bean

- Scope có thể là request, session, application hoặc none Scope none có nghĩa là

đối tượng không được giữ ở 1 trong 3 scope

1.10 Beans Scopes

1.10.1 Request

Phạm vi của request tồn tại ngắn, nó bắt đầu khi một HTTP request được submit

và kết thúc khi response được gửi trở lại cho client

Ghi chú: Nếu một request là forward đến một request khác, tất cả các cặp

name/value lưu trong request scope được mang đến request mới Trái lại, nếu một request được redirect, dữ liệu của request sẽ bị mất

1.10.2 Session scope

Session Scope beans được tạo ra và được lưu trữ thành các đối tượng trong session Session sẽ tắt nếu ứng dụng web gọi phương thức invalidate trên đối tượng HttpSession hoặc nếu nó time out

1.10.3 Application Scope

Application scope giống như một session nhưng được tồn tại trong suốt khoảng thời gian của ứng dụng web (giống như một biến toàn cục), nó chỉ mất khi ứng dụng web đóng

1.1.1 Tổng quan các thẻ JSF Core

Thẻ Mô tả

f:attribute Thiết lập một thuộc tính (khóa/giá trị)

f:actionListener Thêm một action listener

f:setPropertyActionListener Thêm một action listener thiết lập một property

f:valueChangeListener Thêm một value change listener

f:phaseListener Thêm một phase listener

f:event Thêm một thành phần hệ thống event listener

f:convertDateTime Thêm một datetime converter

f:convertNumber Thêm một number converter

f:validateDoubleRange Kiểm tra giá trị nằm trong khoảng kiểu Double

f:validateLength Kiểm tra độ dài của giá trị

f:validateLongRange Kiểm tra giá trị nằm trong khoảng kiểu Long

f:validateRequired Kiểm tra giá trị có được nhập vào hay không

f:validateRegex Kiểm tra giá trị có thích hợp điều kiện hay không f:validateBean Sử dụng Bean Validation API để kiểm tra

f:loadBundle Tải một gói tài nguyên, các gói thuộc tính như

Map f:selectitems Chỉ định chọn nhiều item

f:selectitem Chỉ định chọn một item

f:verbatim Điều chỉnh nội dung, văn bản

f:viewParam Xác định một view parameter khởi tạo bởi một

request parameter

Bảng 1.1: Bảng các thẻ JSF core Attribute, Parameter và Facet

- Các thẻ f:attribute, f:param và f:facet là những thẻ thường dùng để thêm thông tin

vào một thành phần Có thể thiết lập một thuộc tính trong một trang và lập trình truy xuất nó

- Thẻ f:param cũng cho phép xác định một cặp tên/giá trị, nhưng giá trị được đặt

trong một thành phần con khác Có thể sử dụng f:param nếu cần thêm vào các giá trị cùng tên

- Thẻ f:facet thêm một thành phần vào facet map Một trang Facets gốc có hai facet

là “head” và “body”

Thuộc tính Mô tả

name Tên của thuộc tính, tham số hoặc facet

value Giá trị của thuộc tính hoặc tham số (không áp dụng cho

facet) binding Kết nối với đối tượng dữ liệu (chỉ dùng cho f:param)

id Id của thẻ (chỉ dùng cho f:param)

Bảng 1.2: Bảng các thuộc tính của Attribute, Parameter và Facet

h:inputText Điều khiển nhập dạng single-line

h:inputTextarea Điều khiển nhập dạng multiline

h:inputSecret Điều khiển nhập dạng password

h:inputHidden Hidden field

Bảng 1.3: Bảng các thẻ Input trong JSF HTML

Output

h:outputLabel Text dạng label

h:outputLink Link liên kết

h:outputFormat Text dạng single-line nhưng định dạng thông điệp phức

tạp h:outputText Text dạng single-line

h:outputStylesheet Thêm một stylesheet vào trang

h:outputScript Thêm một script vào trang

h:graphicImage Hiển thị một image

Bảng 1.4: Bảng các thẻ Output trong JSF HTML

Command

h:commandButton Button: submit, reset hoặc pushbutton

h:commandLink Link dạng button

Bảng 1.5: Bảng các thẻ Command trong JSF HTML

Selection

h:selectOneListbox Danh sách chỉ được chọn 1 item

h:selectOneMenu Danh mục chỉ được chọn 1 item

h:selectOneRadio Radio button chỉ được chọn 1 item

h:selectBooleanCheckbox Checkbox

h:selectManyCheckbox Danh sách các checkbox

h:selectManyListbox Danh sách được chọn nhiều listbox

h:selectManyMenu Danh mục được chọn nhiều item

Bảng 1.6: Bảng các thẻ Selection trong JSF HTML

h:message Hiển thị thông điệp gần đây

h:messages Hiển thị tất cả các thông điệp

Bảng 1.9: Bảng các thẻ Message trong JSF HTML

II Web bán vé xe trực tuyến

2.1 Giới thiệu

Web bán vé xe trực tuyến là website dành riêng cho lĩnh vực đặt vé trực tuyến Phù hợp cho các đơn vị chủ quản có thể quản trị toàn bộ thông tin, quản lý toàn bộ tiến trình đặt tour, đặt xe, đặt vé trực tuyến, hỗ trợ mạnh khả năng khai thác và phát triển mạng lưới khách hàng trên internet

2.2 Trang chủ

Hình 2.1 Trang chủ