Tài liệu hạn chế xem trước, để xem đầy đủ mời bạn chọn Tải xuống
1
/ 23 trang
THÔNG TIN TÀI LIỆU
Nội dung
Nguyễn Phạm Phương Nam – Nguyễn Sơn Hoàng Quốc – Nguyễ 2009 Lab – 02 – Basic Control Trong Lab nãy sẽ hướng dẫn các control cơ bản của ASP.Net 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: Lập Trình ASP.Net November 21, 2009 LAB – 02 – BASIC CONTROL Trường Đại Học Khoa Học Tự Nhiên | Lập trình ASP.Net 1 1 Thao tác trên Label Control 1.1 Thao tác căn bản - Bước 1: Tạo trang Label.aspx Bước 1-1 November 21, 2009 LAB – 02 – BASIC CONTROL Trường Đại Học Khoa Học Tự Nhiên | Lập trình ASP.Net 2 Bước 1-2 November 21, 2009 LAB – 02 – BASIC CONTROL Trường Đại Học Khoa Học Tự Nhiên | Lập trình ASP.Net 3 - Bước 2: chuyển sang chế độ design mode November 21, 2009 LAB – 02 – BASIC CONTROL Trường Đại Học Khoa Học Tự Nhiên | Lập trình ASP.Net 4 - Bước 3: Thêm label control, có ID: labMess November 21, 2009 LAB – 02 – BASIC CONTROL Trường Đại Học Khoa Học Tự Nhiên | Lập trình ASP.Net 5 - Bước 4: Thêm hidden code vào trang Label.aspx.cs November 21, 2009 LAB – 02 – BASIC CONTROL Trường Đại Học Khoa Học Tự Nhiên | Lập trình ASP.Net 6 - Bước 5: chạy thử và test chương trình Bước 5-1 November 21, 2009 LAB – 02 – BASIC CONTROL Trường Đại Học Khoa Học Tự Nhiên | Lập trình ASP.Net 7 Bước 5-2 1.2 Bài tập Thực hành tạo trang web có khả năng focus các control dựa vào hotkey. Yêu cầu : Tạo trang LabelHotKeys.aspx với phần code design ở bên dưới. Tự tiến hành test kết quả thu được November 21, 2009 LAB – 02 – BASIC CONTROL Trường Đại Học Khoa Học Tự Nhiên | Lập trình ASP.Net 8 <body> <form id="form1" runat="server"> <div id="container"> <h1>Using AccessKey for Controls</h1> <asp:Label ID="labName" runat="server" AccessKey="N" AssociatedControlID="txtName" Text="<u>N</u>ame"></asp:Label> <asp:TextBox ID="txtName" runat="server"></asp:TextBox><br /> <asp:Label ID="labMonth" runat="server" AccessKey="M" AssociatedControlID="drpMonth" Text="<u>M</u>onth"></asp:Label> <asp:DropDownList ID="drpMonth" runat="server"> <asp:ListItem>January</asp:ListItem> <asp:ListItem>February</asp:ListItem> <asp:ListItem>March</asp:ListItem> </asp:DropDownList> </div> </form> </body> 2 Thao tác trên TextBox control 2.1 Thao tác trên các thuộc tính quan trọng - Bước 1: Tạo trang TextBox.aspx. Tiến hành kéo thả các control và set các thuộc tính theo mô tả của đoan code bên dưới. November 21, 2009 LAB – 02 – BASIC CONTROL Trường Đại Học Khoa Học Tự Nhiên | Lập trình ASP.Net 9 - Bước 2: Quan sát kết quả thu được [...]...November 21, 2009 LAB – 02 – BASIC CONTROL 2.2 Bài tập Thực hành xử lý sự kiện TextChanged Yêu cầu: Tạo trang TextBoxEvent.aspx theo giao diện bên dưới Trường Đại Học Khoa Học Tự Nhiên | Lập trình ASP.Net 10 November 21, 2009 LAB – 02 – BASIC CONTROL Bắt sự kiện TextChanged trên “txtCountry” Xử lý sự kiện TextChanged theo quy tắc sau: - Nếu txtCountry là “Canada” thì labRegion = “Province” -... | Lập trình ASP.Net 12 November 21, 2009 LAB – 02 – BASIC CONTROL - Bước 3: Kiểm tra các kết quả thu được Trường Đại Học Khoa Học Tự Nhiên | Lập trình ASP.Net 13 November 21, 2009 LAB – 02 – BASIC CONTROL 3.2 Bài tập Thực hành xử lý Command Event Yêu cầu: Xây dựng chương trình Calculator đơn giản với 4 phép tính cơ bản: cộng, trừ, nhân, chia Sử dụng Button control và Command Event Giao diên chương... thay đổi display mode thì BulletedList tương ứng cũng thay đổi theo Trường Đại Học Khoa Học Tự Nhiên | Lập trình ASP.Net 20 November 21, 2009 LAB – 02 – BASIC CONTROL 6 Trường Đại Học Khoa Học Tự Nhiên | Lập trình ASP.Net 21 November 21, 2009 LAB – 02 – BASIC CONTROL Trường Đại Học Khoa Học Tự Nhiên | Lập trình ASP.Net 22 ... break; } labMessage.Text = txtValue1.Text + op + txtValue2.Text + "=" + result; Trường Đại Học Khoa Học Tự Nhiên | Lập trình ASP.Net 16 November 21, 2009 LAB – 02 – BASIC CONTROL } else { labMessage.Text = "Unable to compute a value with these values"; } } 4 Thao tác trên CheckBox Control Yêu cầu: SV tự tìm hiểu cách tạo CheckBox control và thao tác trên sự kiện CheckChanged 5 Thao tác trên List Control. .. Text="Submit"/> Trường Đại Học Khoa Học Tự Nhiên | Lập trình ASP.Net 18 November 21, 2009 LAB – 02 – BASIC CONTROL - Bước 3: tạo code behind protected void Page_Load(object sender, EventArgs e) { if (IsPostBack) { labResult.Text = "Colors chosen: "; foreach (ListItem li in myList.Items) { if (li.Selected) { labResult.Text... txtCountry là “USA” thì labRegion = “State” 3 Thao tác Button Control Gồm 3 loại chính: - Button - LinkButton - ImageButton Trường Đại Học Khoa Học Tự Nhiên | Lập trình ASP.Net 11 November 21, 2009 LAB – 02 – BASIC CONTROL 3.1 Thao tác trên các loại button Ghi chú: tạo thư mục images trong project từ VS Thêm image cần thiết vào thư mục này - Bước 1: Tạo trang Button.aspx Tiến hành kéo thả các control và set... OnCommand="Button_Command" CommandName="multiply" /> Trường Đại Học Khoa Học Tự Nhiên | Lập trình ASP.Net 15 November 21, 2009 LAB – 02 – BASIC CONTROL - Bước 2: Viết xử lý cho sự kiện Command tương ứng /// ... foreach (ListItem li in myList.Items) { if (li.Selected) { labResult.Text += "" + li.Text; labResult.Text += ""; } } } } - Bước 4: Test kết quả thu được Trường Đại Học Khoa Học Tự Nhiên | Lập trình ASP.Net 19 November 21, 2009 LAB – 02 – BASIC CONTROL 5.3 Bài tập a Thực hành thao tác BulletedList Xây dựng trang BulletedList.aspx với giao... November 21, 2009 LAB – 02 – BASIC CONTROL Cách 2: Code behind ListItem li = new ListItem("Choose a color "); li.Selected = true; myDrop.Items.Add(li); myDrop.Items.Add(new ListItem("Red")); myDrop.Items.Add(new ListItem("Blue")); // Specify both display text and value myDrop.Items.Add(new ListItem("Green", "#00FF00")); - Bước 3: Thay đổi style cho các item myLab.Text = "Red text here"; myLab.Attributes["style"]... cơ bản: cộng, trừ, nhân, chia Sử dụng Button control và Command Event Giao diên chương trình đơn giản như hình bên dưới Trường Đại Học Khoa Học Tự Nhiên | Lập trình ASP.Net 14 November 21, 2009 LAB – 02 – BASIC CONTROL Gợi ý thực hiện: - Bước 1: Tạo giao diện chương trình Simple Calculator . 2009 LAB – 02 – BASIC CONTROL Trường Đại Học Khoa Học Tự Nhiên | Lập trình ASP.Net 4 - Bước 3: Thêm label control, có ID: labMess November 21, 2009 LAB – 02 – BASIC CONTROL. November 21, 2009 LAB – 02 – BASIC CONTROL Trường Đại Học Khoa Học Tự Nhiên | Lập trình ASP.Net 2 Bước 1-2 November 21, 2009 LAB – 02 – BASIC CONTROL Trường Đại. 21, 2009 LAB – 02 – BASIC CONTROL Trường Đại Học Khoa Học Tự Nhiên | Lập trình ASP.Net 9 - Bước 2: Quan sát kết quả thu được November 21, 2009 LAB – 02 – BASIC CONTROL