bài 1 làm quen với asp.net

Bài 1:
LÀM QUEN VỚI ASP.NET
Giới thiệu về ASP.NET & các khái niệm cơ bản
Ứng dụng Web
ASP.NET
Cấu trúc ứng dụng ASP.NET
Web Form
Sự kiện
Đối tượng Request/Response
PostPack
Mục tiêu bài học
Giới thiệu về ASP.NET & các khái niệm cơ bản
Ứng dụng Web
ASP.NET
Cấu trúc ứng dụng ASP.NET
Web Form
Sự kiện
Đối tượng Request/Response
PostPack
Làm quen với ASP.NET
2
Mục tiêu bài học
1. Giới thiệu về mô hình MVC
1. ASP.NET & Các khái niệm cơ bản
Làm quen với ASP.NET
3
1. Giới thiệu về mô hình MVC
2. Phát triển ứng dụng ASP.NET
3. Kiểm thử và gỡ lỗi ứng dụng
Làm quen với ASP.NET
4

Ứng dụng Web là một ứng dụng client/server được
truy cập thông qua trình duyệt Web trên mạng
internet hoặc intrannet.
Một ứng dụng Web gồm tập hợp các trang Web được
viết bằng ngôn ngữ do trình duyệt hỗ trợ như: html,
asp.net, java, javascript…
Ứng dụng Web
Server
Ứng dụng Web là một ứng dụng client/server được
truy cập thông qua trình duyệt Web trên mạng
internet hoặc intrannet.
Một ứng dụng Web gồm tập hợp các trang Web được
viết bằng ngôn ngữ do trình duyệt hỗ trợ như: html,
asp.net, java, javascript…
Làm quen với ASP.NET
5
Internet
Máy client
Server
Trình duyệt
Web
Server Web
Server CSDL
Người dùng tại máy client sử dụng trình duyệt gửi yêu
cầu tới Server Web. Server Web xử lý và gửi lại
phản hồi tới trình duyệt. Trình duyệt xử lý và hiển
thị giao diện trang Web cho người dùng
Trình duyệt Web và Server Web sử dụng giao thức HTTP
để trao đổi thông tin.
Người dùng gửi yêu cầu HTTP tới trình duyệt bằng cách

nhập địa chỉ (URL) vào trình duyệt
Ví dụ về URL:
/>Ứng dụng Web
Người dùng tại máy client sử dụng trình duyệt gửi yêu
cầu tới Server Web. Server Web xử lý và gửi lại
phản hồi tới trình duyệt. Trình duyệt xử lý và hiển
thị giao diện trang Web cho người dùng
Trình duyệt Web và Server Web sử dụng giao thức HTTP
để trao đổi thông tin.
Người dùng gửi yêu cầu HTTP tới trình duyệt bằng cách
nhập địa chỉ (URL) vào trình duyệt
Ví dụ về URL:
/>Làm quen với ASP.NET
6
Người dùng gửi yêu cầu
bằng cách nhập địa chỉ
URL
Hai loại ứng dụng Web
Web tĩnh
Viết bằng ngôn ngữ đánh dấu văn bản (HTML)
Không có CSDL đi kèm với ứng dụng
Trang .html chỉ xây dựng với mục đích cung cấp thông tin
Ví dụ:
/>Web động
Viết bằng ngôn ngữ: Asp.net, JSP, PHP…
Có tương tác với người dùng. Nội dung trang là động, hiển
thị khác nhau đáp ứng các sự kiện (nhập liệu, nhấn chuôt…)
của người dùng
Lưu trữ dữ liệu trong CSDL
/>Ứng dụng Web

Hai loại ứng dụng Web
Web tĩnh
Viết bằng ngôn ngữ đánh dấu văn bản (HTML)
Không có CSDL đi kèm với ứng dụng
Trang .html chỉ xây dựng với mục đích cung cấp thông tin
Ví dụ:
/>Web động
Viết bằng ngôn ngữ: Asp.net, JSP, PHP…
Có tương tác với người dùng. Nội dung trang là động, hiển
thị khác nhau đáp ứng các sự kiện (nhập liệu, nhấn chuôt…)
của người dùng
Lưu trữ dữ liệu trong CSDL
/>Làm quen với ASP.NET
7
ASP.NET là một framework được phát triển để xây
dựng các trang web động kết hợp giữa HTML, CSS,
JavaScript và mã kịch bản phía server.
ASP.NET là một phần
của .NET Framework
ASP.NET
ASP.NET là một framework được phát triển để xây
dựng các trang web động kết hợp giữa HTML, CSS,
JavaScript và mã kịch bản phía server.
ASP.NET là một phần
của .NET Framework
Làm quen với ASP.NET
8
Nội dung demo:
Chạy thử ứng dụng Web ASP.NET
Nhập thông tin vào các trường

Nhấn chuột vào button Calculate và Clear để khám phá sự
thay đổi nội dung của trang Web động
Demo
Chạy thử một ứng dụng Web ASP.NET
Làm quen với ASP.NET
9
Cấu trúc ứng dụng ASP.NET
1. Thư mục các lớp của ứng dụng
2. Thư mục chứa file CSDL
3. Thư mục chứa File ảnh
4. Các Web Form tương ứng với
các trang của ứng dụng
5. File cấu hình ứng dụng
Các thành phần 4, 5 là thành
phần bắt buộc phải có
Ngoài ra còn có thêm thư mục:
chứa file css…
Cấu trúc ứng dụng ASP.NET
Cấu trúc ứng dụng ASP.NET
1. Thư mục các lớp của ứng dụng
2. Thư mục chứa file CSDL
3. Thư mục chứa File ảnh
4. Các Web Form tương ứng với
các trang của ứng dụng
5. File cấu hình ứng dụng
Các thành phần 4, 5 là thành
phần bắt buộc phải có
Ngoài ra còn có thêm thư mục:
chứa file css…
Làm quen với ASP.NET

10
Trong một ứng dụng ASP.NET, mỗi trang Web được gọi
là một Web Form
Có hai mô hình viết mã cho một Web Form
1. Mô hình trang đơn
Web Form
Trang ASP.NET
(file .aspx)
Trong một ứng dụng ASP.NET, mỗi trang Web được gọi
là một Web Form
Có hai mô hình viết mã cho một Web Form
1. Mô hình trang đơn
Làm quen với ASP.NET
11
Trang ASP.NET
(file .aspx)
Mã đánh dấu
(Mark Code)
Trình bày giao diện
Mã lập trình
(xử lý sự kiện)
-Điều khiển
HTML
- Điều khiển
ASP.NET
- CSS….
C#
hoặc VB
2. Mô hình trang code-behind (code-behind page model)
Hầu như các lập trình viên ASP.NET đều sử dụng mô

hình Code-behind vì có nhiều ưu điểm: dễ viết và đọc
mã, hỗ trợ bởi visual studio…
Web Form
File chứa mã đánh dấu (.aspx)
Chứa mã đánh dấu và mã gọi
file code-behind
File code-behind (.cs)
Chứa các mã lập trình xử lý sự
kiện trang
Gọi (Call)
2. Mô hình trang code-behind (code-behind page model)
Hầu như các lập trình viên ASP.NET đều sử dụng mô
hình Code-behind vì có nhiều ưu điểm: dễ viết và đọc
mã, hỗ trợ bởi visual studio…
Làm quen với ASP.NET
12
Mã aspx: Chứa các mã trình bày giao diện trang: HTML,
ASP.NET, CSS…
Ví dụ về Web Form
sử dụng mô hình Code-behind
<%@ Page Language="C#" AutoEventWireup="true" CodeFile="SimpleWebForm.aspx.cs"
Inherits="SimpleWebForm" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
" /><html xmlns=" /><head runat="server">
<title>Một Web Form đơn giản</title>
</head>
<body style="height: 141px">
<form id="frmSimpleWebForm" runat="server">
<div style="height: 133px">
Đây là một Web Form đơn giản

<br />
User:
<asp:TextBox ID="txtUser" runat="server"></asp:TextBox>
<br />
<asp:Button ID="btnSubmit" runat="server" Text="Submit" />
</div>
</form>
</body>
</html>
Tiêu đề trang
Dòng chỉ dẫn <@Page….>
Thuộc tính CodeFile chỉ ra tên file code-
behind của WebForm
Inherits chỉ ra tên lớp của Web Form
Làm quen với ASP.NET
13
<%@ Page Language="C#" AutoEventWireup="true" CodeFile="SimpleWebForm.aspx.cs"
Inherits="SimpleWebForm" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
" /><html xmlns=" /><head runat="server">
<title>Một Web Form đơn giản</title>
</head>
<body style="height: 141px">
<form id="frmSimpleWebForm" runat="server">
<div style="height: 133px">
Đây là một Web Form đơn giản
<br />
User:
<asp:TextBox ID="txtUser" runat="server"></asp:TextBox>
<br />

<asp:Button ID="btnSubmit" runat="server" Text="Submit" />
</div>
</form>
</body>
</html>
Tiêu đề trang
Phần nội dung trang
Web nằm trong thẻ
<form>
Chứa: Đoạn văn bản,
mã HTML, điều khiển
ASP.NET
Mã cs: Chứa các phương thức xử lý sự kiện trang
Ví dụ về Web Form
sử dụng mô hình Code-behind
using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.UI;
using System.Web.UI.WebControls;
public partial class SimpleWebForm : System.Web.UI.Page
{
protected void Page_Load(object sender, EventArgs e)
{
// Các mã xử lý sự kiện Load của trang
// Thường là các mã khởi tạo giá trị Default cho các điều khiển
}
protected void btnSubmit_Click(object sender, EventArgs e)
{

// Mã xử lý sự kiện người dùng nhấn vào button Submit
}
}
Khai báo các namespace cần thiết
Tên lớp thừa kế lớp Page. Tên lớp
này được khai báo trong dòng chỉ
dẫn @Page của fle aspx
Làm quen với ASP.NET
14
using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.UI;
using System.Web.UI.WebControls;
public partial class SimpleWebForm : System.Web.UI.Page
{
protected void Page_Load(object sender, EventArgs e)
{
// Các mã xử lý sự kiện Load của trang
// Thường là các mã khởi tạo giá trị Default cho các điều khiển
}
protected void btnSubmit_Click(object sender, EventArgs e)
{
// Mã xử lý sự kiện người dùng nhấn vào button Submit
}
}
Tên lớp thừa kế lớp Page. Tên lớp
này được khai báo trong dòng chỉ
dẫn @Page của fle aspx

Sự kiện là những hành động được người dùng kích
hoạt trên Web Form khi ứng dụng đang chạy.
Ví dụ: Nhấn vào button, nhấn phím
ASP.NET là mô hình lập trình hướng sự kiện
Mỗi sự kiện được xử lý bởi một khối mã nằm trong file
.cs, gọi là phương thức xử lý sự kiện.
Hai loại sự kiện
Sự kiện tự động kích hoạt
Các sự kiện trong vòng đời của trang
Sự kiện do người người dùng kích hoạt
Sự kiện
Sự kiện là những hành động được người dùng kích
hoạt trên Web Form khi ứng dụng đang chạy.
Ví dụ: Nhấn vào button, nhấn phím
ASP.NET là mô hình lập trình hướng sự kiện
Mỗi sự kiện được xử lý bởi một khối mã nằm trong file
.cs, gọi là phương thức xử lý sự kiện.
Hai loại sự kiện
Sự kiện tự động kích hoạt
Các sự kiện trong vòng đời của trang
Sự kiện do người người dùng kích hoạt
Làm quen với ASP.NET
15
Sự kiện – Chuột
lấy mồi
Phản hồi– Bẫy
sập
Vòng đời của một trang Web
Sự kiện trong
vòng đời của một trang Web

Init
Load
Sự kiện
(Event)
protected void Page_Init(object sender,
EventArgs e) { }
protected void Page_Load(object sender,
EventArgs e) { }
Làm quen với ASP.NET
16
Pre Render
Unload
Sự kiện
(Event)
protected void Page_PreRender (object
sender, EventArgs e) { }
protected void Page_Unload (object
sender, EventArgs e) { }
Một phương thức xử lý sự kiện đơn giản
Khi người dùng nhấn chuột vào button Submit. Trang Web
sẽ hiển thị dòng chữ “Bạn vừa bấm vào button Submit”
Phương thức xử lý sự kiện
Làm quen với ASP.NET
17
protected void btnSubmit_Click(object sender, EventArgs e)
{
Response.Write("Bạn vừa bấm vào button Submit";
}
ASP.NET duy trì các thông tin
trao đổi giữa Client và Server

thông qua các đối tượng:
Request
Response
Server
ASP.NET cung cấp các lớp
HttpRequest , HttpResponse,
HttpServerUtility thuộc
namespace System.Web để làm
việc với các đối tượng này
Đối tượng Request/Response
HTTP Request
HTTP Response
ASP.NET duy trì các thông tin
trao đổi giữa Client và Server
thông qua các đối tượng:
Request
Response
Server
ASP.NET cung cấp các lớp
HttpRequest , HttpResponse,
HttpServerUtility thuộc
namespace System.Web để làm
việc với các đối tượng này
Làm quen với ASP.NET
18
PostPack là quá trình gửi trở lại các thông tin từ trình
duyệt tới Server để xử lý.
Khi người dùng tương tác với trang web bằng cách tạo
một sự kiện, trang sẽ được gửi trở lại server và trải qua
vòng đời giống như một trang mới.

Thuộc tính IsPostPack của lớp Page được dùng để
kiểm tra trang được yêu cầu lần đầu tiên hay là kết quả
của quá trình PostPack
PostPack
PostPack là quá trình gửi trở lại các thông tin từ trình
duyệt tới Server để xử lý.
Khi người dùng tương tác với trang web bằng cách tạo
một sự kiện, trang sẽ được gửi trở lại server và trải qua
vòng đời giống như một trang mới.
Thuộc tính IsPostPack của lớp Page được dùng để
kiểm tra trang được yêu cầu lần đầu tiên hay là kết quả
của quá trình PostPack
Làm quen với ASP.NET
19
Làm quen với ASP.NET
20
Ba môi trường phát triển ứng dụng ASP.NET
Môi trường máy tính độc lập (Một máy tính đóng vai trò là
client đồng thời là server)
Môi trường mạng LAN (Đọc SGK)
Môi trường Internet (Đọc SGK)
Sinh viên sẽ sử dụng môi trường độc lập để phát triển
ứng dụng ASP.NET
Môi trường
phát triển ứng dụng ASP.NET 4
Ba môi trường phát triển ứng dụng ASP.NET
Môi trường máy tính độc lập (Một máy tính đóng vai trò là
client đồng thời là server)
Môi trường mạng LAN (Đọc SGK)
Môi trường Internet (Đọc SGK)

Sinh viên sẽ sử dụng môi trường độc lập để phát triển
ứng dụng ASP.NET
Làm quen với ASP.NET
21
Phần mềm: - Window XP hoặc phiên bản cao hơn
- .NET Framework 4
- Visual Studio 2010
- Tùy chọn: IIS, SQL Server
Môi trường phát triển độc lập
Visual Studio là một bộ sản phẩm gồm IDE và .NET
Framework sử dụng để
Phát triển
Debug
Đóng gói (Deploy)
các ứng dụng .NET
Visual Studio cũng là một công cụ hữu ích để phát triển
các ứng dụng ASP.NET
Sinh viên đã được làm quen với tính năng và các phiên
bản của công cụ này trong môn lập trình Windows.
Visual Studio 2010
Visual Studio là một bộ sản phẩm gồm IDE và .NET
Framework sử dụng để
Phát triển
Debug
Đóng gói (Deploy)
các ứng dụng .NET
Visual Studio cũng là một công cụ hữu ích để phát triển
các ứng dụng ASP.NET
Sinh viên đã được làm quen với tính năng và các phiên
bản của công cụ này trong môn lập trình Windows.

Làm quen với ASP.NET
22
Mở chương trình Visual Studio
Tạo một ứng dụng Web
Mở Menu File > New > Web Site để mở hộp thoại New
Web Site
Demo
Tạo ứng dụng Web
Mở chương trình Visual Studio
Tạo một ứng dụng Web
Mở Menu File > New > Web Site để mở hộp thoại New
Web Site
Làm quen với ASP.NET
23
Demo
Thêm một Web Form
Làm quen với ASP.NET
24
Chọn checkbox để tạo Web Form
theo mô hình trang Code-behind
Giao diện Visual Studio
Toolbox
chứa các
điều khiển
thiết kế
giao diện
Web Form
Solution
Explorer
chứa cấu

trúc file và
thư mục của
ứng dụng
Vùng làm việc chính
- Lập trình viên có thể
sửa nội dung các File
aspx, cs
- Các File được hiển thị
ở ba chế độ Design
hoặc Split hoặc Source.
Làm quen với ASP.NET
25
Toolbox
chứa các
điều khiển
thiết kế
giao diện
Web Form
Các nút bật chế độ Design, Split, Source
Solution
Explorer
chứa cấu
trúc file và
thư mục của
ứng dụng
Vùng làm việc chính
- Lập trình viên có thể
sửa nội dung các File
aspx, cs
- Các File được hiển thị

ở ba chế độ Design
hoặc Split hoặc Source.
Cửa sổ
Properties.
Để chỉ định
các thuộc
tính cho các
thành phần
của trang
Web