我是一个菜鸟,我只是在努力,2021正视自己,面对2021!

ASP.NET 高级编程基础第十二篇—服务器控件

前言:从这篇博客我们开始学习asp.net的服务器控件,虽然现在的IT界对asp.net的控件有好多种态度,但是任何一件事物或者事情只要发生都是有其发生的必然性,我们不能否定这种控件,只是看这种控件使用在那种情况下,下面我们就详细的说明一下这些控件的使用以及它们的原理。

  1. ASP.NET服务端基本控件介绍

(1) ASP.NET服务端控件是ASP.NET对HTML的封装,在C#代码中就可以用txt.Text=’韩迎龙’这种方式来修改input的值,ASP.NET会将服务端控件渲染成HTML代码输出给浏览器,服务端控件是ASP.NET非常吸引初学者,非常容易上手的东西,也是最被人诟病的东西,物尽其用,服务端控件在内网系统,互联网系统的后台部分等访问频率不高的地方用还是很合适的。

(2) 所有的ASP.NET大部分是从Control,WebControl类继承的,几乎所有的成员有:

 1) clientID,控件在客户端的ID,控件在服务端的ID不一定等于客户端HTML中的ID,比如:在ListView等控件的模版中,因此如果要在客户端通过JavaScript,Dom,Jquery的getElementById,$(“#Id”)来操作控件的话最好不要直接写服务端的ID,而是$(‘#<%=txt.ClinetID%>’)。用Jquery事件设置鼠标移到控件上和从控件移开的不同样式,在用户控件中就可以看到ClientID和ID的不同。

  1) 拖放一个TextBox控件,鼠标放到控件变红,离开恢复原状

 1     <script type="text/javascript">
 2 
 3         function Myonload() {
 4 
 5             document.getElementById('<%=txtRed.ClientID %>').onmouseover = function () {
 6 
 7                 this.style.background = 'Red';
 8 
 9             }
10 
11             document.getElementById('<%=txtRed.ClientID %>').onmouseout = function () {
12 
13                 this.style.background = '';
14 
15             }
16 
17         }
18 
19 </script>
20 
21 <body onload="Myonload()">
22 
23 <asp:TextBox  ID="txtRed" runat="server"></asp:TextBox>

  2) 新建一个MyUserCtrl.ascx用户控件,拖放一个TextBox和Button控件,另一个写监听事件:

<script type="text/javascript">

document.getElementById('<%=btnOK.ClientID %>').OnClick = function ()

{

        document.getElementById('<%=txtShow.ClientID %>').value = "Hello,Kencery";

    }

</script>

<asp:TextBox ID="txtShow" runat="server"></asp:TextBox>

<asp:Button ID="btnOK" runat="server" Text="Button" />

 

注:将用户控件拖放到.aspx项目中进行验证

 2) Visible属性,控件的是否可见,如果Visible=False是不会渲染到HTML中的,这和在HTML中给元素style.display=’none’效果是不一样的。

 3) CssClass属性,控件的样式名,就是HTML中控件的class属性。

注释:新建一个WebForm的项目,写入如下代码:

    <style type="text/css">

        .waring

        {

            color:Red;

        }

    </style>

<asp:TextBox runat="server" ID="txtColor" CssClass="waring"></asp:TextBox>

 

注:拖放一个TextBox控件,设置CssClass属性为”waring”,也可以单独修改BackColor,BorderStyle等属性,但是不建议这么做,因为会生成很多的内联样式,生成Html(尺寸大,不便于统一的修改)。

 4) Attributes,用来设置控件的额外属性,和Dom中的SetAttribute,getAttribute是一样的。

注:在Default.aspx的Pege_Load中写入如下代码:

        btnCancel.Attributes["a1"] = "3.jpg";

        btnCancel.Attributes["onmouserover"] = "alert('Kencery')";

  1. ASP.NET服务端基本控件

(1) Label控件,Text属性为显示文本,AssociatedControlID属性用来关联一个控件,如果为空的话会展示为一个span,如果指定为一个控件的ID,则会展示为一个HTML中的<Label>并且将for属性设置为被关联控件的ClientID。

 注:拖放一个Label控件和TextBox控件,将Label控件的AssociatedControllID设置为关联TextBox。

(2) Literal控件也是展示一段文本,但是Literal控件不会渲染任何额外的标签,就是将Text属性展示出来即可。

(3) TextBox控件,文本框控件,TextMode属性取值Singleline,Multiple,Password吗,分别渲染为<input type=”Text”>,Textarea和<input type=”Password”>。当AutoPostBack属性为true的时候,用户焦点离开TextBox就会造成页面Post,实现原理就是讲ASP.NET原理时的AutoPostBack,TextChanged事件,文本框发生变化的时候事件触发ASP.NET中要提交表单的时候最好调用_doPostBack方法。

(4) RadioButton控件,渲染为<input type=”radio”>,通过GroupName属性进行分组。

(5) Button控件,OnClientClick属性,当用户点击按钮的时候在浏览器端执行的代码,注意:OnClientClick是字符串属性,写的代码是JavaScript代码,运行在浏览器端。

<asp:Button ID="btnDelete" runat="server" Text="删除" OnClientClick="return confirm('您真的要删除吗?删除不能恢复')" />

(6) LinkButton,用法和Button差不多,区别就是Button控件渲染为按钮,而LinkButton控件渲染为超链接,不要用LinkButton来实现普通的超链接,因为LinkButton的href为一段JavaScript代码,进行的是表单的post,无法”在新窗口中打开超链接”。和前面所说的”行删除”的那个例子中的Href为JavaScript的超链接原理一样。

(7) ImageButton控件也和Button控件差不多,只不过是显示为图片,渲染为<input type=”image”>。

(8) Button,LinkButton和ImageButton等控件都有CommandName,CommandArgument两个属性和Command事件,可以让多个按钮控件共享一个Command事件处理函数,通过读取事件对象e的CommandName,CommandArgument两个属性读取被点击按钮上设置的这两个参数来执行不同的操作,例子:编辑删除多行数据,这种用法在ListView控件中用的最多。

注:新建一个表删除.aspx页面

 1     <div>
 2 
 3         <table>
 4 
 5             <tr>
 6 
 7                 <td>Kencery</td><td>23</td><td><asp:Button ID="btnDelete" runat="server"
 8 
 9                     Text="删除" CommandName="Remove" CommandArgument="Kencery"
10 
11                     oncommand="RemoveCommmand" /><asp:Button ID="btnEdit" runat="server"
12 
13                     Text="编辑" oncommand="RemoveCommmand" CommandArgument="Kencery" CommandName="Edit" /></td>
14 
15             </tr>
16 
17              </table>
18 
19         <asp:Label ID="lblShow" runat="server"></asp:Label>
20 
21     </div>

 

在aspx.cs页面中写入如下代码:

 1     protected void RemoveCommmand(object sender, CommandEventArgs e)
 2 
 3     {
 4 
 5         if (e.CommandName == "Remove")
 6 
 7         {
 8 
 9             string name = Convert.ToString(e.CommandArgument);
10 
11             lblShow.Text = name + "被删除了";
12 
13         }
14 
15         else if (e.CommandName == "Edit")
16 
17         {
18 
19             string name = Convert.ToString(e.CommandArgument);
20 
21             lblShow.Text = name + "被编辑了";
22 
23         }
24 
25     }

(9) Panel控件用来盛放一些控件,如果设定GroupingText属性,那么就渲染为<fieldset>标签,也就是GroupBox效果,否则渲染为Div。

注:拖放Panel控件设置GroupBox属性的值为高级设置

(10) HyperLink控件,超链接。和LinkButton不一样,不会向服务器端post,就是一个超链接。NavigateURL:连接地址,Text:显示文本。如果设定ImageUrl属性则会显示图片超链接。

(11) FileUpload控件,文件上传控件,渲染成<input type=”file” />。属性FileContent以流的形式获得上传的文件,FileName上传文件名,HasFile Bool值,表示用户是否选择的文件,SaveAs方法用于将文件保存到磁盘的指定位置,漏洞:文件上传漏洞(上传aspx)。只允许上传指定类型文件,上传文件夹不给执行权限。

注:拖放一个FileUpload和Button控件,将Button控件改为上传。双击Button

 1     protected void btnUpLoading_Click(object sender, EventArgs e)
 2 
 3     {
 4 
 5         if (flUploading.HasFile) //用户是否选择了文件
 6 
 7         {
 8 
 9             //Server.MapPath, VirtualPathUtility.ToAbsolute都可以
10 
11             string uploadPath = Server.MapPath("~/upload");
12 
13             //flUploading.FileName上传文件的哦文件名
14 
15             flUploading.SaveAs(uploadPath + flUploading.FileName);
16 
17         }
18 
19     }


 

posted @ 2012-08-23 13:00  Kencery  阅读(2103)  评论(3编辑  收藏  举报
友情链接:初心商城