Ngôn ngữ ASP.NET - Điều khiển ImageButton
Điều khiển ImageButton của Web Forms
Cũng giống như điều khiển Button, điều khiển ImageButton có thêm hình trên nút điều khiển, mặc định đều là các nút Submit Button, mỗi khi được nhấn vào sẽ PostBack về Server.
Cú pháp tạo nút điều khiển ImageButton phía Server:
<asp:ImageButton ID="ImageButton1" runat="server" ImageUrl="~/images/logo-hiepsiit.png" OnClick="ImageButton1_Click" />
Phía server xử lý code trên trả về cho trình duyệt dạng HTML:
<input type="image" name="ImageButton1" id="ImageButton1" src="images/logo-hiepsiit.png" />
Bảng các thuộc tính thường dùng:
Thuộc tính | Ý nghĩa |
(ID) | Qui định tên của điều khiển. Tên của điều khiển là duy nhất. |
AccessKey | Qui định ký tự để di chuyển nhanh đến điều khiển - ký tự xử lý phím nóng. |
Attributes | Tập hợp các thuộc tính của điều khiển HTML |
BackColor | Qui định màu nền của điều khiển. |
BorderColor | Qui định màu đường viền của điều khiển. |
BorderStyle | Qui định kiểu đường viền của điều khiển. |
Text | Hiển thị chuỗi ra Lable |
CommandName | Tên lệnh. Được sử dụng trong sự kiện Command |
BorderWidth | Qui định độ rộng của đường viền. |
CssClass | Qui định hình thức hiển thị của điều khiển qua tên CSS. |
Enabled | Qui định điều khiển có được hiển thị hay không. Giá trị mặc định của thuộc tính này là True – được phép hiển thị. |
Font | Qui định Font hiển thị cho điều khiển |
ForeColor | Qui định màu chữ hiển thị trên điều khiển |
Height | Qui định chiều cao của điều khiển |
ToolTip | Dòng chữ sẽ hiển thị khi rê chuột vào điều khiển. |
Width | Qui định độ rộng của điều khiển. |
ImageUrl | Đường dẫn đến tập tin image |
ImageAlgin |
Vị trí hiển thị giữa hình và nội dung văn bản. |
Màn hình window thuộc tính của ImageButton:
Ví dụ: Tạo trang web ImageButton.aspx:
ImageButton.aspx
<%@ Page Language="C#" AutoEventWireup="true" CodeFile="ImageButton.aspx.cs" Inherits="ImageButton" %>
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title></title>
</head>
<body>
<form id="form1" runat="server">
<div>
Ví dụ sử dụng nút điều khiển ImageButton<br />
<br />
<asp:ImageButton ID="ImageButton1" runat="server" ImageUrl="~/images/logo-hiepsiit.png" OnClick="ImageButton1_Click" />
<br />
<br />
</div>
<asp:Label ID="lblNotice" runat="server"></asp:Label>
</form>
</body>
</html>
Code behind
ImageButton.aspx.cs
using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.UI;
using System.Web.UI.WebControls;
public partial class ImageButton : System.Web.UI.Page
{
protected void Page_Load(object sender, EventArgs e)
{
}
protected void ImageButton1_Click(object sender, ImageClickEventArgs e)
{
lblNotice.Text = "Chào mừng các bạn đến website hiepsiit.com";
}
}
Thực thi trang web cho kết quả:
Click vào image cho kết quả: