开发基于ajax和控件技术的web应用系统

1、第二章我的控件我做主（一） 回顾与作业点评 运行时是怎样的?实现图片数字水印的两种方式和实现思路？预习检查用户控件的扩展名是什么？Render() 方法有什么作用？本章任务实现登录功能的用户控件 实现 “编辑推荐”和“热卖排行”功能 实现自定义扩展文本框控件 本章目标掌握用户控件的创建、使用掌握暴露用户控件的属性掌握自定义控件的概念了解服务器控件的生命周期、呈现过程会从服务器控件派生自定义控件 搜狐首页搜狐新闻页页面内容的重用用户控件支持页面代码的重用用户控件是一种组合控件封装独立的功能像页面一样方便的编辑像控件一样使用拖拽方式使用后缀名为.ascx作用页面代码的重用 母版页提供整个页面级的风

2、格控制和代码重用； 用户控件提供小范围的风格控制和更灵活的代码重用 什么是用户控件创建和使用用户控件的步骤1、新建用户控件2、在用户控件上放置相关的 Web 控件3、编写用户控件的后台代码4、在其他页面使用用户控件创建用户控件演示示例1：登录的用户控件Control指令后台代码类似于Page指令 public partial class UserControls_UserLogin : System.Web.UI.UserControl protected void Page_Load(object sender, EventArgs e) 也有Page_Load事件 用户控件的关键代码在页面

3、中注册和使用在页面中注册控件 将用户控件放入页面指定位置即可 使用用户控件在web.config 中注册 在页面中使用控件 使用用户控件的另外一种方式在页面中使用 练习实现登录功能的用户控件 需求说明将“第三波书店”中用户登录的功能使用用户控件技术实现 分别使用两种方式注册用户控件完成时间：20分钟共性问题集中讲解常见调试问题及解决办法代码规范问题共性问题集中讲解如何在使用用户控件时，可自定义设置显示？可配置的用户控件用户控件是一个类给用户控件定义“标题”，“显示数量”属性在使用页面中设置属性可配置的用户控件演示示例2：可配置界面的书籍排行用户控件关键代码暴露用户控件的属性 private s

4、tring title = ;/标题 private int num = 4;/个数 public string Title get set public int Num get set 默认值 公开的属性 protected void Page_Load(object sender, EventArgs e) if (!Page.IsPostBack) this.lblTitle.Text = this.Title; this.rptRankings.DataSource=new BookManager().GetRankings(this.Num); this.rptRankings.Da

5、taBind(); 配置属性练习实现“编辑推荐”版块功能 需求说明实现“第三波书店”首页中“编辑推荐”版块功能使用用户控件技术实现，版块标题可配置显示效果类似“书籍排行榜” 完成时间：20分钟共性问题集中讲解常见调试问题及解决办法代码规范问题共性问题集中讲解用户控件可以包含其他用户控件可以像页面一样，在用户控件中使用其他用户控件但用户控件中不可包含自己，也不能循环嵌套用户控件1用户控件2用户控件1注意事项2-1用户控件不可以单独访问后缀名.ascx是被禁止直接访问的类型 注意事项2-2用户控件与页面的区别用户控件与Page比 较 用户控件 页 面 扩展名 ascx aspx 指令 Contro

6、l Page 继承 System.Web.UI.UserControl System.Web.UI.Page 包含 可包含控件和其他用户控件，也可以被其他用户控件和页面包含 可以包含控件和所有用户控件，但是不可以被其他页面包含 标签 不能包含、等HTML标签 可包含所有HTML标签 直接访问 不可以 可以 用户控件编码使用哪个标记？用户控件和母版页分别在哪种情况下使用？可否在用户控件中访问外部页面的控件？为什么？用户控件与Page小结如何把用户控件应用到其他项目中？用户控件的问题需要部署的文件源代码，如ascx 文件、cs文件(dll)资源文件，如JavaScript、图片、样式表 部署用户控

7、件是一件麻烦的事情，因此用户控件适合在单个项目中使用 部署自定义控件是一件简单的事情，一般只需要部署一个DLL 自定义控件(Custom Control)是编译的服务器端控件，它将用户界面和其它功能都封装到可复用的包中(dll)我们使用过的自定义控件验证码控件FCKeditor(非常复杂）什么是自定义控件自定义控件和用户控件的区别用户控件与Page比 较 用户控件 自定义控件 部署部署大量文件，麻烦一般部署dll，简单代码组成 分为前置页面和后置代码 全部是代码，一次编译为dll开发环境不会出现在工具箱中，有限的设置时支持会出现在工具箱中，很强的设置时支持基类System.Web.UI. Us

8、erControl或其它用户控件System.Web.UI. Control等或其它自定义控件开发方式拖拽实现页面+编码实现事件相应全部编码实现自定义控件和用户控件操作演示：开发第一个自定义控件关键代码展示DefaultProperty(Text)ToolboxData()public class FirstServerControl: WebControl Bindable(true) Category(Appearance) DefaultValue() Localizable(true) public string Text get set protected override void

9、 RenderContents(HtmlTextWriter output) output.Write(Text); 属性 呈现页面内容特性，提供设计时支持特性，提供设计时支持自定义控件出现在工具箱中在页面中使用自定义控件用户控件与Page使用自定义控件 在web.config 中注册自定义控件回顾： 页生命周期 Init LoadControl events 验证Unload Render RequestResponse页面初始化页面被加载服务器控件进行验证控件事件页面显示页面卸载用户控件与Page服务器控件生命周期Web Forms 中页面是通过控件呈现出来的用户控件与Page页面和控件的

10、关系页面用户控件1服务器控件1用户控件2服务器控件2服务器控件n服务器控件2服务器控件21服务器控件22用户控件与Page服务器控件呈现protected virtual void Render(HtmlTextWriter writer) /呈现自身的内容 RenderChildren(writer); protected virtual void RenderChildren(HtmlTextWriter writer) foreach(Control c in Controls) c.RenderControl(writer); public virtual void RenderCon

11、trol(HtmlTextWriter writer) if(Visible) Render(writer); 递归的方式呈现所有控件3个方法在所有控件基类Control 类中定义回顾：Web控件System.Web.UI.Control System.Object HtmlControl WebControl DataSourceControl CompositeControl Button Label CheckBox BaseDataList BaseDataBoundControl Web控件关系图用户控件与Page自定义控件基类的选择实现自定义控件基类的选择继承自 System.We

12、b.UI.Control最灵活的方式继承自 System.Web.UI.WebControls. WebControl需要生成可视化的HTML元素继承自现有控件，如TextBox、Button等扩展现有控件的功能控件的呈现方法protected override void Render(HtmlTextWriter writer) this.RenderBeginTag(writer);/呈现开始标记 this.RenderContents(writer); /呈现内容 this.RenderEndTag(writer); /呈现结束标记 protected internal virtual

13、void Render(HtmlTextWriter writer) this.RenderChildren(writer); Control 类Render() 的定义继承Control 可以重写Render( )方法WebControl 类Render() 的定义继承WebControl 可以重写Render( )和RenderContents()继承自现有控件也可以重写Render( )方法用户控件与Page文本框控件如何实现以下功能的扩展文本框控件？提供输入大写字母和货币两种验证模式验证非零正整数，在TextBox 后输出“元”验证输入大写字母，在TextBox后输出“！”输入错误，提

14、示，清空输入框用户控件与Page文本框控件实现扩展文本框控件的基本思路继承TextBox 控件使用脚本实现客户端验证输出错误，提示，清空输入框定义属性提供两种验证模式演示示例3：扩展文本框控件用户控件与Page在自定义控件中使用脚本1、创建脚本文件并实现相关代码2、嵌入资源3、定义元数据文件4、注册脚本assembly: WebResource(BookShopControls.js.Validate.js, text/javascript)namespace BookShopControlsprotected override void OnPreRender(EventArgs e) ba

15、se.OnPreRender(e); Page.ClientScript.RegisterClientScriptResource( this.GetType(), BookShopControls.js.Validate.js);用户控件与Page实现控件的属性控件的属性控件的呈现控件的客户端属性private validateType _validateType;public validateType ValidateType set this._validateType = value; get return this._validateType; public enum validat

16、eType NoZeroInteger = 1, /非零正整数 BigChar = 2 /只能输入大写字母protected override void Render(HtmlTextWriter writer) base.Render(writer);/输出文本框 if (this.ValidateType = validateType.NoZeroInteger) writer.Write(元); else if (this.ValidateType = validateType.BigChar) writer.Write(!); protected override void AddAt

17、tributesToRender( HtmlTextWriter writer) base.AddAttributesToRender(writer);/保留父类的属性 if (this.ValidateType = validateType.NoZeroInteger | this.ValidateType = validateType.BigChar) writer.AddAttribute(HtmlTextWriterAttribute.Onchange, checkNoZeroInteger(this, + this.ValidateType + );设计时支持即控件使用时在Visua

18、l Studio 中可视化配置能力的支持常用的设计时属性用户控件与Page自定义控件设计时支持属性名称应用位置 说 明Browsable 属性、事件 是否应该显示在属性窗口中 Category 属性、事件在属性窗口中进行分组显示时的类别 Description 属性、事件文字说明 DesignOnly 属性 只能在设计期间使用 DefaultValue属性 默认值 DefaultProperty 类 控件的默认属性 ReadOnly 属性 在设计时只读 ToolBoxData 类 从工具箱拖放到页面上时标记的初始值 操作演示：实现控件设计时支持练习自定义文本框控件 需求说明实现自定义的文本框控件 只能输入非零正整数或者大写字