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: [...]... 26, 2009 LAB – 07 – CÁC TRạNG THÁI POSTBACK - 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: Trường Đại Học Khoa Học Tự Nhiên | Công Nghệ Web ASP.Net 11 September 26, 2009 LAB – 07 – CÁC TRạNG THÁI POSTBACK. .. 2009 LAB – 07 – CÁC TRạNG THÁI POSTBACK - 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: Trường Đại Học Khoa Học Tự Nhiên | Công Nghệ Web ASP.Net 14 September 26, 2009 LAB – 07 – CÁC TRạNG THÁI POSTBACK. .. Thiết kế một trang đăng ký một tài khoảng Gmail mới bằng các control ASP.Net Trường Đại Học Khoa Học Tự Nhiên | Công Nghệ Web ASP.Net 16 September 26, 2009 LAB – 07 – CÁC TRạNG THÁI POSTBACK - 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) Trường Đại Học Khoa Học Tự Nhiên | Công Nghệ Web... 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(); } } Trường Đại Học Khoa Học Tự Nhiên | Công Nghệ Web ASP.Net 15 September 26, 2009 LAB – 07 – CÁC TRạNG THÁI POSTBACK privatevoidSaveData() { lblResultStudentID.Text = this.PreviousPage.StudentID;... lblResultName.Text = PreviousPage.Name; lblResultEmail.Text = PreviousPage.Email; } Trường Đại Học Khoa Học Tự Nhiên | Công Nghệ Web ASP.Net 12 September 26, 2009 LAB – 07 – CÁC TRạNG THÁI POSTBACK } } - 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,... 26, 2009 LAB – 07 – CÁC TRạNG THÁI POSTBACK - Đị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 . 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. 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. 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