zoukankan      html  css  js  c++  java
  • asp.net 2.0教程 其它服务器控件

    尊重作者,请保留 www.it55.com 链接字样。

    今天内容比较多一点,我们需要学习asp.net 2.0 其余六个服务器控件,所以马上开始,呵呵。

    1、BulletedList控件
    作用:用于展示小规模的列表显示,以ul li的方式或者ol li的方式输出;列表项可以以文字、链接、LinkButton的形式出现。
    创建方法:
    新建web窗体文档并且换至设计界面,将左侧工具栏“标准”选项栏中的BulletedList控件拖放至页面中。
    通过“编辑项”进行列表项的添加:

     

    运行效果如下:

    各列表项左侧以实心圆点作为行头符,而这个行头符可以通过更改BulletedList的BulletStyle属性来更换其它样式。


    需要特别声明的是,如果你的BulletedList控件的列表项是由手工添加 + 后台动态绑定的话,那么你必须将其AppendDataBoundItems属性设置为true.

    2、HiddenField控件
    作用:将隐藏的数据保存在Value属性中,类似于HTML中的<input type="hidden"/>,只不过该控件运行于服务器端;适于安全要求比较低的参数传递。
    创建方法:将左侧工具栏“标准”选项栏中的HiddenField控件拖放至页面中,并通过其属性页为其赋值,当然也可以通过客户端脚本进行赋值。在后台程序中可以获取和设置该值并进行相应判断处理。

    3、FileUpload控件
    作用:上传文件
    创建方法:将左侧工具栏“标准”选项栏中的FileUpload控件拖放至页面中,效果如下图:

    我们需要在添加一个按钮来实现上传事件的提交,并将按钮Text属性修改为“上传”,结果如下图:

    双击上传按钮,进入页面后台cs文件中,将按钮的Click事件处理函数改为如下:

      protected void Button1_Click(object sender, EventArgs e)//Button1为按钮“上传”的ID属性值
      {
      string path = Server.MapPath("./");//获取当前目录在服务器上的绝对地址,作为图片保存地址。
      if (FileUpload1.HasFile)//判断本地需要上传的文件是否已经选取
      {
      string fileExt = System.IO.Path.GetExtension(FileUpload1.FileName).ToLower();//获取上传文件的扩展名并转换为小写,为下面的上传类型合法性判断作准备
      if (fileExt == ".gif" || fileExt == ".jpg")//只允许上传.gif和.jpg格式文件
      {
      //开始执行上传操作
      try
      {
      FileUpload1.SaveAs(path + FileUpload1.FileName);//服务器端保存该文件
      Response.Write("文件上传成功!");
      }
      catch (Exception ex)
      {
      Response.Write("文件上传过程中发生错误,错误信息:" + ex.Message);
      }
      }
      else
      {
      Response.Write("程序只支持上传.gif或.jpg格式的文件!");
      }
      }
      else//如果没有选择本地文件
      Response.Write("请先选择文件!");
      }

    至此,一个简单的文件上传功能已经完成了。需要提醒的是:
    FileUpload控件有一个PostedFile属性,利用该属性可以获取与上传文件相关的HttpPostedFile对象,使用该对象可以获取以上传文件的路径、大小、文件类型等属性,如:
    在上例中可以通过FileUpload1.PostedFile.ContentLength来获取该上传文件的大小。

    4、ImageMap控件
    作用:制作图片导航。利用在图片上的一个或多个区域创建热区及链接的方式,制作导航。
    创建方法:将左侧工具栏“标准”选项栏中的ImageMap控件拖放至页面中,并通过修改其ImageUrl属性为它添加图片(该图片必须事先通过“添加现有项”,将其加入网站项目中):

    然后通过HotSpots属性为其创建一个或多个热区:

     
     

    至于热区坐标的定位,可算是vs的一大疏漏,我们必须用图片处理工具获得图片预定热区在图片中的坐标和大小,然后才能在vs中很顺利的创建热区。这一点,可比dw差远了。
    需要说明的是:后台程序可以根据ImageMap控件的Click事件和PostBackValue属性来获取用户点击的位置。

    5、MultiView和View控件
    作用:可以实现类似于Windows选项卡的功能。MultiView其实是存放一个或多个View控件的控件容器。
    创建方法:
    我们来做一个简单的2个View控件的MultiView。
    我们先添加2个按钮来触发两个View控件的切换,分别将其Text属性修改为“选项卡1”,“选项卡2”,然后回车换行。将左侧工具栏“标准”选项栏中的MultiView控件拖放至页面中,效果如下图:#p#分页标题#e#

    然后将左侧工具栏“标准”选项栏中的View控件拖放至页面MultiView控件中,一共放置2个View控件(拖放两次),然后分别在两个View控件中输入各自的内容,结果图:

    鼠标单击选择MultiView控件,将其ActiveViewIndex属性的值更改为0,即:默认第一个View控件被选中激活。(如果是1,则第二个View控件被选中激活)

    接着我们来做View控件切换的触发事件。双击按钮“选项卡1”进入后台cs文件中,将其Click函数更改如下:

      protected void Button1_Click(object sender, EventArgs e)//Button1为按钮“选项卡1”的ID属性值
      {
      MultiView1.ActiveViewIndex = 0;//ActiveViewIndex属性:用于获取或设置当前被激活显示的View控件的索引值
      }

    双击按钮“选项卡2”进入后台cs文件中,将其Click函数更改如下:

      protected void Button2_Click(object sender, EventArgs e)//Button2为按钮“选项卡2”的ID属性值
      {
      MultiView1.ActiveViewIndex = 1;
      }

    运行后,当我们点击“选项卡1”按钮时,页面显示View1控件的内容;点击“选项卡2”按钮时,页面显示View2控件的内容。
    如果我们对内容进行修改,再用css进行一番修饰,就完全可以实现Windows “我的电脑” 属性选项卡的功能了:

    6、Wizard控件
    作用:实现操作向导的功能。比如“安装向导”、“注册向导”、“分步调查”等。
    创建方法:将左侧工具栏“标准”选项栏中的Wizard控件拖放至页面中,在Wizard任务中,点击“添加移除WizardSteps”:

    在WizardStep集合编辑器中依次添加WizardStep、修改Title属性值、ID属性值,当WizardStep数量满足你的要求后,点击右下方“确定”按钮。
    在设计视图中点击第一步(本例为“用户名”),然后鼠标点击Wizard控件的右半部分,对第一步的内容进行编辑:

    然后编辑第二步:

    ...

    在最后一步中,Wizard将出现“完成”按钮,双击完成按钮进入后台cs文件,对用户注册信息进行处理(比如说写进数据库)。
    本例运行后效果如下:

     

    本例源码附上:
    upload/2007_05/07050816266783.rar

    不知不觉大半天过去了,How Time Fly~
    明天我们将接触到asp.net 2.0建站的的精髓部分:数据源控件 SqlDataSource控件和AccessDataSource控件

  • 相关阅读:
    tornado+websocket+mongodb实现在线视屏文字聊天
    mongoexport 导出需要授权数据库中的集合 报错 Authentication failed.
    nginx日志中添加请求的response日志
    SSE(Server-sent events)技术在web端消息推送和实时聊天中的使用
    RESTful接口设计原则和优点
    一次请求中,经过 nginx+uWSGI+flask应用程序搭建服务的执行过程
    项目中记录影响性能的缓慢数据库查询
    macos Item2 添加 Shell Integration (ftp传输)
    windows安装 阿里云的Fun工具
    windows10安装docker[含百度网盘docker安装包]
  • 原文地址:https://www.cnblogs.com/bk/p/917054.html
Copyright © 2011-2022 走看看