ASP.NET学习系列(六)开始控件之旅之Button及其Ajax扩展控件

      按钮控件把表单提交给服务器,是服务器端能够开始处理请求。按钮有三种类型:Button,LinkButton,ImageButton。Button是标准按钮,LinkButton为用户提供一个超链接,但是它又执行一个回发操作。ImageButton则是用图片替代Button的外观,其功能和Button完全一样。

     三种按钮的一些共同属性:
AccessKey:指定一个导向Button控件的键。
CommandArgument:传给Command事件的命令参数。
CommandName:指定传给Command的命令名。
OnClientClick:点击按钮时执行的客户端脚本。
PostBackUrl:用于设置将表单传给指定页面。
TabIndex:设置控件的Tab顺序。
UseSubmitBehavior:使用JavaScript回传表单。
Command:点击Button控件时引发。

   ImageButton自己的属性:
AlternateText:当图片无法显示时的替代文本。
ImageAlign:指定图片和页面中其他HTML中元素的对齐方式。
ImageUrl:用于指定图片的地址。

三种控件的一个简单实例:

 

代码
<%@ Page Language="C#" AutoEventWireup="true" CodeFile="ThreeButton.aspx.cs" Inherits="Button_ThreeButton" %>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    
<title></title>
    
<script runat="server">
        protected 
void LinkButton1_Click(object sender, EventArgs e)
        {
            Response.Redirect(
"http://www.cnblogs.com");
        }
    
</script>
</head>
<body>
    
<form id="form1" defaultbutton="ImageButton1" runat="server">
    
<div>
        
<asp:Button ID="Button1" runat="server" Text="Button"
         OnClientClick
=" return confirm('Thank you!');" />
         
<br />
        
<asp:LinkButton ID="LinkButton1" ToolTip="link to a page."
          runat
="server" onclick="LinkButton1_Click">博客园</asp:LinkButton>
          
<br />
        
<asp:TextBox ID="searchText" Width="100" runat="server"></asp:TextBox>
        
<asp:ImageButton ID="ImageButton1" ImageUrl="~/Image/imageButton.png" 
         PostBackUrl
="~/Button/ButtonSearchResult.aspx" ToolTip="Search"
        Width
="30" Height="30" runat="server" />
        
    
</div>
    
</form>
</body>
</html>

 

其中ImageButton中定义了PostBackUrl,是为了演示表单发送到别的网页,因此,又定义了一个网页,用以演示此功能。

 

代码
<%@ Page Language="C#" AutoEventWireup="true" CodeFile="ButtonSearchResult.aspx.cs" Inherits="Button_ButtonSearchResult" %>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    
<title>Search Result</title>
    
</head>
<body>
    
<form id="form1" runat="server">
    
<div>
        
<asp:Label ID="Label1" runat="server" Text="Result"></asp:Label>
    
</div>
    
</form>
</body>
</html>

后台代码:

 

代码
using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.UI;
using System.Web.UI.WebControls;

public partial class Button_ButtonSearchResult : System.Web.UI.Page
{
    
protected void Page_Load(object sender, EventArgs e)
    {
        
if (PreviousPage != null)
        {
            TextBox txtSearch 
= (TextBox)PreviousPage.FindControl("searchText");
            
if (txtSearch != null)
                Label1.Text 
= "The Result is :" + txtSearch.Text;
        }
    }
}

 

      在这个示例中,第二个网页得到了第一个页面的整个表单,通过PreviousPage来得到前一个页面的引用,因此可以通过查找指定ID的控件,获得其属性值,进行工作。当然,也可以通过设置页面属性,通过页面属性来暴露表单的中的控件。例如,可以在表单中定义一个SearchString来完成值的传递。第一种方法提供从前一个页面获取弱类型的方法,第二种则提供了一个强类型方法。(强类型:Typed,类型是确定的。弱类型:untyped,没有为实例指定详细的类型,这样就不能直接引用详细类型特有的属性、方法和事件。)

     在上面示例的第一个页面中,还为表单指定了一个DefaultButton按钮,它用来指定表单的默认按钮,这样就可以通过回车键来直接调用这个按钮。

 

处理Command事件

 

      三种Button控件都支持Click事件和Command事件。不同之处在于Command可以获取一个命令名和一个命令参数。

简单示例:

 

代码
<%@ Page Language="C#" AutoEventWireup="true" CodeFile="ButtonCommand.aspx.cs" Inherits="Button_ButtonCommand" %>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    
<title>Button Command Demo</title>
</head>
<body>
    
<form id="form1" runat="server">
    
<div>
        
<asp:Button ID="btnAsc"
         CommandName
="Sort" CommandArgument="ASC"
         OnCommand
="Sort_Command"
         runat
="server" Text="升序" />
        
<asp:Button ID="btnDesc"
         CommandName
="Sort" CommandArgument="DESC"
         OnCommand
="Sort_Command"
         runat
="server" Text="降序" />
        
<br />
        
<asp:BulletedList ID="colorList" runat="server">
        
</asp:BulletedList>
    
</div>
    
</form>
</body>
</html>

 

 后台代码:

 

代码
using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.UI;
using System.Web.UI.WebControls;

public partial class Button_ButtonCommand : System.Web.UI.Page
{
    
private List<string> Colors = new List<string>();
    
protected void Page_Load(object sender, EventArgs e)
    {
        Colors.Add(
"Red");
        Colors.Add(
"Blue");
        Colors.Add(
"Gray");
        Colors.Add(
"Green");
    }
    
protected void Sort_Command(object sender, CommandEventArgs e)
    {
        
if (e.CommandName == "Sort")
        {
            
switch (e.CommandArgument.ToString())
            {
                
case "ASC":
                    Colors.Sort(SortASC);
                    
break;
                
case "DESC":
                    Colors.Sort(SortDESC);
                    
break;
                
default:
                    
break;
            }
        }
    }
    
int SortASC(string x, string y)
    {
        
return String.Compare(x, y);
    }

    
int SortDESC(string x, string y)
    {
        
return String.Compare(x, y) * -1;
    }
    
void Page_PreRender()
    {
        colorList.DataSource 
= Colors;
        colorList.DataBind();
    }
}

 

 

     因为Button的功能比较简单、单一,所以Ajax控件对它的扩展很少,主要的就是一个ConfirmButtonExtender,它在按钮被点击后和表单回发前起作用。它会给用户弹出一个确认回发的警告框,或者也可以把任何应该通过点击确定才能执行的操作绑定到Button_Click事件上。如果用户点击取消按钮,怎不会回发。功能有点类似于在OnClientClick上绑定 return confirm操作。

 

posted on 2010-03-11 13:41  缠中说禅  阅读(695)  评论(0编辑  收藏  举报