1. Trang chủ
  2. » Luận Văn - Báo Cáo

Xây dựng hệ thống thông tin hỗ trợ tuyển sinh đại học 2015 của trường đại học nha trang

104 400 0
Tài liệu đã được kiểm tra trùng lặp

Đang tải... (xem toàn văn)

Tài liệu hạn chế xem trước, để xem đầy đủ mời bạn chọn Tải xuống

THÔNG TIN TÀI LIỆU

Thông tin cơ bản

Định dạng
Số trang 104
Dung lượng 3,21 MB

Các công cụ chuyển đổi và chỉnh sửa cho tài liệu này

Nội dung

Trong phạm vi của bài báo cáo này sẽ trình bày các kỹ thuật được sử dụng để xây dựng hệ thống thông tin hỗ trợ tuyển sinh đại học 2015 trong môi trường cài đặt là ASP.NET MVC4 và trả lời

Trang 1

TRƯỜNG ĐẠI HỌC NHA TRANG

KHOA CÔNG NGHỆ THÔNG TIN

BÁO CÁO ĐỒ ÁN TỐT NGHIỆP

XÂY DỰNG HỆ THỐNG THÔNG TIN

HỖ TRỢ TUYỂN SINH ĐẠI HỌC 2015 CỦA TRƯỜNG ĐẠI HỌC NHA TRANG

Giáo viên hướng dẫn: ThS Nguyễn Đình Hưng Sinh viên thực hiện: Bùi Thị Thu Trang Lớp: 53 CNTT

MSSV: 53131806

Tháng 6 2015

Trang 2

TRƯỜNG ĐẠI HỌC NHA TRANG

KHOA CÔNG NGHỆ THÔNG TIN

BÁO CÁO ĐỒ ÁN TỐT NGHIỆP

XÂY DỰNG HỆ THỐNG THÔNG TIN

HỖ TRỢ TUYỂN SINH ĐẠI HỌC 2015 CỦA TRƯỜNG ĐẠI HỌC NHA TRANG

Giáo viên hướng dẫn: ThS Nguyễn Đình Hưng Sinh viên thực hiện: Bùi Thị Thu Trang

Lớp: 53 CNTT MSSV: 53131806

Trang 3

NHẬN XÉT KẾT QUẢ THỰC TẬP

Họ và tên sinh viên:

Mã số sinh viên: ……… Lớp ……… Hệ:

Khoa Công nghệ Thông tin, Trường Đại học Nha Trang Nội dung thực tập:

Đánh giá kết quả thực tập:

……… ngày … tháng … năm ……

Giáo viên hướng dẫn

Trang 4

Ngày nay, cùng với sự phát triển nhanh chóng của mạng Internet, mọi lĩnh vực trong xã hội đều có thể tìm thấy khi vào google.com Sau khi bạn gõ các từ khóa tìm kiếm và enter, Google sẽ trả về cho bạn danh sách kết quả tìm kiếm (nếu có) dưới dạng các website Bấm vào các website đó bạn có thể sẽ tìm được thông tin mà mình muốn Để tạo nên những trang web cung cấp thông tin cho người dùng với giao diện trực quan, thân thiện, tốc độ xử lý nhanh chóng…các nhà phát triển web hay người lập trình viên phải sử dụng các công nghệ viết web chuyên nghiệp Một trong số những công nghệ web mạnh mẽ nhất hiện nay là ASP.NET MVC của Microsoft

Cũng như các lĩnh vực khác, các cổng thông tin điện tử trong lĩnh vực giáo dục

và đào tạo cũng được phát triển nhanh chóng cả về số lượng và chất lượng Từ các trường trung học phổ thông, các trung tâm đào tạo nghề, các trường cao đẳng, đại học cho đến các sở, các ban ngành… đều có website riêng của mình

Nhằm phục vụ cho các công tác quản lý của nhà trường cũng như giúp sinh viên thuận tiện hơn quá trình theo học tại trường, trường Đại học Nha Trang đã có hệ thống website với đầy đủ các chức năng cho các phòng, các khoa giúp đơn giản hóa các công việc của đội ngũ công nhân viên, giảng viên của nhà trường Bên cạnh đó sinh viên cũng chủ động hơn trong việc đăng ký/hủy môn học, theo dõi lịch học, lịch thi, xem điểm…và cập nhật thông tin mới một cách nhanh chóng qua các thông báo trên trang web của khoa, của trường

Năm 2015 với sự thay đổi trong phương thức thi tuyển sinh đại học và thi tốt nghiệp trung học phổ thông (THPT) của Bộ Giáo Dục và Đào Tạo, trường Đại học Nha Trang xét tuyển hồ sơ thí sinh vào học tại trường dựa trên kết quả kỳ thi THPT quốc gia Để tạo điều kiện thuận tiện nhất cho thí sinh, một hệ thống thông tin hỗ trợ tuyển sinh đại học 2015 là cần thiết giúp thí sinh dễ dàng tiếp cận với những thông tin tuyển sinh mới nhất của nhà trường, chủ động hơn trong việc đăng ký xét tuyển cũng như theo dõi kết quả xét tuyển

- Hệ thống thông tin hỗ trợ tuyển sinh có những chức năng nào?

- Hệ thống cho phép thí sinh được làm gì?

- Thí sinh có lợi ích gì khi sử dụng hệ thống này?

- Hệ thống có giúp giảm bớt các công việc Ban Tuyển Sinh phải làm hay không?

- Giao diện có trực quan, rõ ràng, dễ dùng hay rối rắm, phức tạp?

Trong phạm vi của bài báo cáo này sẽ trình bày các kỹ thuật được sử dụng để xây dựng hệ thống thông tin hỗ trợ tuyển sinh đại học 2015 trong môi trường cài đặt là ASP.NET MVC4 và trả lời cho những câu hỏi phía trên về chức năng của hệ thống

Trang 5

Chương 1: Tổng quan cơ sở lý thuyết

Chương 2: Phân tích thiết kế và cài đặt hệ thống thông tin hỗ trợ tuyển sinh đại học 2015 của trường Đại học Nha Trang

Chương 3: Giao diện của hệ thống thông tin hỗ trợ tuyển sinh đại học 2015 của trường Đại học Nha Trang

Chương 4: Kết luận và hướng phát triển

Cuối cùng, để có thể hoàn thành báo cáo đồ án đúng thời hạn và xây dựng được chương trình ứng dụng là hệ thống thông tin hỗ trợ tuyển sinh đại học 2015 của trường Đại học Nha Trang em xin chân thành cảm ơn thầy Nguyễn Đình Hưng đã tận tình giúp đỡ, hướng dẫn chi tiết, động viên em Đồng thời em xin cảm ơn các thầy cô trong khoa công nghệ thông tin Đại Học Nha Trang đã giảng dạy, giúp đỡ em trong suốt khoảng thời gian theo học tại trường, cảm ơn sự giúp đỡ nhiệt tình của các bạn học

Nha Trang, ngày 20 tháng 6 năm 2015

Sinh viên thực hiện Bùi Thị Thu Trang

Trang 6

Lời nói đầu

CHƯƠNG 1: TỔNG QUAN CƠ SƠ LÝ THUYẾT 1

1.1 Giới thiệu ASP.NET MVC 1

1.1.1 Nguồn gốc ASP.NET MVC 1

1.1.2 Mô hình MVC 2

1.1.3 Cấu trúc thư mục mặc định của 1 project ASP.NET MVC 4

1.2 ASP.NET MVC4 5

1.2.1 ASP.NET MVC4 là gì? 5

1.2.2 Tại sao nên lựa chon ASP.NET MVC4 là môi trường cài đặt ứng dụng? 5

1.2.3 Models trong ASP.NET MVC4 7

1.2.4 Controllers và Action 10

1.2.5 Views 14

1.2.6 Sử dụng Ajax trong ASP.NET MVC4 18

1.2.7 Jquery và Boostrap hỗ trợ tạo giao diện ứng dụng ASP.NET MVC4 20

1.3 Hệ quản trị cơ sở dữ liệu SQL Server 2008 22

1.3.1 Giới thiệu ngôn ngữ cơ sở dữ liệu quan hệ SQL 22

1.3.2 Các câu lệnh thường sử dụng trong SQL 25

CHƯƠNG 2: PHÂN TÍCH THIẾT KẾ 27

VÀ CÀI ĐẶT HỆ THỐNG THÔNG TIN HỖ TRỢ 27

TUYỂN SINH ĐẠI HỌC 2015 CỦA TRƯỜNG ĐẠI HỌC NHA TRANG 27

2.1 Quy trình nghiệp vụ và yêu cầu hệ thống của hệ thống thông tin hỗ trợ tuyển sinh đại học 2015 của trường Đại học Nha Trang 27

2.1.1 Quy trình nghiệp vụ 27

2.1.2 Yêu cầu hệ thống 31

2.2 Biểu đồ Use Case 32

2.2.1 Biểu đồ use case tổng quát 32

2.2.2 Phân rã biểu đồ use case Đăng ký xét tuyển 32

2.2.3 Phân rã biểu đồ use case quản lý hồ sơ thí sinh 33

2.2.4 Phân rã biểu đồ use case quản lý tài khoản 33

Trang 7

2.3.1 Kịch bản use case Đăng nhập 34

2.3.2 Kịch bản use case Đăng ký xét tuyển 35

2.3.3 Kịch bản use case In phiếu đăng ký xét tuyển 36

2.3.4 Kịch bản use case Xác nhận đăng ký xét tuyển 36

2.3.5 Kịch bản use case Chỉnh sửa thông tin đăng ký xét tuyển 37

2.3.6 Kịch bản use case Hủy đăng ký xét tuyển 38

2.3.7 Kịch bản use case Xem kết quả xét tuyển tạm thời 39

2.3.8 Kịch bản use case Xem kết quả xét tuyển chính thức 40

2.3.9 Kịch bản use case Đăng nhập vào hệ thống 40

2.3.10 Kịch bản use case Thêm tài khoản 41

2.3.11 Kịch bản use case Đặt lại mật khẩu 41

2.3.12 Kịch bản use case Xóa tài khoản 42

2.3.13 Kịch bản use case Xem danh sách thí sinh đăng ký xét tuyển 43

2.3.14 Kịch bản use case Tìm kiếm thí sinh theo số báo danh 44

2.3.15 Kịch bản use case Thêm hồ sơ thí sinh 44

2.3.16 Kịch bản use case Duyệt hồ sơ thí sinh 46

2.3.17 Kịch bản use case Sửa hồ sơ thí sinh 47

2.3.18 Kịch bản use case Xóa hồ sơ thí sinh 48

2.3.19 Kịch bản use case Lập bảng thống kê bậc thang 49

2.3.20 Kịch bản use case In bảng thống kê bậc thang 49

2.3.21 Kịch bản use case Lập điểm chuẩn 50

2.3.22 Kịch bản use case Lập danh sách thí sinh trúng tuyển 51

2.3.23 Kịch bản use case In danh sách thí sinh trúng tuyển 51

2.3.24 Kịch bản use case In giấy báo trúng tuyển 52

2.4 Biểu đồ lớp phân tích 53

2.5 Các biểu đồ trình tự 54

2.5.1 Biểu đồ trình tự của chức năng Đăng nhập 54

2.5.2 Biểu đồ trình tự của chức năng Đăng ký xét tuyển 55

2.5.3 Biểu đồ trình tự của chức năng In phiếu đăng ký xét tuyển 56

2.5.4 Biểu đồ trình tự của chức năng Hủy đăng ký xét tuyển 56

Trang 8

2.5.6 Biểu đồ trình tự của chức năng Xem kết quả xét tuyển tạm thời 58

2.5.7 Biểu đồ trình tự của chức năng Đăng nhập vào hệ thống 59

2.5.8 Biểu đồ trình tự của chức năng Thêm tài khoản 60

2.5.9 Biểu đồ trình tự của chức năng Đặt lại mật khẩu 61

2.5.10 Biểu đồ trình tự của chức năng Xóa tài khoản 62

2.5.11 Biểu đồ trình tự của chức năng Xem danh sách thí sinh đăng ký xét tuyển 63 2.5.12 Biểu đồ trình tự của chức năng Duyệt hồ sơ thí sinh 64

2.5.13 Biểu đồ trình tự của chức năng Xóa hồ sơ thí sinh 65

2.5.14 Biểu đồ trình tự của chức năng In bảng thống kê bậc thang 66

2.5.15 Biểu đồ trình tự của chức năng Lập điểm chuẩn 67

2.5.16 Biểu đồ trình tự của chức năng In danh sách thí sinh trúng tuyển 68

2.5.17 Biểu đồ trình tự của chức năng In giấy báo trúng tuyển 69

2.6 Biểu đồ trạng thái 70

2.6.1 Biểu đồ trạng thái của đối tượng Thí sinh 70

2.6.2 Biểu đồ trạng thái của đối tượng Ban tuyển sinh 71

2.6.3 Biểu đồ trạng thái của đối tượng Người quản trị 72

2.6.4 Biểu đồ trạng thái của đối tượng Hồ sơ đăng ký xét tuyển 73

2.6.5 Biểu đồ trạng thái của đối tượng Danh sách xét tuyển 73

CHƯƠNG 3: GIAO DIỆN CỦA HỆ THỐNG THÔNG TIN HỖ TRỢ TUYỂN SINH ĐẠI HỌC 2015 CỦA TRƯỜNG ĐẠI HỌC NHA TRANG 74

3.1 Giao diện người dùng 74

3.1.1 Giao diện đăng nhập 74

3.1.2 Giao diện đăng ký xét tuyển trực tuyến 75

3.1.3 Giao diện xác nhận đăng ký xét tuyển trực tuyến 76

3.1.4 Giao diện chỉnh sửa hồ sơ xét tuyển 78

3.1.5 Giao diện kết quả xét tuyển tạm thời 79

3.1.6 Giao diện danh sách trúng tuyển 80

3.2 Giao diện quản trị 81

3.2.1 Màn hình quản trị chính 81

Trang 9

3.2.3 Giao diện quản lý hồ sơ thí sinh đăng ký xét tuyển 82

3.2.4 Giao diện quản lý tài khoản của người quản trị 83

3.2.5 Giao diện thiết lập điểm chuẩn 84

3.2.6 Giao diện thống kê bậc thang 85

3.2.7 Giao diện In giấy báo trúng tuyển 86

CHƯƠNG 4: KẾT LUẬN VÀ HƯỚNG PHÁT TRIỂN 88

DANH MỤC TÀI LIỆU THAM KHẢO 90

Trang 10

DANH MỤC CÁC BẢNG

Bảng 1-2 Bảng liệt kê các kiểu dữ liệu thường dùng trong SQL Server 2008 24

Bảng 1-3 Bảng liệt kê các câu lệnh thường dùng trong SQL Server 2008 25

Bảng 2-1 Bảng kịch bản use case đăng nhập 34

Bảng 2-2 Bảng kịch bản use case đăng ký xét tuyển 35

Bảng 2-3 Bảng kịch bản use case in phiếu đăng ký xét tuyển 36

Bảng 2-4 Bảng kịch bản use case xác nhận in phiếu đăng ký xét tuyển 37

Bảng 2-5 Bảng kịch bản use case chỉnh sửa thông tin đăng ký xét tuyển 37

Bảng 2-6 Bảng kịch bản use case hủy đăng ký xét tuyển 38

Bảng 2-7 Bảng kịch bản use case xem kết quả xét tuyển tạm thời 39

Bảng 2-8 Bảng kịch bản use case xem kết quả xét tuyển chính thức 40

Bảng 2-9 Bảng kịch bản use case xem đăng nhập vào hệ thống 41

Bảng 2-10 Bảng kịch bản use case Thêm tài khoản 41

Bảng 2-11 Bảng kịch bản use case đặt lại mật khẩu 42

Bảng 2-12 Bảng kịch bản use case xóa tài khoản 43

Bảng 2-13 Bảng kịch bản use case xem danh sách thí sinh dăng ký xét tuyển 43

Bảng 2-14 Bảng kịch bản của use case tìm kiếm thí sinh theo số báo danh 44

Bảng 2-15 Bảng kịch bản của use case thêm hồ sơ thí sinh 45

Bảng 2-16 Bảng kịch bản của use case duyệt hồ sơ thí sinh 46

Bảng 2-17 Bảng kịch bản của use case sửa hồ sơ thí sinh 47

Bảng 2-18 Bảng kịch bản của use case xóa hồ sơ thí sinh 48

Bảng 2-19 Bảng kịch bản của use case lập bảng thống kê bậc thang 49

Bảng 2-20 Bảng kịch bản của use case in bảng thống kê bậc thang 50

Bảng 2-21 Bảng kịch bản của use case lập điểm chuẩn 50

Bảng 2-22 Bảng kịch bản của use case lập danh sách thí sinh trúng tuyển 51

Bảng 2-23 Bảng kịch bản của use case in danh sách thí sinh trúng tuyển 52

Bảng 2-24 Bảng kịch bản của use case in giấy báo trúng tuyển 52

Trang 11

Hình 1-1 Hình minh họa mô hình MVC 4

Hình 1-2 Hình minh họa cây thư mục mặc định trong ASP.NET MVC4 4

Hình 1-3 Hình minh họa _layout mặc định trong ASP.NET MVC4 6

Hình 1- 4 Hình minh họa Entity Framework ánh xạ các bảng trong cơ sở dữ liệu 7

Hình 1-5 Hình minh họa mã lệnh thêm1 tài khoản quản trị 8

Hình 1-6 Hình minh họa phương thức sửa mật khẩu của 1 tài khoản quản trị sử dụng EF 9

Hình 1-7 Hình minh họa xóa 1 tài khoản quản trị 9

Hình 1-8 Hình minh họa cách tạo view tại controller 15

Hình 1-9 Hình minh họa tạo view tại thư mục Views 15

Hình 1-10 Hình minh họa tạo view ở thư mục Views (tiếp theo) 16

Hình 1-11 Hình minh họa câu lệnh Select trong SQL Server 2008 26

Hình 2-1 Hình minh họa sơ đồ use case tổng quát 32

Hình 2-2 Hình minh họa phân rã biểu đồ use case đăng ký xét tuyển 32

Hình 2-3 Hình minh họa phân rã biểu đồ use case quản lý hồ sơ thí sinh 33

Hình 2-4 Hình minh họa phân rã biểu đồ use case quản lý tài khoản 33

Hình 2-5 Hình minh họa biểu đồ lớp phân tích của hệ thống thông tin hỗ trợ tuyển sinh đại học 2015 của trường Đại học Nha Trang 53

Hình 2-6 Hình minh họa biểu đồ trình tự của chức năng đăng nhập 54

Hình 2-7 Hình minh họa biểu đồ trình tự của chức năng đăng ký xét tuyển 55

Hình 2-8 Hình minh họa chức năng in phiếu đăng ký xét tuyển 56

Hình 2-9 Hình minh họa biểu đồ trình tự của chức năng hủy đăng ký xét tuyển 56

Hình 2-10 Hình minh họa biểu đồ trình tự của chức năng chỉnh sửa thông tin đăng ký xét tuyển 57

Hình 2-11 Hình minh họa biểu đò trình tự của chức năng xem kết quả xét tuyển tạm thời 58

Hình 2-12 Hình minh họa biểu đồ trình tự của chức năng đăng nhập vào hệ thống 59

Hình 2-13 Hình minh họa biểu đồ trình tự của chức năng thêm tài khoản 60

Hình 2-14 Hình minh họa biểu đồ trình tự của chức năng đặt lại mật khẩu 61

Hình 2-15 Hình minh họa biểu đò trình tự của chức năng xóa tài khoản 62

Trang 12

Hình 2-17 Hình minh họa biểu đồ trình tự của chức năng duyệt hồ sơ thí sinh 64

Hình 2-18 Hình minh họa biểu đồ trình tự của chức năng xóa hồ sơ thí sinh 65

Hình 2-19 Hình minh họa biểu đồ trình tự của chức năng in bảng thống kê bậc thang 66 Hình 2-20 Hình minh họa biểu đồ trình tự của chức năng lập điểm chuẩn 67

Hình 2-21 Hình minh họa biểu đồ trình tự của chức năng in danh sách thí sinh trúng tuyển 68

Hình 2-22 Hình minh họa biểu đồ trình tự của chức năng in giấy báo trúng tuyển 69

Hình 2-23 Hình minh họa biểu đò trạng thái của đối tượng thí sinh 70

Hình 2-24 Hình minh họa biểu đồ trạng thái của đối tượng ban tuyển sinh 71

Hình 2-25 Hình minh họa biểu đồ trạng thái của đối tượng ngườiq uản trị 72

Hình 2-26 Hình minh họa biểu đò trạng thái của đối tượng hồ sơ đăng ký xét tuyển 73

Hình 2-27 Hình minh họa biểu đồ trạng thái của đối tượng danh sách xét tuyển 73

Hình 3-1 Hình minh họa giao diện đăng nhập của người dùng 74

Hình 3-2 Hình minh họa giao diện đăng nhập của ngườiduùng (tiếp theo) 74

Hình 3-3 Hình minh họa giao diện đăng ký xét tuyển 75

Hình 3-4 Hình minh họa giao diện xác nhận đăng ký xét tuyển 76

Hình 3-5 Hình minh họa giấy đăng ký xét tuyển của thí sinh khi in 77

Hình 3-6 Hình minh họa giao diện đăng ký xét tuyển thành công của thí sinh 77

Hình 3-7 Hình minh họa giao diện chỉnh sửa hồ sơ đăng ký xét tuyển của thí sinh 78

Hình 3-8 Hình minh họa giao diện chỉnh sửa hồ sơ đăng ký xét tuyển của thí sinh (tiếp theo) 79

Hình 3-9 Hình minh họa giao diện kết quả xét tuyển tạm thời 79

Hình 3-10 Hình minh họa giao diện kết quả trúng tuyển 80

Hình 3-11 Hình minh họa trang quản trị chính 81

Hình 3-12 Hình minh họa giao diện xem danh sách thí sinh đăng ký xét tuyển 81

Hình 3-13 Hình minh họa giao diện quản lý hồ sơ thí sinh 82

Hình 3-14 Hình minh họa giao diện quản lý hồ sơ thí sinh (tiếp theo) 83

Hình 3-15 Hình minh họa giao diện quản lý tài khoản quản trị 83

Hình 3-16 Hình minh họa giao diện thêm tài khoản quản trị 84

Trang 13

Hình 3-18 Hình minh họa giao diện cho phép hiển thị danh sách trúng tuyển 85Hình 3-19 Hình minh họa giao diện thống kê bậc thang 85Hình 3-20 Hình minh họa giao diện in giấy báo trúng tuyển của từng sinh viên 86

Trang 14

KÍ HIỆU CÁC CỤM TỪ VIẾT TẮT

Từ vi t tắt Giải th ch

Trang 15

CHƯƠNG 1: TỔNG QUAN CƠ SƠ LÝ THUYẾT 1.1 Giới thiệu ASP.NET MVC

Hiện nay ASP.NET MVC được biết đến là framework mới nhất của Microsoft, nó được thiết kế giúp lập trình viên tạo mới và thay đổi ứng dụng web một cách dễ dàng, nhanh chóng Bên cạnh đó, ASP.NET MVC cũng hỗ trợ cho việc kiểm thử phần mềm

- Sử dụng cơ chế ViewState để quản lý trạng thái qua mỗi lần request, sử dụng các web control có postback , các event để thực hiện các hành động cho user interface Vậy nên nếu kích thước của ViewState lớn, khi có sự tương tác với người dùng ASP.NET Webforms xử lý chậm

- Việc sinh mã HTML tự động trong webforms đôi khi cũng không thuận tiện cho người lập trình bởi các giá trị được sinh tự động đó có thể không cần thiết hoặc sinh

ra giá trị ID phức tạp, khó truy xuất bởi JavaScript

- Cảm nhận sai trong việc phân tách code ra khỏi mã HTML bằng cách tạo code-behind bên dưới trang

- Khi kiểm tra lỗi rất khó khăn, ASP.NET Webforms phải chạy tất cả các tiến trình ASP.NET

- Việc nhúng các thư viện JavaScript như Jquery vào webforms để tương tác với các web control tương đối phức tạp

 ASP.NET MVC ra đời khắc phục những hạn chế trên của ASP.NET được nhiều người lựa chọn thay thế cho Webforms

Công nghệ ASP.NET MVC là mới, tuy nhiên nền tảng MVC đã có từ năm 1978 được phát minh bởi Trygve Renskaug với cái tên ban đầu là Thing Model View Editor pattern và sau đó được đặt lại là Model View Controller pattern

Trang 16

Năm 2009 phiên bản đầu tiên là ASP.NET MVC 1.0 được ra đời

Kể từ khi ra đời phiên bản đầu tiên, Microsoft đã không ngừng phát tiển ASP.NET MVC hoàn thiện hơn nhằm hỗ trợ tối đa cho người lập trình trong việc giải quyết các vấn đề phát sinh cũng như các giải pháp cho quá trình xây dựng và phát triển các dự án Phiên bản ASP.NET 5/MVC 6 mới được đưa ra tháng 4/2015 vừa qua

1.1.2 Mô hình MVC

Vào cuối những năm 70 đầu những năm 80, MVC (Model – View – Controller) được các nhà nghiên cứu tại phòng thí nghiệm Xerox PARC Palo Alto công bố dựa trên ngôn ngữ lập trình Smalltalk Thế hệ tiếp theo của MVC xuất hiện cùng với hệ điều hành NeXT và các phần mềm đi kèm MVC tiếp tục được phát triển hoàn thiện cho tới ngày nay

Mô hình MVC là một mẫu kiến trúc phần mềm giúp cho người phát triển phần mềm tách các thao tác xử lí nghiệp vụ với phần giao diện một cách rõ ràng hơn, tạo điều kiện thuận lợi cho việc cài đặt cũng như bảo trì, nâng cấp

Hình 1-1 Hình ảnh minh họa mô hình MVC

Trong mô hình MVC:

- Lớp model (M) là phần xử lý các thao tác nghiệp vụ

- Lớp view (V) là phần xử lý về giao diện

- Lớp controller (C) là phần có nhiệm vụ lọc các yêu cầu từ người dùng, điều khiển và phân luồng các yêu cầu gọi đúng model và view thích hợp

Trang 17

 Hoạt động của mô hình MVC:

(1) Người dùng (Client) tương tác với view và gửi yêu cầu

(2) View gửi yêu cầu đó cho controller

(3) Controller nhận yêu cầu và gọi đúng phương phức xử lí ở model

(4) Model nhận thông tin và tiến hành thực thi các phương thức xử lí ( có thể liên quan đến kết nối và truy vấn cơ sở dữ liệu)

(5) Model gửi kết quả sau khi thực thi phương thức xử lí cho view

(6) View nhận kết quả từ model và hiển thị kết quả ra trình duyệt cho người dùng

 Ưu điểm và hạn chế của mô hình MVC

- Dễ mở rộng: Khi có nhu cầu, việc thêm các chức năng vào từng lớp sẽ dễ dàng hơn, dễ kiểm soát

Hạn chế:

- Mô hình MVC thích hợp với những dự án vừa và lớn, có cấu trức phức tạp, nhiều tính năng Đối với dự án nhỏ thì MVC gây cồng kềnh, tốn thời gian trong quá trình phát triển

- Tốn thời gian trung chuyển dữ liệu giữa các lớp

Trang 18

1.1.3 Cấu trúc thƣ mục mặc định của 1 project ASP.NET MVC

Hình 1-2 Hình minh họa cây thƣ mục mặc định trong ASP.NET MVC4

 Ý nghĩa từng thư mục mặc định của 1 ứng dụng trong ASP.NET MVC:

- App-Data: Chứa các file dữ liệu , thư mục App-Data có thể chứa một cơ sở dữ liệu cục bộ

- App-Start: Chứa các sự kiện được gọi đầu tiên khi ứng dụng được chạy

- Content: Chứa các nội dung tĩnh như các file css

- Controllers:

 Chứa cácfile cs là các đối tượng Controller

 Trong ASP.NET MVC tất cả tên của các Controller đều có hậu tố Controller Ví

dụ HomeController, LoginController, AdminController, RegisterController, …

- Filters: Thư mục chứa các file làm nhiệm vụ lọc các dữ liệu, chứng thực request trước khi gọi các action (Có ở MVC4 trở lên)

- Images: Thư mục chứa hình ảnh của ứng dụng

Trang 19

- Models: Chứa các lớp models có liên quan đến kết nối hoặc truy vấn cơ sở dữ liệu

- Scripts: chứa các file JavaScript hỗ trợ cho ứng dụng, mạc định thư mục này có chứa các tập tin ASP.NET Ajax và thư viện Jquery

- Views:

 Chứa các view là các giao diện của ứng dụng

 Trong Views có chứa các thư mục ứng với mỗi Controller khác nhau, các thư mục

đó có tên giống với tiền tố của Controller Ví dụ trong Controller có HomeController thì ở Vews có thư mục Home

 Trong thư mục Home này chứa các file cshtml có tên ứng với mỗi Action (phương thức) xử lý của Controller Ví dụ trong file HomeController có 2 ActionResult là Index() và Login() thì ở Views/Home cũng có 2 file là Index.cshtml và Login.cshtml

- Global.asax: Trong ASP.Net MVC file này chủ yếu dùng để định nghĩa các kiểu url

sẽ được sử dụng và cho phép người lập trình ánh xạ url đó với những Controller và Action tương ứng của nó

- Web.config: Chứa các file cấu hình của ứng dụng được viết dưới dạng XML

1.2 ASP.NET MVC4

1.2.1 ASP.NET MVC4 là gì?

ASP.NET MVC4 là một framework cho phép xây dựng những ứng dụng web chuẩn, có khả năng mở rộng, sử dụng tốt các mẫu thiết kế cũng như sức mạnh mà ASP.NET Web API cung cấp

Phiên bản ASP.NET MVC4 được phát hành vào ngày 15/8/2012 và là một phần được tích hợp trong Visual Studio 2012

Một ứng dụng được viết bằng ASP.NET MVC4 có cấu trúc thư mục như cấu trúc thư mục của 1 project ASP.NET MVC đã trình bày ở trên

1.2.2 Tại sao nên lựa chon ASP.NET MVC4 là môi trường cài đặt ứng dụng?

Để bắt đầu 1 dự án chắc hẳn ai cũng sẽ lựa chọn cho mình một môi trường cài đặt phù hợp để có thể thể hỗ trợ một cách tốt nhất trong suốt quá trình cài đặt ứng dụng Khi lựa chọn ASP.NET MVC4, framework này sẽ không làm bạn thất vọng bởi những tính năng mà MVC4 cung cấp như:

Trang 20

- ASP.NET MVC4 là framework hoạt động theo mô hình MVC, vậy nên những ưu điểm mà mô hình MVC mang lại thì MVC4 đều có

- ASP.NET MVC4 bao gồm cả ASP.NET Web API, là framework cho phép tạo ra các dịch vụ HTTP mà các trình duyệt của client, các thiết bị di động hoặc máy tính bảng đều có thể truy cập được

- Template được dùng để tạo mới 1 project có giao diện đẹp mắt hơn

Hình 1-3 Hình minh họa _layout mặc định trong ASP.NET MVC4

- Hỗ trợ Mobile Project Template: Khi ứng dụng được truy cập trên các thiết bị di động hoặc máy tính bảng, sử dụng Jquery Mobile cho phép tối ưu hóa giao diện cảm ứng (thu nhỏ giao diện vừa với kích thước màn hình của thiết bị di động) giúp người dùng

dễ dàng sử dụng ứng dụng hơn

- Cung cấp Display Modes: 1 ứng dụng có thể lựa chọn các view dựa trên trình duyệt đang yêu cầu Ví dụ, nếu sử dụng trình duyệt trên máy tính yêu cầu trang đăng ký tuyển sinh, trình duyệt hiển thị Views/Thisinhdangky/Register.cshtml thì khi sử dụng một trình duyệt mobile yêu cầu trang đăng ký tuyển sinh, ứng dụng có thể hiển thị Views/Thisinhdangky/Register.mobile.cshtml

Trang 21

- Đối với những action đòi hỏi thời gian xử lý lâu có thể sử dụng Async Controller để thiết lập thời gian giới hạn

- Cung cấp luôn Entity Framework 5 cho phép dễ dàng tương tác với cơ sở dữ liệu

1.2.3 Models trong ASP.NET MVC4

Trong models của ASP.NET MVC4 được tích hợp Entity Framework 5 cho phép ánh xạ

mô hình cơ sở dữ liệu quan hệ từ SQL Server thành các đối tượng được diễn tả trong ngôn ngữ lập trình của người lập trình

Hình 1- 4 Hình minh họa Entity Framework ánh xạ các bảng trong cơ sở dữ liệu

1.2.3.1 Tạo Data Model với Entity Framework

Để tạo lớp dữ liệu sử dụng Entity Framework ta làm như sau:

Bước 1: Right click Models -> Add -> New Item -> chọn thẻ Data -> Chọn ADO.NET

Entity Data Model -> đặt tên lớp dữ liệu -> bấm nút Add

Bước 2: Chọn Generate from database -> bấm Next -> New Connection -> Nhập tên

SQL Server -> Nhập tên database -> Click OK -> Next

Bước 3: Click chọn các thành phần muốn ánh xạ và bấm Finish

 Sau khi làm xong bước 3 ta đã tạo được lớp Data Model với Entity Framework (là file *.edmx)

Chú ý:

Khi cơ sở dữ liệu trong SQL Server có sự thay đổi (Thêm bảng, thêm thuộc tính,

…) phải update lại Data Model bằng cách : Click chuột phải vào 2 file *.Context.tt và

file *.Data.tt -> chọn Run Custom Tool

1.2.3.2 Truy vấn cơ sở dữ liệu với Entity Framework

Trang 22

Thông thường Models trong MVC4 có 2 thành phần chính là các lớp thực thể Entity và các lớp thực thi

 Lớp thực thể Entity là lớp mô phỏng 1 bản ghi cho từng bảng CSDL tương ứng

Ví dụ: trong CSDL bảng NGANH có 2 trường là Ma_nganh kiểu Tinyint và Ten_nganh kiểu nvarchar(255) Khi được ánh xạ sang lớp thực thể Entity là đối tượng NGANH có 2 thuộc tính Ma_nganh kiểu byte và Ten_nganh kiểu string

 Khi tạo xong lớp thực thể, lớp thực thi được Entity Framework tự động tạo ra, đây là lớp chứa các phương thức để thực hiện các nhiệm vụ như: thêm, sửa, xóa hay select các bản ghi ứng với từng bảng tương ứng trong CSDL

Ví dụ: Bảng NGANH sẽ có 1 lớp thực thi tương ứng là NGANHs Lớp này sẽ có các phương thức như Add(), Remove(), Select(), Where(), Count(),…

Một số truy vấn cơ sở dữ liệu mà bất kỳ chương trình quản lý nào cũng phải có:

 Thêm dòng mới vào cơ sở dữ liệu

Ví dụ: Thêm 1 tài khoản quản trị trong hệ thống thông tin hỗ trợ tuyển sinh đại học

2015 của trường Đại học Nha Trang

Hình 1-5 Hình minh họa mã lệnh thêm1 tài khoản quản trị

Trang 23

 Cập nhật trong cơ sở dữ liệu

Ví dụ: Đặt lại mật khẩu cho 1 tài khoản quản trị

 Xóa dòng trong cơ sở dữ liệu

Ví dụ: Xóa 1 tài khoản quản trị

Hình 1-7 Hình minh họa xóa 1 tài khoản quản trị Hình 1-6 Hình minh họa phương thức sửa mật khẩu của 1 tài khoản quản trị sử dụng EF

Trang 24

Ngoài những cú pháp truy vấn trên còn có nhiều cách để tương tác với cơ sở dữ liệu như

sử dụng select(), join, where, order by, truy vấn theo kiểu LINQ…

1.2.4 Controllers và Action

Trung tâm xử lý của mô hình MVC là Controller, tất cả các hành động của người dùng như gõ vào một URL, bấm 1 nút submit form hay enter 1 textbox…đều được lắng nghe và

xử lý bởi Controller Controller sử dụng các Models để lấy dữ liệu, xử lý và truyền dữ liệu

đó ra Views, Views hiển thị kết quả trả về cho người dùng

Tất cả tên của lớp Controller phải có hậu tố Controller là: Tên + Controller

Ví dụ: HomeController, ThisinhdangkyController, AddminController,…

Các giai đoạn xử lý của Controller:

- Xác định action method nào được gọi và xác nhận action đó có sẵn sàng để được gọi

- Nhận các giá trị sử dụng như các các tham số của action method được gọi

- Xử lý các lỗi có thể xảy ra trong quá trình thực thi action method đó

- Cung cấp các lớp WebFormViewEngine mặc định để render đến các Views

Ví dụ: Khi thí sinh bấm nút đăng nhập để đăng ký xét tuyển ThisinhDangkyController làm như sau:

- Trong ThisinhDangkyController có ActionResult là Index, khi thí sinh bấm vào mục đăng ký xét tuyển, cotroller xác định gọi action mặc định là Index

- Action Index này được gọi và làm nhiệm vụ:

 Nhận các giá trị fMabaove, fSbd, fCmnd từ pForm khi thí sinh submit dữ liệu (bấm nút đăng nhập)

 Kiểm tra và xử lý lỗi như: Sai mã bảo vệ, sai số báo danh hoặc số CMND, đăng nhập quá 3 lần,…

 Truyền các kết quả đã xử lý ra View tương ứng

public ActionResult Index( FormCollection pForm)

{ tuyensinh_dbEntities db = new tuyensinh_dbEntities ();

byte fDotTuyenSinh = ( byte )db.DOT_TUYEn_SINH.First().tendot;

if (fDotTuyenSinh == 0) {

return RedirectToAction( "Khongtuyensinh" );

}

Trang 25

ViewBag.error = "" ; ViewBag.showerror = false ;

string fMabaove = pForm[ "txt_mbv" ] == null ? "" : ( string )pForm[ "txt_mbv" ]; string fSbd = pForm[ "txt_sbd" ] == null ? "" : ( string )pForm[ "txt_sbd" ];

string fCmnd = pForm[ "txt_cmnd" ] == null ? "" : ( string )pForm[ "txt_cmnd" ];

if (Session[ "captcha" ] == null ) Session[ "captcha" ] = "1234" ;

if (pForm[ "btn_dangnhap" ] != null ) {

if (( int )Session[ "qua3lan" ] >= 3) {

ViewBag.showerror = true ; ViewBag.error = "Bạn đã sai quá 3 lần, hãy thử lại lúc sau" ; db.Dispose();

return View(); //end

}

if ((( string )Session[ "captcha" ]).ToLower() != fMabaove.ToLower()) {

//session 3 lan ko hop le

Session[ "qua3lan" ] = (( int )Session[ "qua3lan" ]) + 1; ViewBag.showerror = true ;

ViewBag.error = "Sai mã bảo vệ" ; db.Dispose();

return View(); //end

} //check

THI_SINH fThiSinh = db.THI_SINH.Where(x => x.SBD == fSbd && x.CMND == fCmnd).FirstOrDefault();

if (fThiSinh == null ) {

ViewBag.showerror = true ; ViewBag.error = "Sai số báo danh hoặc số CMND" ; //session 3 lan ko hop le

Session[ "qua3lan" ] = (( int )Session[ "qua3lan" ]) + 1; db.Dispose();

return View(); //end

} Session[ "THI_SINH" ] = fThiSinh;

TAI_KHOAN_THI_SINH fTaiKhoanthisinh = fThiSinh.TAI_KHOAN_THI_SINH.Where(x => x.Dot == fDotTuyenSinh).FirstOrDefault();

if (fTaiKhoanthisinh == null ) return RedirectToAction( "register" );

else

return RedirectToAction( "detail" );

Trang 26

} return View();

}

Ở ví dụ trên ta thấy, khi controller action muốn trả kết quả cho người dùng cả 1 trang web hay chuyển tới trang khác thì action này sẽ trả về đối tượng được kế thừa từ lớp ActionResult

Một số lớp kế thừa từ ActionResult:

ActionResult Miêu tả

EmptyResult Diễn tả một Response rỗng, không làm gì cả

ContentResult Trả về nội dung thuần văn bản

RedirectResult Chuyển đến một trang khác với đường dẫn được truyền

vào

RedirectToRouteResult Chuyển đến URL của Route với tên Route được truyền

vào

RedirectToAction Trả về 1 RedirectToRouteResult

ViewResult Gọi đến một View Engine để trả về một trang HTML

PartialViewResult Gần giống như ViewResult nhưng chỉ miêu tả 1 phần

nào đó của view chính

Bảng 1-1 Bảng liệt kê một số lớp k thừa từ ActionResult

Trong controller không chỉ trả về cho người dùng kết quả của việc xử lý yêu cầu từ người dùng sử dụng lớp kế thừa từ ActionResult mà còn có các lớp kề thừa từ JsonResult

Ví dụ: Controller Action thêm thí sinh đăng ký xét tuyển

[ HttpPost ]

public JsonResult Add( List < DangkiAjax > pListDangkiAjax)

{

if (Session[ "TAI_KHOAN_QUAN_TRI" ] == null ||

(( TAI_KHOAN_QUAN_TRI )Session[ "TAI_KHOAN_QUAN_TRI" ]).Quyen>2)

{

return Json( new { sbd = "Error" });

}

Trang 27

tuyensinh_dbEntities db = new tuyensinh_dbEntities ();

byte Dot = ( byte )db.DOT_TUYEn_SINH.First().tendot;

int sophieu = pListDangkiAjax[0].sophieu;

THI_SINH ts = db.THI_SINH.Where(x => x.ID_thi_sinh == id).First();

if (db.TAI_KHOAN_THI_SINH.Where(x => x.ID_thi_sinh == ts.ID_thi_sinh && x.Dot==Dot).Count() != 0)

Trang 28

catch ( Exception er) {

return Json( new { sbd = er.Message });

Ứng dụng được xây dựng với controller xử lý mạnh mẽ, model hiện đại nhưng view không được thiết kế đẹp mắt, thân thiện và tiện dụng thì người dùng cũng sẽ không cho bạn nhiều thời gian để chứng minh ứng dụng của mình tốt như thế nào Với ASP.NET MVC4 việc tạo view khá đơn giản và linh động từ dữ liệu, stylesheet, javascript thông qua các các thuộc tính xuyên suốt từ controller cho tới view như ViewBag, ViewData, ViewModel, bởi

sự hỗ trợ của Razo View Engine hay ASPX (giống như webform)

1.2.5.1 Tạo Views nhƣ th nào?

Để tạo View có 2 cách như sau:

Cách 1: Tạo view thông qua tên phương thức action

Right click vào tên action trong controller -> chọn Add View -> Nhập tên view -> Add

Trang 29

Hình 1-8 Hình minh họa cách tạo view tại controller

Theo quy định trong ASP.NET MVC, các view trong thư mục Views phải cùng tên với tên của controller trong lớp Controllers Ví dụ trong Controllers có HomeController thì trong Views có thư mục Home là thư mục chứa view của HomeController

Cách 2: Tạo trực tiếp trên thư mục Views: Right click trên thư mục muốn tạo view ->

Add -> View -> Nhập tên view -> Add

Hình 1-9 Hình minh họa tạo view tại thƣ mục Views

Trang 30

Ví dụ: Trong HomeController có action Index thì tương ứng trong Views có thư mục Home là thư mục chứa các view của HomeController Trong thư mục Home này chứa file Index.cshtml là file chứa các thẻ HTML, JavaScript, Boostrap, Jquery,… mà ta sử dụng để tạo giao diện Những gì được trình bày trong Views/Home/Index.cshtml này sẽ được hiển thị

ở trình duyệt khi người dùng truy cập trang /Home/Index

Một số đặc điểm của Views trong ASP.NET MVC4:

- ASP.NET MVC4 hỗ trợ HTML5, vậy nên những thẻ viết được ở HTML5 thì cũng sử

dụng được trong việc tạo view

- Không sử dụng server control nên không còn thuộc tính runat = “Server” nữa

Trang 31

- Sử dụng cú pháp @{} khi muốn hiển thị dữ liệu ra view

Ví dụ: Hiển thị layout và title của trang web

@{

Layout = "~/Views/Shared/_MainLayout.cshtml" ;

ViewBag.Title = "Hướng dẫn đăng ký" ;

}

- Controller muốn truyền thông báo hay bất kỳ nội dung nào ra view có thể sử dụng

ViewBag.[Tên biến] = [nội dung]; và ngược lại, khi view muốn sử dụng nội dung

mà controller truyền ra đó thì sử dụng cú pháp @ViewBag.[Tên biến]

Ví dụ: Trong action Register của controller ThisinhDangky có truyền ra View 2 biến:

public ActionResult Register()

{

if (Session[ "THI_SINH" ] == null )

return RedirectToAction( "index" );

THI_SINH fThiSinh = ( THI_SINH )Session[ "THI_SINH" ];

Trang 32

- Ngoài ra còn có thể sử dụng partial view sử dụng cú pháp:

@Html.Partial(“Tên partial view”)

Ví dụ: Sử dụng partial view ở trang ThisinhDangky/Register.cshtml

< div id ="div_dangki" class ="panel panel-default" style ="">

< div class ="panel-heading">

<! button and sophieu >

1.2.6 Sử dụng Ajax trong ASP.NET MVC4

1.2.6.1 Ajax là gì?

Đối với những người lập trình web thì Ajax là công nghệ phát triển web không mấy xa

lạ Ajax là cụm từ viết tắt của Asynchronous JavaScript and XML – nghĩa là "JavaScript và XML không đồng bộ", là một nhóm các công nghệ phát triển web được sử dụng để tạo các ứng dụng web động Trong đó:

- HTML và CSS giữ vai trò hiển thị dữ liệu

- Mô hình Document Object Model được thực hiện thông qua JavaScript nhằm hiển thị

thông tin động và tương tác với những thông tin được hiển thị

- Đối tượng XMLHttpRequest dùng để trao đổi dữ liệu một cách không đồng bộ với

máy chủ web

- XML thường là định dạng mặc định cho dữ liệu dược truyền, ta cũng có thể thay đổi

định dạng của dữ liệu theo kiểu JSON hay văn bản thuần,…

1.2.6.2 Tại sao nên sử dụng Ajax?

Đối với một ứng dụng web thông thường khi người dùng gửi yêu cầu lên server, server

sẽ thực hiện lấy dữ liệu, kiểm tra hợp lệ, tính toán,…sau đó sẽ gửi trả kết quả cho người dùng là 1 trang HTML hoàn chỉnh Việc này nhìn qua có vẻ hợp lý, tuy nhiên nếu nhìn kỹ một chút sẽ thấy được những hạn chế của nó mà có thể cải tiến được nếu sử dụng Ajax Khi nhận được một HttpRequest lên server, thay vì server xử lý và trả về cả 1 trang html hoàn chỉnh (có nghĩa là khi có kết quả sẽ có tải lại trang) thì Ajax chỉ nạp lại những nội dung

bị thay đổi còn các phần khác được giữ nguyên, thời gian chờ sẽ được thay thế bằng thông điệp như “đang tải dữ liệu…” Vì vậy, sử dụng Ajax sẽ làm giảm quá trình “đi lại” của thông tin và giảm thời gian chờ đợi của người dùng và thời gian xử lý của server

Trang 33

Ví dụ: Sau khi đăng ký xét tuyển trực tuyến, thí sinh muốn thay đổi nguyện vọng xét tuyển bằng cách đăng nhập vào hồ sơ, chọn lại ngành, chọn khối xong, thí sinh bấm nút

“Lưu” Thay vì server xử lý kiểm tra thông tin đăng đăng ký hợp lệ,…rồi trả lại kết quả bằng cách tải lại toàn bộ giao diện trang hồ sơ xét tuyển thì ta sử dụng Ajax vào sự kiện này để giảm bớt gánh nặng cho server Dữ liệu truyền đi được định dạng theo kiểu JSON

function saveToServer() {

if (kiemtra() == false ) { return ; }

if (thisinh.duyet == true ) { //no update

$( "#modal-no-update" ).modal( 'show' );

return ;

}

//make json[] DangkiAjax

var fListDangkiAjax = [];

for ( var row = 1; row <= 4; row++) {

if ($( "#tr_" + row).css( 'display' ) == 'none' ) { //not visible

$( "#" + chonkhoi + " option:selected" ).each( function () {

danhsachkhoi.push($( this ).val());

});

fDangkiAjax.danhsachkhoi = danhsachkhoi;

fDangkiAjax.nganh = $( "#chonnganh_" + row).val();

fListDangkiAjax.push(fDangkiAjax); //push to list

}

//show wait

$( "#modal-wait" ).modal( 'show' );

var DTO = JSON.stringify(fListDangkiAjax);

}).done( function (data) {

$( "#modal-wait" ).modal( 'hide' );

$( "#modal-wait-success" ).modal( 'show' );

}).fail( function () {

$( "#modal-wait" ).modal( 'hide' );

alert( "Lỗi! Hãy tải lại trang" );

Trang 34

});

} //end fn

1.2.7 Jquery và Boostrap hỗ trợ tạo giao diện ứng dụng ASP.NET MVC4

Jquery là thư viện của Javascript giúp đơn giản hóa cách viết Javascript và tăng tốc độ

xử lý các sự kiện trên trang web Jquery thực hiện truy xuất đến các phần tử trong ứng dụng thông qua thuộc tính “id” của phần tử đó Ngoài ra, Jquery còn cho phép tạo các hiệu ứng động, cung cấp các mẫu css đẹp mắt chỉ cần khai báo và sử dụng Có các Event Handler để

xử lý những sự kiện khi có sự tương tác của người dùng

Ví dụ: Khai báo các jquery sử dụng hiển thị kết quả xét tuyển tạm thời

<! table sorter >

< script src ="~/Scripts/tablesorter-master/js/jquery.tablesorter.js"></ script >

< script src

="~/Scripts/tablesorter-master/js/jquery.tablesorter.widgets.js"></ script >

< script src ="~/Scripts/tablesorter-master/js/widgets/widget-scroller.js"></ script >

< link href ="~/Scripts/tablesorter-master/css/theme.ice.css" rel ="stylesheet" />

< link href ="~/Scripts/tablesorter-master/css/theme.blue.css" rel ="stylesheet" />

// format is called when the on init and when a sorting has finished

format: function (table) {

// loop all tr elements and set the value for the first column

for ( var i = 0; i < table.tBodies[0].rows.length; i++) {

$( "tbody tr:eq(" + i + ") td:first" , table).html(i + 1);

Trang 35

Một công cụ khác hỗ trợ đắc lực cho việc tạo giao diện ứng dụng có thẩm mỹ và tiết kiệm thời gian cho người lập trình đó là Boostrap

Bootstrap được phát triển bởi Mark Otto và Jacob Thornton tại Twitter như một framework CSS Nó là một tập hợp các bộ chọn, thuộc tính và giá trị có sẵn để giúp web designer tránh việc lặp đi lặp lại trong quá trình tạo ra các class CSS và những đoạn mã HTML giống nhau trong dự án web của mình Việc sử dụng Boostrap tương đối dễ dàng, không cần viết quá nhiều mã lệnh CSS

Ví dụ: Sử dụng Boostrap tạo _MainLayout.cshtml layout chính của giao diện người dùng

<! js >

< script src ="~/Scripts/jquery-1.11.2.min.js"></ script >

<! bootstrap >

< link type ="text/css" href ="~/Scripts/bootstrap/css/bootstrap.min.css" rel ="stylesheet" />

< script src ="~/Scripts/bootstrap/js/bootstrap.min.js"></ script >

< div id ="container" class ="center">

<! head >

< div id ="header">

< div >

< img src =" / /Images/dhnt02.png" title ="Đại học Nha trang"

alt ="Đại học Nha trang" />

</ div >

< nav >

< href ="/thisinhdangki/index" id ="a_dangki" class ="a_menu">

Đăng ký xét tuyển </ a

color : white ; "> @( "|" ) </ span >

< href ="/thisinhdanhsach/index" class ="a_menu" id ="a_danhsach">

Kết quả xét tuyển tạm thời </ a

color : white ; "> @( "|" ) </ span >

@ if (Xemdot1 == true )

{

< div class ="dropdown" style =" display : inline-block ; ">

< data-toggle ="dropdown" aria-haspopup ="true"

aria-expanded ="false" class ="a_menu" id ="a_dstt"

Danh sách trúng tuyển < span class ="caret"></ span >

</ a

< ul class ="dropdown-menu" role ="menu" aria-labelledby ="dLabel">

@ for ( int i = 0; i < ArrayXem.Length; i++)

Trang 36

< span style =" padding-left : 7px ; padding-right : 10px ;

color : white ; "> @( "|" ) </ span >

1.3 Hệ quản trị cơ sở dữ liệu SQL Server 2008

1.3.1 Giới thiệu ngôn ngữ cơ sở dữ liệu quan hệ SQL

SQL là viết tắt của Structured Query Language (ngôn ngữ hỏi có cấu trúc), là một hệ thống ngôn ngữ bao gồm tập các câu lệnh sử dụng để tổ chức, quản lý và truy xuất dữ liệu được lưu trữ trong các cơ sở dữ liệu

SQL được sử dụng để điều khiển tất cả các chức năng mà một hệ quản trị cơ sở dữ liệu cung cấp cho người dùng bao gồm:

- Định nghĩa dữ liệu: SQL cung cấp khả năng định nghĩa các cơ cở dữ liệu, các cấu trúc

lưu trữ cũng như mối quan hệ giữa các thành phần dữ liệu Ví dụ: Tạo cơ cơ sở dữ liệu, tạo bảng, tạo ràng buộc, tạo khung nhìn,…

Trang 37

- Truy xuất và thao tác dữ liệu: Dễ dàng thực hiện các thao tác truy xuất như thêm, cập

nhật hay xóa bỏ dữ liệu trong cơ sở dữ liệu

- Điều khiển truy cập: Cung cấp cơ chế cấp phát và kiểm soát các thao tác của người sử

dụng trên cơ sở dữu liệu

- Đảm bảo toàn vẹn dữ liệu: Cho phép định nghĩa các ràng buộc toàn vẹn trong cơ sở

dữ liệu (tạo khóa chính, khóa ngoại, ràng buộc check, unique,…) nhằm đảm bảo tính hợp lệ và chính xác của dữ liệu trước các thao tác cập nhật lỗi của người dùng

- Trong cơ sở dữ liệu quan hệ, bảng là đối tượng được sử dụng để tổ chức và lưu trữ dữ

liệu Một cơ sở dữ liệu có thể có nhiều bảng và mỗi bảng được xác định duy nhất bởi tên bảng

Cú pháp tạo cơ sở dữ liệu: create database [Tên cơ sở dữ liệu]

Ví dụ: create database Tuyensinh_db

Cú pháp tạo bảng:

create table [Tên bảng]

( [Tên cột 1] [Kiểu dữ liệu] <ràng buộc cột 1>,

[Tên cột 2] [Kiểu dữ liệu] <ràng buộc cột 1>,,

……

< Các ràng buộc trên bảng > )

Các kiểu dữ liệu thường dùng trong SQL:

Char(n) Kiểu chuỗi với độ dài cố định

Nchar(n) Kiểu chuỗi với độ dài cố định hỗ trợ unicode

Varchar(n) Kiểu chuỗi với độ dài chính xác

Nvarchar(n) Kiểu chuỗi với độ dài chính xác hỗ trợ unicode

Integer Số nguyên có giá trị từ -231 đến 231 - 1

Trang 38

Tinyint Số nguyên có giá trị từ 0 đến 255

Smallint Số nguyên có giá trị từ -215 đến 215 – 1

Bigint Số nguyên có giá trị từ -263 đến 263-1

Decimal Kiểu số với độ chính xác cố định

Float Số thực có giá trị từ -1.79E+308 đến 1.79E+308

Bit Kiểu bit (có giá trị 0 hoặc 1)

Datetime Kiểu ngày giờ (chính xác đến phần trăm của giây)

Text Dữ liệu kiểu chuỗi với độ dài lớn (tối đa

2,147,483,647 ký tự) Ntext Dữ liệu kiếu chuỗi với độ dài lớn và hỗ trợ unicode

(tối đa 1,073,741,823 ký tự)

Bảng 1-1 Bảng liệt kê các kiểu dữ liệu thường dùng trong SQL Server 2008

Ví dụ: Tạo bảng TAI_KHOAN_QUAN_TRI

Create table TAI_KHOAN_QUAN_TRI

( id tinyint primary key,

Ten_tai_khoan varchar(255),

Mat_khau varchar(255),

Quyen tinyint )

Trang 39

1.3.2 Các câu lệnh thường sử dụng trong SQL

Create table [Tên bảng] Tạo bảng

Drop table [Tên bảng] Xóa bảng

Alter table [Tên bảng] Chỉnh sửa bảng

Add [Tên cột] [Kiểu dữ liệu] Thêm cột vào bảng

Create procedure [Tên thủ tục] Tạo thủ tục lưu trữ

Alter procedure [Tên thủ tục] Chỉnh sửa thủ tục lưu trữ

Drop procedure [Tên thủ tục] Xóa thủ tục lưu trữ

Create function [Tên hàm] Tạo hàm do người dùng định nghĩa Alter function [Tên hàm] Chỉnh sửa hàm

Drop function [Tên hàm] Xóa hàm

Create trigger [Tên trigger] Tạo trigger

Alter trigger [Tên trigger] Chỉnh sửa trigger

Drop trigger [Tên trigger] Xóa trigger

Bảng 1-2 Bảng liệt kê các câu lệnh thường dùng trong SQL Server 2008

Trang 40

Các câu lệnh trong SQL được bắt đầu bởi các từ lệnh, là từ khóa cho biết chức năng của câu lệnh (chẳng hạn như select, update, delete,…) và sau đó là các mệnh đề của câu lệnh

Ví dụ: câu lệnh lấy ra toàn bộ thông tin của bảng TAI_KHOAN_QUAN_TRI trong cơ

sở dữ liệu Tuyensinh_db là:

Hình 1-11 Hình minh họa câu lệnh Select trong SQL Server 2008

Ngày đăng: 16/10/2015, 13:08

HÌNH ẢNH LIÊN QUAN

Hình 1-5 Hình minh họa mã lệnh thêm1 tài khoản quản trị - Xây dựng hệ thống thông tin hỗ trợ tuyển sinh đại học 2015 của trường đại học nha trang
Hình 1 5 Hình minh họa mã lệnh thêm1 tài khoản quản trị (Trang 22)
Hình 1-8 Hình minh họa cách tạo view tại controller - Xây dựng hệ thống thông tin hỗ trợ tuyển sinh đại học 2015 của trường đại học nha trang
Hình 1 8 Hình minh họa cách tạo view tại controller (Trang 29)
Hình 1-10 Hình minh họa tạo view ở thƣ mục Views (ti p theo) - Xây dựng hệ thống thông tin hỗ trợ tuyển sinh đại học 2015 của trường đại học nha trang
Hình 1 10 Hình minh họa tạo view ở thƣ mục Views (ti p theo) (Trang 30)
Hình 2-1 Hình minh họa sơ đồ use case tổng quát - Xây dựng hệ thống thông tin hỗ trợ tuyển sinh đại học 2015 của trường đại học nha trang
Hình 2 1 Hình minh họa sơ đồ use case tổng quát (Trang 46)
Hình 2-17 Hình minh họa biểu đồ trình tự của chức năng duyệt hồ sơ th  sinh - Xây dựng hệ thống thông tin hỗ trợ tuyển sinh đại học 2015 của trường đại học nha trang
Hình 2 17 Hình minh họa biểu đồ trình tự của chức năng duyệt hồ sơ th sinh (Trang 78)
Hình 2-19 Hình minh họa biểu đồ trình tự của chức năng in bảng thống kê bậc thang - Xây dựng hệ thống thông tin hỗ trợ tuyển sinh đại học 2015 của trường đại học nha trang
Hình 2 19 Hình minh họa biểu đồ trình tự của chức năng in bảng thống kê bậc thang (Trang 80)
Hình 2-23 Hình minh họa biểu đò trạng thái của đối tƣợng th  sinh - Xây dựng hệ thống thông tin hỗ trợ tuyển sinh đại học 2015 của trường đại học nha trang
Hình 2 23 Hình minh họa biểu đò trạng thái của đối tƣợng th sinh (Trang 84)
Hình 2-24 Hình minh họa biểu đồ trạng thái của đối tƣợng ban tuyển sinh - Xây dựng hệ thống thông tin hỗ trợ tuyển sinh đại học 2015 của trường đại học nha trang
Hình 2 24 Hình minh họa biểu đồ trạng thái của đối tƣợng ban tuyển sinh (Trang 85)
Hình 2-25 Hình minh họa biểu đồ trạng thái của đối tượng ngườiq uản trị - Xây dựng hệ thống thông tin hỗ trợ tuyển sinh đại học 2015 của trường đại học nha trang
Hình 2 25 Hình minh họa biểu đồ trạng thái của đối tượng ngườiq uản trị (Trang 86)
Hình 3-3 Hình minh họa giao diện đăng ký xét tuyển - Xây dựng hệ thống thông tin hỗ trợ tuyển sinh đại học 2015 của trường đại học nha trang
Hình 3 3 Hình minh họa giao diện đăng ký xét tuyển (Trang 89)
Hình 3-5 Hình minh họa giấy đăng ký xét tuyển của th  sinh khi in - Xây dựng hệ thống thông tin hỗ trợ tuyển sinh đại học 2015 của trường đại học nha trang
Hình 3 5 Hình minh họa giấy đăng ký xét tuyển của th sinh khi in (Trang 91)
Hình 3-7 Hình minh họa giao diện chỉnh sửa hồ sơ đăng ký xét tuyển của th  sinh - Xây dựng hệ thống thông tin hỗ trợ tuyển sinh đại học 2015 của trường đại học nha trang
Hình 3 7 Hình minh họa giao diện chỉnh sửa hồ sơ đăng ký xét tuyển của th sinh (Trang 92)
Hình 3-8 Hình minh họa giao diện chỉnh sửa hồ sơ đăng ký xét tuyển của th  sinh (ti p theo) - Xây dựng hệ thống thông tin hỗ trợ tuyển sinh đại học 2015 của trường đại học nha trang
Hình 3 8 Hình minh họa giao diện chỉnh sửa hồ sơ đăng ký xét tuyển của th sinh (ti p theo) (Trang 93)
Hình 3-13 Hình minh họa giao diện quản lý hồ sơ th  sinh - Xây dựng hệ thống thông tin hỗ trợ tuyển sinh đại học 2015 của trường đại học nha trang
Hình 3 13 Hình minh họa giao diện quản lý hồ sơ th sinh (Trang 96)
Hình 3-17 Hình minh họa giao diện thi t lập điểm chuẩn - Xây dựng hệ thống thông tin hỗ trợ tuyển sinh đại học 2015 của trường đại học nha trang
Hình 3 17 Hình minh họa giao diện thi t lập điểm chuẩn (Trang 98)

TỪ KHÓA LIÊN QUAN

TRÍCH ĐOẠN

TÀI LIỆU CÙNG NGƯỜI DÙNG

TÀI LIỆU LIÊN QUAN

🧩 Sản phẩm bạn có thể quan tâm

w