一.掌握控件的客户端属性及事件
(转载自 http://www.wrclub.net/study/listarticle.aspx?id=1155&page=2)
ASP.NET服务器端控件能够响应服务器端事件,使我们能够像编写Windows程序一样编写网页。可有时我们并不需要让客户端运行的控件和服务器发生交互,这样做的开销是很大的:不仅占用网络带宽、服务器的CPU资源,还会产生一次PostBack导致客户端浏览器“刷新”影响界面效果。
如果直接在Web窗体的HTML代码内为服务器端控件添加客户端事件代码,就像这样:
<asp:Button id=Button1 onClick=window.alert('按钮被按下了') Text=按钮1/>
你会发现,当按下这个按钮时,并没有预定的消息框弹出,而是直接执行服务器端代码内的响应按钮按下事件的Button1_Click方法(假设我们已经为按钮绑定了这个事件)。如果查看客户端页面的源代码,按钮的onClick事件里,根本没有自己写的代码,却变成了javascript:__doPostBack(...)。
其实这正是.NET Framework转换工作的一部分。有了这个javascript:__doPostBack(...),才能实现按钮提交、服务器端响应事件等一系列动作。(关于这段自动加上的脚本,我会在今后的文章里详细说明。)
想要控件在客户端就响应事件,必须另寻他法。好在.NET已经为我们提供了丰富的接口去实现这些功能。
所有的服务器端控件(Button、Label、TextBox……)都有一个属性Attributes——这是一个很重要的属性,它是服务器端控件在客户端对应HTML元素属性及事件的集合。有了它,我们能够自定义服务器端控件在客户端的行为、外观。
还是刚才的Button1,这次我们在Page_Load事件里加上这么一句(在IsPostBack判断之外):
Button1.Attributes.Add(onclick, window.alert('按钮被按下了'));
重新生成项目之后再次浏览页面,这次我们终于能够看到“按钮被按下”的消息框被正常弹出了。
回过头来解释这句代码:Attributes是Button1也是所有服务器端控件拥有的属性,Add(...)是Attributes所属的一个方法,作用是为控件在客户端的HTML标记内添加代码,第一个参数是属性的名称,第二个参数是属性的值。在这里我们为按钮的onclick事件添加了一段弹出消息框的代码。在客户端查看页面源代码,可以看到按钮的onclick事件里包含了这段代码(.NET Framework自动生成的__doPostBack(...)就跟在后面,我们使用Add就是告诉.NET Framework:“先加入我们的代码!”)。
Attributes还有另一种访问的形式(C#专用):
Button1.Attributes[onclick] = window.alert('按钮被按下了'); // []内是属性的名称,等号右边就是属性的值
这个方法同样可以用于使用服务器端代码为控件改变属性:
Button1.Attributes[style] = fontsize: 9pt; // 改变控件样式的字体为9磅
二. 给DataGrid添加确定删除的功能
(转载自 http://dev.csdn.net/develop/article/20/20892.shtm)
给DataGrid添加确定删除的功能
DataGrid的功能我想大家是知道的,我在实际的应用中遇到如下的问题,客户要求在删除之前做一次提示。类
似于windows。首先我们都知道DataGrid支持删除的功能,我们可以向DataGrid里面添加删除列就可以实现,
下面我想用模板列来实现带提示的删除按钮。我们用northwind的示例数据库作为例子数据库操纵Categories表。
DataGrid的Html页的内容如下:
<asp:DataGrid id=grdTest style=Z-INDEX: 101; LEFT: 205px; POSITION: absolute; TOP: 134px
runat=server>
<Columns>
<asp:TemplateColumn>
<ItemTemplate>
<asp:Button id=btnDelete
runat=server Text=Button CommandName=Delete></asp:Button>
</ItemTemplate>
</asp:TemplateColumn>
</Columns>
</asp:DataGrid>
我们只添加了一个模板列,其他的列都是在运行的时候自动生成的。
可以看出这个模板列很像删除列但是又不是删除列,我们给一个普通的Button添加了一个CommandName
=Delete的属性。这是用来响应DataGrid的ItemCommand事件的!在删除列里面就是这样的!
接下来就是后台代码了,代码如下所示:
private DataSet ds = new DataSet();
private void Page_Load(object sender, System.EventArgs e)
{
// 在此处放置用户代码以初始化页面
if(!this.IsPostBack){
string strConnection = ConfigurationSettings.AppSettings
[sa].ToString();
SqlConnection myConnection = new SqlConnection(strConnection);
SqlDataAdapter myAdapter = new SqlDataAdapter(SELECT
CategoryID,CategoryName, Description FROM Categories,myConnection);
myAdapter.Fill(ds);
this.grdTest.DataSource = ds.Tables[0].DefaultView;
this.grdTest.DataKeyField = CategoryID;
this.grdTest.DataBind();
}
}
接下来我们给模板列里面的每一个按钮都添加一个客户端的onclick事件。我想大家都应改知道Attributes属
性吧!可以通过他向客户端输出客户端控件的属性比如:长度、颜色等等。但是通常情况我们使用它添加客户
端事件。知道javascript的朋友肯定知道confirm了!它会弹出一个确认对话框如果确定才提交form否则就不
提交,所以使用这个也是很自然的了。
private void grdTest_ItemDataBound(object sender,
System.Web.UI.WebControls.DataGridItemEventArgs e) {
switch(e.Item.ItemType){
case ListItemType.Item:
case ListItemType.AlternatingItem:
case ListItemType.EditItem:{
Button btn = (Button)e.Item.FindControl(btnDelete);
btn.Attributes.Add(onclick, return confirm('你是否
确定删除这条记录'););
break;
}
}
}
添加好这个事件里以后我们还需要添加如下的代码才能完成我们的工作:
private void grdTest_ItemCommand(object source,
System.Web.UI.WebControls.DataGridCommandEventArgs e) {
if(e.CommandName == Delete){
this.DeleteRow(this.grdTest.DataKeys[e.Item.ItemIndex].ToString
());
}
}
上面的事件就是我们点击DataGrid里面的控件的时候激发的事件,我们可以通过CommandName筛选出来我们想
要激发的方法DeleteRow(),一下就是这个方法的代码:
private void DeleteRow(string i){
string strConnection = ConfigurationSettings.AppSettings[sa].ToString
();
SqlConnection myConnection = new SqlConnection(strConnection);
SqlCommand cmd = new SqlCommand(DELETE FROM Categories WHERE
(CategoryID = +i+),myConnection);
myConnection.Open();
cmd.ExecuteNonQuery();
myConnection.Close();
}
上面的函数接收一个参数,此参数是当前选中行的关键字。
三. 自定义Web服务器控件实现弹出消息框功能
(转载自 http://www.aspxboy.com/Files/71/66/276.Aspx)
思路如下:
继承System.Web.UI.WebControls.Button控件
增加一个属性“ConfirmMessage”来表示弹出确认框上面的提示信息。
在服务器控件呈现在页面之前把一段javascript写到页面
内容如下:
<script language=javascript>
<!--
function _doAspxBoyConfirm()
{
return confirm(你确认删除/保存吗??)
}
//-->
</script>
查一下msdn中对于Control.OnPreRender 方法的描述
可以得到“此方法通知服务器控件在保存视图状态和呈现内容之前,执行任何必要的预呈现步骤”.
所以我们只要在OnPreRender方法内 用Page.RegisterClientScriptBlock把这段javascript发送到客户端,并且给Button. Attributes属性内添加一个“onclick”的客户端属性对应值为: return _doAspxBoyConfirm()”.
详细情况可以查阅
ms-help://MS.VSCC.2003/MS.MSDNQTR.2003FEB.2052/cpref/html/frlrfsystemwebuiwebcontrolswebcontrolclassattributestopic.htm
这样一个具有ConFirm功能的Button就基本上建立起来了。
新建一个测试该控件的工程
在工具箱上点右键选择“添加/移除项”,点击浏览选择编译好的dll文件,点击确定,你会发现ConFirmButton已经添加到工具箱内了
将其托到一个Aspx页面内 在属性设置内给ConfirmMessage值为你要的弹出框内容比如“确定删除吗?”,按F5运行。
当点该按钮时会弹出一个confirm对话框询问“确定删除吗?”,如果点击确定则执行button的Button_Click事件,如果点击取消则不执行。
你可以查看他生成的html代码,以加深对该控件工作原理的理解
完整的代码如下:
using System;
using System.Web.UI;
using System.Web.UI.WebControls;
using System.ComponentModel;
using System.Text;
namespace AspxBoy.Com.ConfirmButton
{
/// <summary>
/// Button点击时会弹出一个对话框要求确认
/// </summary>
public class ConfirmButton : System.Web.UI.WebControls.Button
{
private string _confirmMessage;
/// <summary>
/// 当客户端点击此Button时弹出的提示消息筐的内容
/// </summary>
public string ConfirmMessage
{
get
{
return _confirmMessage;
}
set
{
_confirmMessage = value;
}
}
protected override void OnPreRender(System.EventArgs e)
{
StringBuilder sb = new StringBuilder();
sb.Append(<script language=/javascript/>);
sb.Append(System.Environment.NewLine);
sb.Append(<!--);
sb.Append(System.Environment.NewLine);
sb.Append(/*--------------------------------------------);
sb.Append(System.Environment.NewLine);
sb.Append(ControlName:/t/tAspxBoy.Com.ConfirmButton);
sb.Append(System.Environment.NewLine);
sb.Append(AuthorName:/t/t/tHuobazi,WuMeibo);
sb.Append(System.Environment.NewLine);
sb.Append(CopyRight:/t/t/twww.AspxBoy.Com);
sb.Append(System.Environment.NewLine);
sb.Append(---------------------------------------------*/);
sb.Append(System.Environment.NewLine);
sb.Append(function _doAspxBoyConfirm());
sb.Append(System.Environment.NewLine);
sb.Append({);
sb.Append(System.Environment.NewLine);
sb.Append(return confirm(/);
sb.Append(ConfirmMessage);
sb.Append(/));
sb.Append(System.Environment.NewLine);
sb.Append(});
sb.Append(System.Environment.NewLine);
sb.Append(//-->);
sb.Append(</script>);
Page.RegisterClientScriptBlock(_doAspxBoyConfirm,sb.ToString());
this.Attributes.Add(onclick,return _doAspxBoyConfirm());
base.OnPreRender(e);
}
public override void RenderBeginTag(HtmlTextWriter writer)
{
writer.WriteLine();
writer.Write(<!-------------------);
writer.Write(AspxBoy.Com.ConfirmButton Start);
writer.Write(/tAuthorName: /tHuobazi);
writer.WriteLine( --------------------->);
writer.Write(<!-------------------- );
writer.Write(Copyright:2004 Huobazi(www.AspxBoy.com));
writer.Write( ---------------------);
writer.WriteLine(>);
base.RenderBeginTag(writer);
}
public override void RenderEndTag(HtmlTextWriter writer)
{
base.RenderEndTag(writer);
writer.WriteLine();
writer.Write(<!------------------------------- );
writer.Write(AspxBoy.Com.ConfirmButton End);
writer.Write( --------------------------------);
writer.WriteLine(>);
writer.WriteLine();
}
}
}