Chương 2. Sử dụng các điều khiển Standard

Chương Sử dụng điều khiển Standard Trong chương bạn học điều khiển cở ASP.NET Framework, điều khiển mà bạn thường xuyên sử dụng ứng dụng web I Điều khiển hiển thị thông tin Label Một số thuộc tính Tên thuộc tinh BackColor BorderColor BorderStyle Ảnh hưởng Cho phép thay đổi màu Label Cho phép thiết lập đường viền Label Hiển thị đường viền Label theo dạng Notset, None, Dotted, Dashed, Solid, Double, Groove, Ridge, Insert cssClass Font ForeColor Style ToolTip ID OutSet Cho phép đưa vào lớp css Thiết lập thuộc tính Font Thiết đặt màu chữ nội dung Label Cho phép gán thuộc tính cho Label Hiển thị nội dung di chuột vào điều khiển Label Tên điều khiển Tuy điều khiển Label chứa đựng nhiều thuộc tính để kết xuất hiển thị với kinh nghiệm trình thiết kế Web tơi khun bạn lên sử dụng thuộc tính cssClass để sử dụng lớp css Ví dụ: Gán thuộc tính trực tiếp Sử dụng cssClass Kết 2, Điều khiển Literal Giống với điều khiển Label bạn dùng Literal để trình bày Text nội dung Html Literal hỗ trợ thuộc tính mà Label khơng hỗ trợ là: thuộc tính Mode gồm giá trị là: Pass through, Endcode, transform Ví dụ Hiên thị: II Điều khiển cho phép người dùng nhập liệu 1, Điều khiển TextBox Bảng thuộc tính: Thuốc tính Textmode Kiểu hiển thị Textbox gồm giá trị: SingleLine- hiển thị trường nhập liệu dòng, MultiLine- hiển thị trường nhập liệu nhiều dòng, Password- hiển thị trường nhập mà Text thay ký AccessKey tự đặc biệt Cho pheps bạn định phím để di chuyển tới control AutoCompleteType TextBox Cho phép bạn kết hợp với lớp autoComplete với AutoPostBack điều khiển TextBox Cho phép gửi liệu lên server nội dung Columms Enabled MaxLength TextBox thay đổi Cho phép định số cột hiển thị TextBox Cho phép hay không cho phép nhập liệu TextBox Cho phép quy đinh độ dài liệu mà người sử ReadOnly dụng nhập TextBox Cho phép đưa liệu TextBox không nhập Rows TabIndex Wrap liệu vào Cho phép định số dòng hiển thị TextBox Cho phép định thứ tự Tab TextBox Cho phép định có word-wraps khơng thiết lập thuộc tính TextMode Multiline Điều khiển TextBox hỗ trợ phương thức kiện sau: - Focus: cho phép thiết lập form khởi tạo ưu tiên tới TextBox - TextChanged: Xảy Server nội dung TextBox thay đổi để kiên xảy bạn cần thiết đặt thuộc tính AutoPostback true Sử dụng điều khiển CheckBox Các thuộc tính AccessKey Enables you to specify a key that navigates to the TextBox contro AutoPostBack nablesyou to post the form containing the CheckBox back to the server automatically when the CheckBox is checked or Checked unchecked Cho phép bạn gán thiết đặt trạng thái chọn hay không Enabled chọn CheckBox Cho phép không cho phép TabIndex Text TextAlign Enables you to specify the tab order of the check box Enablesyou to provide a label for the check box Enables you to align the label for the check box Possible values are Left and Right CheckBox hỗ trợ phương thức va kiện - Focus: Enables you to set the initial form focus to the check box - CheckedChanged: Raisedontheserverwhenthecheckboxischeckedorunchecked Điều khiển RadioButton Điều khiển RadioButton sử dụng nhóm nhóm RadioButton chọn Các thuộc tính Thuộc tinh AccessKey Enablesyou to specify a key that navigates to the RadioButton control AutoPostBack Enables you to post the form containing the RadioButton back to the server automatically when the radio button is checked or Checked Enabled GroupName TabIndex Text TextAlign unchecked Enables you to get or set whether the RadioButton control is checked Enables you Enables you Enables you Enables you to to to to disable the RadioButton group RadioButton controls specify the tab order of the RadioButton control label the RadioButton control Enablesyou to align the RadioButton label Possible values are Left and Right RadioButton hỗ trợ phương thức kiện - Focus: Enables youto set the initial form focus to the RadionButton control - CheckedChanged: Raised on the server when the unchecked III Submitting Form Data Điều khiển Button Các thuộc tính: AccessKey CommandArgument CommandName Enabled OnClientClick PostBackUrl TabIndex Text UseSubmitBehavior Cho phép định phím di chuyển tới điều khiển Button Cho phép bạn rõ đối số truyền tới lệnh thực Chỉ định tên lệnh truyền tới Command Event Cho phép vơ hiệu hố điều khiển Button Cho phép định đến hàm phía client nhấn vào Button Cho phép trả liệu lên trang khác Chỉ định thứ tự tab Button Nội dung text hiển thị điều khiển Button Cho phép sử dụng javascript để trả liệu lên form Các phương thức kiện - Focus: Cho phép thiết lập khơi tạo Form ưu tiên điều khiển TextBox - Click: Xảy điều khiển Button nhấn - Command: Xảy điều khiển Button nhấn CommandName CommandArgument truyền qua kiện Điều khiển LinkButton: phương thức thuộc tính giống với điều khiển Button cách hiển thị dạng Text giống thẻ HTML áp dụng thuộc tính css thể cho đối tượng LinkButton Học viên tự tìm hiểu thêm Điều khiển ImageButton Các thuộc tính phương thức điều khiển Button thêm vào số thuộc tính Thuộc tính ImageUrl ImageAlign Chỉ đến đường dẫn ảnh Cho phép chỉnh ảnh ImageButton giá trị là: AbsBottom, AbsMiddle, Baseline, Bottom, Left, Middle, NotSet, Right, TextTop, and Top Sử dụng Client Scripts với điều khiển Button Cả ba điều khiển Button có thuộc tính OnClientClick, bạn sử dụng thuộc tính để thực mã phía Client mà bạn cần điều khiển Button nhấn Ví dụ protected void btnDelete_Click(object sender, EventArgs e) { lblResult.Text = “All pages deleted!”; } iTechPro Giải thích ví dụ: đoạn mã form gồm điều khiển Button Label Trong điều khiển Button ta gán vào kiện: OnClientClick phía Clien, OnClick phía Server OnClientClick thực người dùng phía Client nhấn vào Button, mã Client trình bày hàm confirm javascript với mục đính hỏi người dùng xác nhận việc thực “Bạn có chắn?” người dùng chọn OK Sự kiện thứ OnClick thực cịn chọn Cancel kiện phía Server không thực Thực chuyển trang Mặc định bạn nhấn vào Button thực công việc trang trang Load lại lần bạn sử dụng thuộc tính PostBackUrl để chuyển sang trang khác Ví dụ bạn có trang ButtonSearch.aspx iTechPro Trong thuộc tính PostBackUrl điều khiển btnSearch chuyển sang trang ButtonSearchResult void Page_Load(object sender, EventArgs e) { if (PreviousPage != null) { TextBox txtSearch = (TextBox)PreviousPage.FindControl("txtSearch"); lblSearch.Text = txtSearch.Text; } } iTechPro Trong đoạn mã ta để ý phương thức FindControl PreviousPage tìm đến Điều khiển trang ButtonSearch.aspx mà ta cung cấp ID Chỉ định Button mặc định Ví dụ trang bạn có nhiều điều khiển Button, nhập liệu bạn lại quen nhập xong liệu nhấn nút Enter bàn phím, bạn để mặc định nút cập nhật liệu làm mặc định nhấn phím Emter Như ví dụ void btnXacnhan_Click(object sender,EventArgs e) { lblThongbao.Text = txtHoten.Text; } iTechPro Điều khiển Command Event 10 Sự khác Command Event Command Click Command Event bạn cung cấp Command Name Command argument Trong ví dụ trước tơi lấy ví dụ kiện Command Click nên lấy ví dụ Command Event để bạn so sánh Ví dụ trang bạn có điều khiển Button ví dụ đây: void hcubiuChon(object sender, CommandEventArgs e) { if (e.CommandName == "language") { switch (e.CommandArgument.ToString()) { case "C#": lblComandEvent.Text = "CShap"; break; case "VBNET": lblComandEvent.Text = "VB.NET"; break; case "JAVA": lblComandEvent.Text = "Java"; break; } } } 11 iTechPro Bạn chọn ngôn ngữ: Cả ba điều khiển Button chứa Tên lệnh đối số lệnh tuỳ thuộc vào đối số lệnh khác để ta thực công việc tương ứng 12 IV Điều khiển hiển thị ảnh ASPNET bao gồm điều khiển hiển thị ảnh điều khiển Image ImageMap Điều khiển Image Điều khiển dùng để hiển thị ảnh giống với thẻ HTML Các thuộc tính quan tâm Thuộc tính AlternateText DescriptionUrl Nội dung thay lỗi đường dẫn ảnh Cho phép bạn cung cấp đường dẫn đến trang miêu tả chi tiết ImageAlign nội dung ảnh Cho phép chỉnh ảnh lên quan tới thành phần HTML khác trang giá trị sau:AbsBottom, AbsMiddle, Baseline, Bottom, Left, Middle, NotSet, Right, TextTop, and Top Đường dẫn ảnh điều khiển ImageUrl Ví dụ void Page_Load(object sender, EventArgs e) { Random rnd = new Random(); switch (rnd.Next(3)) { case 0: Image1.ImageUrl = "Images/images1.jpg"; Image1.AlternateText = "Picture 1"; break; case 1: Image1.ImageUrl = "Images/images2.jpg"; 13 Image1.AlternateText = "Picture 2"; break; case 2: Image1.ImageUrl = "Images/images3.jpg"; Image1.AlternateText = "Picture 3"; break; } } iTechPro Điều khiển ImageMap 14 Cho phép bạn tạo đồ ảnh ảnh hiển thị trang web mà người dùng phía Client chọn vào vùng ảnh để thực cơng việc Ví dụ void ImageMap1_Click(object sender, ImageMapEventArgs e) { switch (e.PostBackValue) { case "top": lblResult.Text = "Day la phan dau"; break; case "middle": lblResult.Text = "day la phan giua"; break; case "under": lblResult.Text = "day la phan cuoi"; break; } } 15 iTechPro Các thuộc tính ImageMap giống với Image thêm vào hai thuộc tính là: - HotSpots: cho phép bạn điền tập hợp thông tin HotSpots chứa đựng điều khiển ImageMap - HotSpotMode:Cho phép bạn định Enables you to specifythe behavior of the image map when you click a region Possible values are Inactive, Navigate, NotSet, and PostBack V Điều khiển Panel Khi bạn cần đưa điều khiển trang vào nhóm để giải thích nghĩa cho nhóm để ần nhóm điều nhấn kiện trang bạn, bạn dùng điều khiển panel Một số thuộc tính điều khiển panel mà bạn cần lưu ý là: - DefaultButton: Cho phép bạn định nghĩa button mặc định panel mà button mặc định thực bạn nhấn phím Enter - Direction: Cho phép bạn gán thiết đặt hướng hiển thị nội dung đưa panel, giá trị:NotSet, LeftToRight, and RightToLeft - GroupingText: Cho phép bạn trình bày Panel Fieldset với giải riêng biệt 17 - HorizontalAlign: Cho phép bạn hướng ngang thể nội dung panel có thẻ giá trị: Center, Justify, Left, NotSet, and Right - ScrollBars: Cho phép bạn hiển thị scrollbars bạn cố định chiều cao chiều rộng panel nội dung panel vượt độ rộng độ cao đó, giá trị: Auto, Both, Horizontal, None, and Vertical Ví dụ void Page_Load(object sender, EventArgs e) { for (int i = 1; i < 100; i++) { buletnghenghiep.Items.Add("Nghề "+i.ToString()); } } void hcubiuSothich(object sender, EventArgs e) { if (chkhtsothich.Checked == true) panelsothich.Visible = true; else panelsothich.Visible = false; } void hcubiuNghenghiep(object sender, EventArgs e) 18 { if (chkhtnghenghiep.Checked == true) panelnghenghiep.Visible = true; else panelnghenghiep.Visible = false; } iTechPro 19 20 ... TextTop, and Top Sử dụng Client Scripts với điều khiển Button Cả ba điều khiển Button có thuộc tính OnClientClick, bạn sử dụng thuộc tính để thực mã phía Client mà bạn cần điều khiển Button nhấn... PostBack V Điều khiển Panel Khi bạn cần đưa điều khiển trang vào nhóm để giải thích nghĩa cho nhóm để ần nhóm điều nhấn kiện trang bạn, bạn dùng điều khiển panel Một số thuộc tính điều khiển panel... Cả ba điều khiển Button chứa Tên lệnh đối số lệnh tuỳ thuộc vào đối số lệnh khác để ta thực cơng việc tương ứng 12 IV Điều khiển hiển thị ảnh ASPNET bao gồm điều khiển hiển thị ảnh điều khiển