[ASP.NET开发系列]在用户控件中添加属性

WEB开发中经常有一些代码是在很多地方重复出现的,象导航栏、用户登录/注册和首页上面的一些固定栏目等。这些可重用的代码我们可以把它写成一个通用模块供需要的地方来引用,这样做即节省了开发时间还方便以后的维护。

asp.netweb编程中提供了一种叫做“用户控件”可以帮助我们完成这种做法,其文件扩展名是“.ascx”,由于ascx文件是用来插入ASPX页面中使用的,而一个ASPX窗体只能包含一个<form>标志,所以ascx用户控件不能包含<form></form>标志。

下面使用一个经典入门范例来创建一个简单的用户控件,文件名为Hello.ascx:

<html>

<body>

 <h1>经典入门范例</h1>

 <hr>

 <h3>Hello Word</h3>

</body>

</html>

把这段代码保存为Hello.ascx文件,然后在ASPX页面上调用,具体调用如下:

Hello.aspx

<%@Register TagPrefix=”wen” TagName=”Hello” src=”Hello.ascx”%>

<html>

<body>

  <form id=frm runat=server>

   <wen:Hello ID=MyHello runat=server>

  </form>

</body>

</html>

 IE浏览器的地址里输入 http://localhost/Hello.aspx运行,将在页面上打印出字符串“Hello word”。

代码说明:1指令@Register定义了用户控件文件的标签名“Hello”和标签前缀名”wen

         2src属性是连接到用户控件的相关的文件名;

         3<wen:Hello ID=MyHello runat=server>这一句是在ASPX窗体中调用用户控件Hello.ascx的语句。

以上的演示代码没有给控件添加属性,下面我们举一个用户登录的文件,把它写成用户控件,在向其中添加UserNamePassWord这两个属性。向用户控件添加属性很简单,只要在ascx文件中的<script></script>块中定义就行了。

UserLogin.ascx

<html>

<title>用户登录</title>

<body>

  <table>

    <tr>

      <td>用户名:</td>

      <td><asp:TextBox ID=”txt1” runat=”server”></td>

    </tr>

<tr>

  <td>  码:</td>

  <td><asp:TextBox ID=”txt2” TextMode=”password” runat=”server”></td>

</tr>

<hr>

<tr>

  <td></td>

  <td><asp:LinkButton Text=”登陆” runat=”server”></td>

</tr>

</table>

</body>

</html>

<script language=”C#” runat=”server”>

 public string UserName{

   get{return txt1.Text;}

   set{txt1.Text=value;}

}

 public string PassWord{

   get{return txt2.Text;}

   set{txt2.Text=value;}

}

</script>

至此,我们已经给UserLogin.ascx文件添加了UserNamePassWord这两个属性了,以下DEMO演示如何在ASPX页面上引用这两个属性。

UserLogin.aspx

<%@Register TagPrefix=”wen” TagName=”UserLoginContorl” src=” UserLogin.ascx” %>

<html>

<title>引用属性</title>

<body>

  <form runat=”server”>

    <wen: UserLogin.ascx  ID=”MyLogin” runat=”server”>

  </form>

  用户名:<asp:Label ID=”Lab1”  runat=”server”/><br>

    码:<asp:Label ID=”Lab2”  runat=”server”/><br>

</body>

</html>

<script language=”C#” runat=”server”>

void Page_Load(Object sender,EventArgs e){

  if(IsPostBack){

    Lab1.Text=MyLogin.UserName;

    Lab2.Text=MyLogin.PassWord;

}

}

</script>

发布了159 篇原创文章 · 获赞 3 · 访问量 19万+
發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章