打开APP
userphoto
未登录

开通VIP,畅享免费电子书等14项超值服

开通VIP
ASP.NET自定义控件从入门到精通
userphoto

2011.04.28

关注

我学习技术讲究以实践为主、理论为辅的方式学习,以成果来激励学习的积极性。这也是 我教书的一贯策略。所以在本系列所有的章节中,我都会以示例的方式来展示自定义控件开 发的细节,请各位博友点评并指正。

闲话少提,转入正题。本节中,我们要完成一个如图1.1所示的用户注册控件的开发:

 

图1.1 设计器效果图

这个注册页面的HTML代码如下所示:

<!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><title>
     无标题页
</title>
<style type="text/css">
table
{
border:solid 1px blue;
width:auto;
height:auto;
font-family:黑体;
font-size:9pt;
text-align:center;
}
div
{
text-align:center;
}
</style>
</head>
<body>
<form name="form1" method="post" action="Default.aspx" id="form1">
<div>
<input type="hidden" name="__VIEWSTATE" id="__VIEWSTATE" value="/wEPDwUKMTI1MTk2NDQzM2RkeKVXxlbRlC6kwkW0xZb24MJiHos=" />
</div>
<div>
<table>
<caption>用户注册</caption>
<tbody>
<tr>
<td>用户名:</td>
<td>
<input name="txtUserName" type="text" id="txtUserName" />
</td>
</tr>
<tr>
<td>密  码:</td>
<td>
<input name="txtPassword" type="password" id="txtPassword" />
</td>
</tr>
<tr>
<td>确认密码:</td>
<td>
<input name="txtSecPassword" type="password" id="txtSecPassword" />
</td>
</tr>
<tr>
<td colspan="2">
<input type="submit" name="btnRegister" value="注册" id="btnRegister" />
      
<input type="reset" id="btnReset" value="重置" />
</td>
</tr>
</tbody>
</table>
</div>

<div>

<input type="hidden" name="__EVENTVALIDATION" id="__EVENTVALIDATION" value="/wEWBQKhrtqbCQKl1bKzCQK1qbSRCwLcl5zHDgKGxZ2yDwScGUd5EoBIuuHJkqOSRr5qNbjG" />
</div></form>
</body>
</html>
.1 为Register自定义控件添加设计器属性

在编写自定义控件时,需要为页面开发人员提供设计器属性,便于他们设定控件的样式、 外观。并且在提供设计器属性时,需要为这些设计器属性提供便于阅读的说明。使用设计器 属性注释自定义控件的属性,可以提供该项功能。

2.11 提供属性、层次属性

当页面开发人员使用我们提供的Register控件时,希望可以设定用户名文本框、密码文本 框的样式、注册、重置按钮的样式。我们在开发Register控件时,需要提供如下的属性要具 有以下特征:

属性的键值对集合。

属性包含属性说明,并能显示在Visual Studio中。

提供各种属性的默认值。

属性分组,便于开发人员进行属性分组。

在RegisterControl类中添加以下代码:

private string _userPwd;

[Browsable(true)]
[Description("读写属性,获取或设定用户名密码框中的值")]
[Category("杂项")]
public virtual string UserPwd
{
get { return _userPwd; }
set { _userPwd = value; }
}

private string _userName;

[Browsable(true)]
[Description("读写属性,获取或设定用户名文本框中的值")]
[DefaultValue("请输入用户名")]
[Category("杂项")]
public virtual string UserName
{
get { return this._userName; }
set { this._userName = value; }
}

以上代码实现了以下的功能(以UserName属性为例):

在UserName属性上修饰Browsable特性,即设定该属性是否设计器可见。

在UserName属性上修饰Description特性,即设定该属性在设计器中的注释文本。

在UserName属性上修饰DefaultValue特性,及设定该属性的默认值。

在UserName属性上修饰Category特性,及设定该属性的分组。
 状态管理和Style类

3.1 状态管理

在上一节中,我们成功的开发了一个具有设计器属性的注册控件。现在我们来学习对我们 的注册控件进行状态管理。

首先我们回顾一下ASP.NET的页面的生命周期,如图3.1.1所示:

图3.1.1 ASP.NET 页面的生命周期

这里我们发现,任何页面只要发生了回传就一定会被服务器销毁(除了像Ajax一样的异步 回传)。那么就出现了一个问题,我们的自定义控件上所有的属性都会被销毁,而服务器端 将无法获取自定义控件的值。

所有的Web页面都是无法保持状态的,我们需要使用ViewState来保持页面的状态。 ViewState是属于当前页面的,不会混淆。修改RegisterControl中的代码,代码如下所示:

namespace RegisterControl

{

[DefaultProperty("UserName")]

[ToolboxData("<{0}:RegisterControl runat='server' UserName='请输入用户名' />")]

public class RegisterControl : WebControl

{

[Browsable(true)]

[Description("读写属性,获取或设定用户名密码框中的值")]

[Category("杂项")]

public virtual string UserPwd

{

get { return this.ViewState["UserPwd"].ToString(); }

set { this.ViewState["UserPwd"] = value; }

}

[Browsable(true)]

[Description("读写属性,获取或设定用户名文本框中的值")]

[DefaultValue("请输入用户名")]

[Category("杂项")]

public virtual string UserName

{

get { return this.ViewState["UserName"]; }

set { this.ViewState["UserName"] = value; }

}

protected override void Render(HtmlTextWriter writer)

{

writer.Write(string.Format(@" <table> <caption>用户注册 </caption> <tbody> <tr> <td>用户名:</td> <td> <input name='txtUserName' type='text' id='txtUserName' value='{0}' onfocus='this.select()' /> </td> </tr> <tr> <td>密   码:</td> <td> <input name='txtPassword' type='password' id='txtPassword' value='{1}' /> </td> </tr> <tr> <td>确认密码:</td> <td> <input name='txtSecPassword' type='password' id='txtSecPassword' /> </td> </tr> <tr> <td colspan='2'> <input type='submit' name='btnRegister' value='注册' id='btnRegister' />        <input type='reset' id='btnReset' value='重置' /> </td> </tr> </tbody> </table> ",this.UserName,this.UserPwd));

}

}

}

注意:在ViewState中存储值,需要注意以下一些方面:

1.ViewState中存储的对象必须可以被直接序列化。而且特别需要注意的是,ViewState可 针对特定类型转换进行优化,基础数据类型都会被优化。如果存储自定义类型的对象,最好 重写GetHash()、ToString()等方法,并且自定义类型转换器。

2.存储在ViewState中的信息必须简短,减轻页面压力。
 
本站仅提供存储服务,所有内容均由用户发布,如发现有害或侵权内容,请点击举报
打开APP,阅读全文并永久保存 查看更多类似文章
猜你喜欢
类似文章
asp.net登录代码实例
利用js和ajax及时检验用户注册填写信息是否正确
HTML_表单提交的细节(submit提交按钮的使用细节)
自定义控件
HTML以及CSS
php简单的cookie登录
更多类似文章 >>
生活服务
热点新闻
分享 收藏 导长图 关注 下载文章
绑定账号成功
后续可登录账号畅享VIP特权!
如果VIP功能使用有故障,
可点击这里联系客服!

联系客服