首页 > 代码库 > 服务器控件

服务器控件

服务器控件就是在服务器端解析的控件,在ASP.NET中,就是有runat=server的控件,这些控件经处理后会生成客户端呈现代码发送到客户端,本质上说,服务端控件就是.NET框架中的类。

 

ASP.NET服务器控件控件可分为以下几类:

 

1.HTML服务器控件

它把标准客户端控件封装成类,这些类位于System.Web.UI.HtmlControls命名空间中

(如Htmltable,HtmlButton,HtmlHead等)。它们继承自HtmlControls,它们共有的基本属性有Attributes,Style,Disabled,TagName。事实上把任何标准客户端控件加上属性runat=server,就把这些客户端控件变成了HTML服务器控件,这时我们就可以在后置代码中处理这些控件了。注意这时成为了服务器控件了有"三个ID",同时许多服务器控件的操作都能实现(http://kendezhu.iteye.com/blog/718294)。Attributes属性是一个AttributeCollection类型的集合类,需要传递一个键/值对集合,Style属性是一个CssStyleCollection集合,也需要传递一个键/值对集合。如:

<input id="Button1" type="button" value="http://www.mamicode.com/button" runat="server"/>

后置代码:Button1.Attributes.Add("onclick","alter(‘给我增加了一个客户端事件‘)");

         Button1.Style.Add("background-color","green");

Html服务器控件中有许多容器控件,如Htmltable,Div,Span等,它们拥有的共同属性有InnerHtml(是返回或者设置容器控件开闭标签内的HTML文本)和InnerText(是返回或者设置容器控件开闭标签内的纯文本,HTML文本将被解析为纯文本)。

直接双击Html服务器控件,会在head里自动添加客户端事件,要想Html服务器控件触发服务端事件,要

<input type="button" id="button1" runat="server" value="http://www.mamicode.com/上传" onserverclick="buttonclick" />添加一个onserverclick事件,在后置代码里:

 protected void buttonclick(object sender,EventArgs e)    

 {

  }

有俩参数,第一个是触发事件的对象,通常是object类型,第二个是参数信息,大多数事件的参数类型是

EventArgs。

 
2.Web服务器控件
Web服务器控件位于System.Web.UI.WebControls命名空间中。所有Web服务器控件都是从WebControls派
生出来的。很多Web服务器控件所输出的客户端代码很复杂。Web服务器控件总是以asp:开头,它们有很多
共同的属性和方法。Label有一个叫AssociatedControlID的属性,用来通过控件ID将那个控件与Label关
联(那个控件是文本框,就会是文本框得到焦点,是按钮的话,就会触发按钮的单击事件等等)。
对于Form标签有一个DefaultButton属性,用于设置默认按钮,页面打开后,按回车就会触发该按钮事件。
Panel有滚动功能,当页面的控件太多时,可以将这些控件放到Panel中,然后设置控件的ScrollBars属性为
Auto,这样当控件的长或宽超过Panel的长或宽时就会出现滚动条。还可以设置样式Style="overflow: scroll;"
RadioButtonList和CheckBoxList有一些而外的控制输出布局的属性,RepeatLayout(是表结构(table)还
是非表结构)RepeatDirection(输出时是垂直还是水平)RepeatColumns(设置列数,前提是表结构)
CellPadding,CellSpacing,TextAlign(前提是表结构,配置列的空间和对齐方式)。
<asp:Panel ID="Panel1" runat="server" Height="100px" Width="300px" ScrollBars="Auto">
            <asp:CheckBoxList ID="CheckBoxList1" runat="server" RepeatColumns="2">
                <asp:ListItem>德国</asp:ListItem>
                <asp:ListItem>西班牙</asp:ListItem>
                <asp:ListItem>阿根廷</asp:ListItem>
            </asp:CheckBoxList>
            <asp:RadioButtonList ID="RadioButtonList1" runat="server" RepeatLayout="Table" 
                RepeatColumns="3" RepeatDirection="Horizontal">
                <asp:ListItem>巴西</asp:ListItem>
                <asp:ListItem>中国</asp:ListItem>
                <asp:ListItem>荷兰</asp:ListItem>
            </asp:RadioButtonList>
            <asp:BulletedList ID="BulletedList1" runat="server">
                <asp:ListItem>韩国</asp:ListItem>
                <asp:ListItem>阿富汗</asp:ListItem>
                <asp:ListItem>日本</asp:ListItem>
            </asp:BulletedList>
        </asp:Panel>
BulletedList列表控件的BulletStyle(显示类型)BulletImageUrl(左侧的图像)DisplayMode(文本,超链接或LinkButton,设为LinkButton后还可以设置按钮的单击事件)
如:protected void BulletedList1_Click(object sender,BulletedListEvenArgs e)
    {
       //BulleteListEventArgs参数包含了当前点击中的Item项
       string itemtext=BulletedList1.Items[e.Index].Text;
       Label1.Text="你选择的Item是"+itemtext;
    }

 

 

3.验证控件

在ASP时代,未防止用户随意地输入错误数据,通常要编写大量的javascript代码,在客户端提前预防错误。ASP.NET 3.5提供了5中验证控件,其中4个用于对指定类型的错误进行验证,还有一种可以提供自定义的验证。这些控件大多在客户端完成验证过程,也可以定义服务器的验证方式。验证控件位于System.Web.UI.Webcontrols命名空间中,它们都派生自BaseValidtor基类。他们所共有的成员有:

ControlToValidate(指定要验证的控件)Display(指定错误消息如何显示,Static或Dynamic)

EnableClientScript(是否允许客户端验证)ErrorMessage(显示在错误汇总ValidationSummary控件中的错误消息)Text(在验证控件旁边显示的错误文本)IsValid(判断相应的控件值是否有效)

SetFocusOnError(当验证失败时,是否将焦点位于出错的控件上)ValidationGroup(当页面存在多个验证控件时,指定分组,将避免验证冲突)

RequiredFieldValidator:必须输入验证。

RangeValidator:输入范围验证,主要属性Type等。

CompareValidator:比较验证,主要属性有:ControlToCompare(和那个控件的值比较),Type,

ValueToCompare(和某个固定值比较)。

RegularExpressionValidator:正则表达式验证,主要属性有ValidationExpression(正则表达式)。

CustomValidator:自定义验证,主要属性ClientValidationFunction(客户端验证,指定客户端函数名),

ServerValidate事件(服务端验证)。

CustomValidator控件客户端验证举例:

function kehuduan(ct1,args)

 {    获取要验证的值            args.IsValue用于返回验证结果是否符合

   if(args.Valuehttp://www.mamicode.com/=="刘德华"){args.IsValue=http://www.mamicode.com/true}else{args.IsValue==false}

 }

CustomValidator控件服务端端验证举例:(要声明ServerValidate事件,该事件在客户端验证完后,页面产生回发后执行,一般用于与业务逻辑相关的验证)

Protected void CustomValidator1_ServerValidate(object sender,ServerValidateEventArgs args)

{

try{args.IsValid=args.Valuehttp://www.mamicode.com/=="刘德华";}catch{args.IsValid=false;}

}

 

ValidationGroup属性是用来把验证控件与一些触发验证的控件(比如Button)分成一组的属性,比如页面上有三个TextBox和它们的验证控件及三个Button,如果不分组的话,单击任何一个Button都会触发所有的验证控件对自己所验证的TextBox进行验证。分组的话,就只是与该Button一组的验证控件对自己所验证的TextBox进行验证。Button有一个属性CausesValidation,设置其是否触发验证。

要访问页面上所有的验证控件,可以使用Page.Validators集合属性来遍历,如:

Protected void CheckBox1_CheckedChanged(object sender,EventArgs e)

{

  foreach(BaseValidator item in Page.Validators)

   {

      item.Enable=CheckBox1.Checked;

      item.EnableClientScript=CheckedBox2.Checked;  

   }

}

用两个CheckBox来设置这些验证控件是否允许验证和是否允许客户端脚本。

 

 

4. 高级Web服务器控件:

属于Web服务器控件的范畴,这些控件具有更高级的性能和特性,并且会生成大量

的HTML标记和JavaScript脚本来创建用户界面,比如Calendar控件,AadRotator及TreeView控件等。

 

Calendar日历控件主要有两方面的更能:显示和选择日期,在日历网格中显示约会或其他信息。

可以使用Calendar的智能标签为其选择一种外观,可以通过SelectionChanged事件来获取当前选择的日期:  

protected void Calender1_SelectionChanged(object sender,EventArgs e)

    {

      Label1.Text="当前日期为"+Calender1.SelectedDate.ToShortDateString();

    }

用SelectedDate属性可以获得选择的日期。

而SelectionMode属性枚举(Day:可以选单个日期,DayWeek:可选单个日期或整周,DayWeekMonth:可选单个

日期,整周或整月)如果选了后两种模式,就可以通过设置FirstDayOfWeek属性来设置一周的第一天是星期几。

用SelectedDates属性可以获得选的多个日期。

   Protected void Calendar_SelectionChanged(object sender,EventArgs e)

    {

      Label1.Text="当前选择的日期为:<br/>";

      foreach(DateTime dt in Calendar.SelectedDates)

       {

         Label1.Text=dt.ToShortDateString()+"<br/>";

       }

    }

其他样式属性:DayHeaderStyle(星期栏)DayStyle(日期)NextPreStyle(下一个月按钮)

OtherMonthDayStyle(其他月的日期)等。

Calendar有一个DayRender事件(当Calendar显示时触发),该事件提供了一个DayRenderEventArgs类型的

参数,通过该参数的Day属性可以获得Calendar里的日期,在该事件中我们可以设置一些限制:

    protected void Calendar1_DayRender(object sender,DayRenderEventArgs)

     {

       if(e.Day.IsWeekend)

        {

          e.Day.IsSelectable=false; (设置不可选)

        }

       if(e.Day.IsOtherMonth)

        {

          e.Cell.Text="-";  e.Cell代表一个日期框

        }

       if(e.Day.Date.Month==3&&e.Day.Date.day==8)  判断日期是否为3月8号

        {

          e.Cell.BackColor=System.Drawing.Color.Red;

          e.Cell.Text="三八妇女节";

        }

     }

 

 

MultiView控件可以让开发人员定义多个视图,在同一时刻只显示一个,如下代码:

 <asp:MultiView ID="MultiView1" runat="server" ActiveViewIndex="0">

    <asp:View ID="view1" runat="server"></asp:View>

    <asp:View ID="view2" runat="server"></asp:View>

    <asp:View ID="view3" runat="server"></asp:View>

    <asp:View ID="view4" runat="server"></asp:View>

 </asp:MultiView>

每个View就代表一个视图,可以在里面添加任何代码。ActiveViewIndex代表View的索引,就是页面加载时

要显示的视图。可以通过MultiView的CommandName来转换视图,这个CommandName就是Button的一个属性,

其值可以取PrevView(上一视图)NextView(下一视图)SwitchViewByID(View的ID,可以从Button的

CommandArgument获得View的ID)SwitchViewByIndex(可以从Button的CommandArgument获得View的索引)

虽然MultiView控件很方便,但不要放过多的控件,因为每次页面回发时,每个控件状态都持续化到视图状

态中,会给页面增加负担,因此建议使用分页方式设计。

 

 

Wizard控件与MultiView控件非常相似,同一时刻只能显示一个视图,WizardStep相当于View。前者比后者

提供了更多的定制功能,比如导航按钮和模板功能等。可以通过智能标签来选择样式及添加删除修改步骤

,这里面的主要属性有:Title(步骤名)AllowReturn(过了这一步可不可以返回)。当然是用Wizard控件不

仅仅是显示用的,更重要的是要完成一些与客户的交互(比如注册等)。这就需要配合一些事件来完成这些

更能:ActiveStepChanged(当ActiveStepIndex改变时发生)CancelButtonClick(按下取消按钮时发生)

FinishButtonClick(按下完成按钮时发生)NextButtonClick与PrevousButtonClick(按下向下或向上按钮

时发生)SiderBarButtonClick(在侧边栏处单击时发生)。

 protected void Wizard1_NextButtonClick(object sender, WizardNavigationEventArgs e)

        {

            if (Wizard1.ActiveStepIndex==0)

            {

                ViewState["0"] = TextBox1.Text;

            }

            if (Wizard1.ActiveStepIndex==1)

            {

                ViewState["1"] = TextBox2.Text;

            }

        }

 protected void Wizard1_FinishButtonClick(object sender, WizardNavigationEventArgs e)

      {

            Label7.Text = ViewState["0"].ToString() + ViewState["1"].ToString() + ViewState["2"].ToString() + ViewState["3"].ToString();

      }

  protected void Wizard1_CancelButtonClick(object sender, EventArgs e)

        {

             ViewState["0"]=null;

              ViewState["1"]=null;

               ViewState["2"]=null;

               ViewState["3"] = null;

               Wizard1.MoveTo(this.WizardStep1);

        }

服务器控件