Lab – 07 – Các trạng thái PostBack pdf

ThS. Trần Thị Bích Hạnh – Nguyễn Đức Huy

2009

Lab – 07 – Các trạng thái PostBack

Trong Lab 07 này, s
ẽ

đ
ề

c
ậ
p đ
ế
n các v
ấ
n đ
ề

v
ề

Event và PostBack c
ủ
a
một trang ASPX. Dựa vào đó các Developer có thể điều khiển được

trạng thái của một trang ASPX.
Trường Đại Học Khoa Học Tự Nhiên
Khoa Công Nghệ Thông Tin
Bộ môn Công Nghệ Phần Mềm
Môn: Công nghệ Web ASP.Net

September 26, 2009

LAB – 07 – CÁC TRạNG THÁI POSTBACK

Trường Đại Học Khoa Học Tự Nhiên | Công Nghệ Web ASP.Net

2

1 Mục đích - Yêu cầu
1.1 Mục đích
- Nắm vững các kiến thức sử dụng IsPostBack, IsCrossPagePostBack.
- Cách sử dụng các property đó trong các ứng dụng web ASP.Net.
1.2 Yêu cầu
- Áp dụng để thực hiện một ứng dụng đăng ký Account Gmail mới.
- Bài tập sinh viên lưu lại dưới định dạng sau:
o Tạo Website Application có tên là <MSSV>_Lab07_PostBack.
o Nến Project lại thành một file <MSSV>_Lab07_PostBack.ziphoặc
<MSSV>_Lab07_PostBack.rar.
- Thời gian làm bài: 03 ngày.
2 Nội dung cơ bản
- PreviousPagelà một đối tượng chỉ một trang ASPX trước đó đã PostBack đến
trang ASPX hiện tại. Ví dụ: Trang A PostBack đến trang B thì ở trang B đối tượng
PreviousPage chính là trang A.
- IsPostBack là một cờ được dùng để xác định trạng thái của một trang ASPX có tự

động gọi lại chính nó hay không? IsPostBack có 2 giá trị:
o True: trang ASPX đã thực hiện một gọi một hàm lên hệ thống và sau đó
gọi lại trang ASPX đó.
o False: trang ASPX mới được gọi lên lần đầu tiên.
- IsCrossPagePostBack là một cờ (hay còn gọi là property) được dùng để xác định
trạng thái Loadlại của một trang A khi được một trang B khác gọi Load lại. Ví dụ:
từ trang A postback đến trang B thì trang B sẽ nạp lại trang A vào trong bộ nhớ
của Server. Và tại đây cờ IsCrossPagePostBack của trang A sẽ được set giá trị
True. (ở đây xet IsCrossPagePostBacklà property của trang A)
o True: Trang A đã PostBack qua trang B và đã được trang B gọi load lại vào
bộ nhớ để tương tác lấy dữ liệu ra.
o False: là trang A chưa PostBack đến bất kỳ trang nào khác.
- Khi xét đến IsCrossPagePostBackthường là IsCrossPagePostBackđối tượng
PreviousPage. Và IsCrossPagePostBackcủa trang hiện tại luôn là False.
- IsCallBack là một cờ hoạt động cho biết một đối tượng Ajax tự động Load dữ liệu
lại trang hiện tại (chỉ Load một phần dữ liệu trên một control nào đó, không Load
lại hết toàn trang).
- Bảng chi thông tin chi tiết về trạng thái của các loại cờ trên
September 26, 2009

LAB – 07 – CÁC TRạNG THÁI POSTBACK

Trường Đại Học Khoa Học Tự Nhiên | Công Nghệ Web ASP.Net

3

Trường hợp Giá trị thuộc tính
Original request o
IsPostBack
=

false
.
o PreviousPage = null (Nothingtrong Visual
Basic).
o IsCallback = false.
Postback o
IsPostBack
=
true
.
o PreviousPage = null (Nothingtrong Visual
Basic).
o IsCallback = false.
Cross-page posting o
IsPostBack
=
false
.
o PreviousPagetham chiếu tới trang nguồn.
o IsCrossPagePostBack = true.
o IsCallback = false.
Server transfer o
IsPostBack
=
false
.
o PreviousPagetham chiếu tới trang nguồn.
o IsCrossPagePostBack= false với
IsCrossPagePostBack này là của trang được
tham chiếu tới trongPreviousPage.

o IsCallback = false.
Callback o
IsPostBack
=
false
.
o PreviousPage = null (Nothingtrong Visual
Basic).
o IsCallback = true.
3 Bài tập thực hành
3.1 Tạo website application
- Tạo một project Web Application có cấu truc website như sau:
September 26, 2009

LAB – 07 – CÁC TRạNG THÁI POSTBACK

Trường Đại Học Khoa Học Tự Nhiên | Công Nghệ Web ASP.Net

4


- Thiết kế form có dạng như sau cho trang Default.aspx:

- Bản control thành phần
Id Loại control Mục đích sử dụng
txtStudentID
TextBox Nhận giá trị MSSV
txtName
TextBox Nhận giá trị tên SV
txtEmail

TextBox Nhận giá trị Email SV
btnOriginal
Button Chuyển dữ liệu từ TextBox
xuống các Label
btnTargetPage1
Button PostBack sang trang
Target1.aspx
btnTargetPage2
Button PostBack sang trang
September 26, 2009

LAB – 07 – CÁC TRạNG THÁI POSTBACK

Trường Đại Học Khoa Học Tự Nhiên | Công Nghệ Web ASP.Net

5

Target2.aspx
btnServerTransfer
Button PostBack sang trang
ServerPage.aspx
lblResultStudentID
Label Chứa giá trị trả về của
txtStudentID
lblResultName
Label Chứa giá trị trả về của
txtName
lblResultEmail
Label Chứa giá trị trả về của
txtEmail

- Đặt thuộc tính PostBackURL cho các Button theo các bước sau
o Click vào nut … của PostBackURL để chọn trang ASPX cần PostBack
đến

o Chọn trang cần PostBack đến
September 26, 2009

LAB – 07 – CÁC TRạNG THÁI POSTBACK

Trường Đại Học Khoa Học Tự Nhiên | Công Nghệ Web ASP.Net

6


o Danh sách PostBack của các Button như sau:
Button ID PostBackURL
btnTargetPage1
~/Target_1.aspx
btnTargetPage2
~/Target_2.aspx
3.2 Ứng dụng IsPostBack
- Dùng cơ IsPostBackđể kiểm tra trạng thái của trang Default.aspxcó được phải lần
đầu tiên được load lên hay không. Nếu không phải thì sẽ lấy các giá trị của các
textboxgán cho các label.
- Định nghĩa sự kiện Page_Loadcủa trang Default.aspx như sau:
namespaceLab07_PostBack
{
publicpartialclass_Default : System.Web.UI.Page
{
protectedvoidPage_Load(objectsender, EventArgse)

{
if (IsPostBack)
{
SaveData();
}
}

privatevoidSaveData()
September 26, 2009

LAB – 07 – CÁC TRạNG THÁI POSTBACK

Trường Đại Học Khoa Học Tự Nhiên | Công Nghệ Web ASP.Net

7

{
lblResultStudentID.Text = txtStudentID.Text;
lblResultName.Text = txtName.Text;
lblResultEmail.Text = txtEmail.Text;
}
}
}
- Khi deploy lên browser sẽ nhận được kết quả như sau:

3.3 Ứng dụng IsCrossPagePostBack
3.3.1 Ứng dụng PreviousPage
- Dùng đối tượng PreviousPageđể kiểm trang một trang có PostBack dữ liệu qua
trang sau hay không.
- Thiết kế trang Target_1.aspxnhư hình sau:

September 26, 2009

LAB – 07 – CÁC TRạNG THÁI POSTBACK

Trường Đại Học Khoa Học Tự Nhiên | Công Nghệ Web ASP.Net

8


- Trong đó các thành phần Label sẽ giống như trang Default.aspx.
- Định nghĩa sự kiện Page_Loadcho trang Target_1.aspxnày như sau:
namespaceLab07_PostBack
{
publicpartialclassTarget_1 : System.Web.UI.Page
{
protectedvoidPage_Load(objectsender, EventArgse)
{
if (PreviousPage != null)
{
SaverData();
}
}

privatevoidSaverData()
{
lblResultStudentID.Text = ((TextBox)this.PreviousPage.FindControl("txtStudentID")).Text;
lblResultName.Text = ((TextBox)this.PreviousPage.FindControl("txtName")).Text;
lblResultEmail.Text = ((TextBox)this.PreviousPage.FindControl("txtEmail")).Text;
}
}

}
- Dùng phương thức FindControl của đối tượng PreviousPageđể tương tác vào một
control của trang ASPX trước đó.
- Deploy lên Browser sẽ có kết quả như sau:
September 26, 2009

LAB – 07 – CÁC TRạNG THÁI POSTBACK

Trường Đại Học Khoa Học Tự Nhiên | Công Nghệ Web ASP.Net

9


3.3.2 Ứng dụng IsCrossPagePostBack
- Do Control trong trang ASPX trước có thuộc tính dạng protected nên ở trang sau
sẽ không truy xuất trực tiếp được qua đối tượng PreviousPage. Do vậy Cần phải
định nghĩa một phương thức public để xuất các giá trị trong các Control đó ra bên
ngoài.
- Trong file Default.aspx.cssẽ định nghĩa các phương thức hay property đó như sau:
publicStringStudentID
{
get { returntxtStudentID.Text; }
}

publicStringName
{
get { returntxtName.Text; }
}

publicStringEmail

{
September 26, 2009

LAB – 07 – CÁC TRạNG THÁI POSTBACK

Trường Đại Học Khoa Học Tự Nhiên | Công Nghệ Web ASP.Net

10

get { returntxtEmail.Text; }
}
- Vậy file Default.aspx.cs sẽ có nội dung như sau:
namespaceLab07_PostBack
{
publicpartialclass_Default : System.Web.UI.Page
{
protectedvoidPage_Load(objectsender, EventArgse)
{
if (IsPostBack)
{
SaveData();
}
}

privatevoidSaveData()
{
lblResultStudentID.Text = txtStudentID.Text;
lblResultName.Text = txtName.Text;
lblResultEmail.Text = txtEmail.Text;
}

publicStringStudentID
{
get { returntxtStudentID.Text; }
}

publicStringName
{
get { returntxtName.Text; }
}

publicStringEmail
{
get { returntxtEmail.Text; }
}
}
}
- Thiết kế trang Target_2.aspxnhư sau:
September 26, 2009

LAB – 07 – CÁC TRạNG THÁI POSTBACK

Trường Đại Học Khoa Học Tự Nhiên | Công Nghệ Web ASP.Net

11


- Trong đó các thành phần Label sẽ giống như trang Default.aspx.
- Ngoài ra còn cần phải chỉ rõ PreviousPagecủa trang Target_2.aspxnày là trang
Default.aspxbằng cách chuyển qua phần source HTML của trang

Target_2.aspxvà thêm đoạn code HTML như sau:
September 26, 2009

LAB – 07 – CÁC TRạNG THÁI POSTBACK

Trường Đại Học Khoa Học Tự Nhiên | Công Nghệ Web ASP.Net

12


- Định nghĩa sự kiện Page_Loadcho trang Target_2.aspxnày như sau:
namespaceLab07_PostBack
{
publicpartialclassTarget_2 : System.Web.UI.Page
{
protectedvoidPage_Load(objectsender, EventArgse)
{
if (PreviousPage != null&&PreviousPage.IsCrossPagePostBack)
{
SaveData();
}
}

privatevoidSaveData()
{
lblResultStudentID.Text = PreviousPage.StudentID;
lblResultName.Text = PreviousPage.Name;
lblResultEmail.Text = PreviousPage.Email;
}
September 26, 2009

LAB – 07 – CÁC TRạNG THÁI POSTBACK

Trường Đại Học Khoa Học Tự Nhiên | Công Nghệ Web ASP.Net

13

}
}
- Deploy lên Browser sẽ có kết quả như sau:

3.3.3 Ứng dụng CrossPagePostBack trong trường hợp Server Transfer
- Định nghĩa sự kiện Click cho button btnServerTransfer
protectedvoidbtnServerTransfer_Click(objectsender, EventArgse)
{
Server.Transfer("~/ServerTransfer.aspx");
}
- Thiết kế trang ServerTransfer.aspxnhư sau:
September 26, 2009

LAB – 07 – CÁC TRạNG THÁI POSTBACK

Trường Đại Học Khoa Học Tự Nhiên | Công Nghệ Web ASP.Net

14


- Trong đó các thành phần Label sẽ giống như trang Default.aspx.
- Ngoài ra còn cần phải chỉ rõ PreviousPagecủa trang ServerTransfer.aspxnày là
trang Default.aspxbằng cách chuyển qua phần source HTML của trang

ServerTransfer.aspxvà thêm đoạn code HTML như sau:
September 26, 2009

LAB – 07 – CÁC TRạNG THÁI POSTBACK

Trường Đại Học Khoa Học Tự Nhiên | Công Nghệ Web ASP.Net

15


- Định nghĩa sự kiện Page_Loadcho trang ServerTransfer.aspxnày như sau:
namespaceLab07_PostBack
{
publicpartialclassServerTransfer : System.Web.UI.Page
{
protectedvoidPage_Load(objectsender, EventArgse)
{
if (this.PreviousPage != null)
{
SaveData();
}
}

September 26, 2009

LAB – 07 – CÁC TRạNG THÁI POSTBACK

Trường Đại Học Khoa Học Tự Nhiên | Công Nghệ Web ASP.Net

16

privatevoidSaveData()
{
lblResultStudentID.Text = this.PreviousPage.StudentID;
lblResultName.Text = this.PreviousPage.Name;
lblResultEmail.Text = this.PreviousPage.Email;
}
}
}
- Deploy lên Browser sẽ có kết quả như sau:

4 Bài tập
- Thiết kế một trang đăng ký một tài khoảng Gmail mới bằng các control ASP.Net.
September 26, 2009

LAB – 07 – CÁC TRạNG THÁI POSTBACK

Trường Đại Học Khoa Học Tự Nhiên | Công Nghệ Web ASP.Net

17


- Sau khi người dùng điền đầy đủ các thông tin cần thiết sẽ hiển thị trang thông báo
Đăng ký thành công. (sử dụng các đối tượng PreviousPages,
IsCrossPagePostBack).