Web 应用程序的界面设计

Web应用程序的界面设计

任务列表 • 设计用户注册页面

设计用户注册页面 • ASP.NET Web服务器控件 • HTML服务器控件 • Web服务器控件 • 验证控件 • 用户控件

注册界面

HTML服务器控件 • HTML服务器控件的属性 • 添加HTML服务器控件 • 设置HTML服务器控件属性兼容原有HTML标签，使得服务器端能够访问HTML标签控件

Web服务器控件 • Web 服务器控件属性 • 标准控件 • 验证控件具有状态信息，功能更强

验证控件 • 验证控件是对用户输入控件（如：TextBox）中输入的内容进行验证

HTML服务器控件 • 命名空间： • System.Web.UI.HtmlControls • 属性： • Attribute • Style • Visible • 输入HTML控件： • Name • Value • Type • HTML容器控件 • InnerHtml • InnerText Input Button Click事件 onservercick事件 div

Web 服务器控件 • 一个运行在服务器端，并将实际内容呈现在客户端的类 • <asp:ButtonID=“btnOK” runat=“server” Text=“注册" onclick="btnOK_Click" />

标准控件(1/3) • 标签控件(Label) • Text • Visible • 文本框控件(TextBox) • AutoPostBack • TextMode • Text • ReadOnly

标准控件(2/3) • 按钮控件(Button、LinkButton、ImageButton) • OnClientClick • 超链接控件(HyperLink) • NavigateUrl ——两种方式：属性对话框、代码 • Text • 单选按钮控件和单选按钮列表控件(RadioButton、RadioButtonList) • repeatColumns • repeatDirection • SelectdItem

标准控件(3/3) • 复选框控件和复选框列表控件(checkbox，CheckBoxList) • Repeatdirection • 列表控件(DropDownList，ListBox) • Items • Text • Value • selected • 图片控件(Image) • ImageUrl • ImageAlign • alterText

验证控件（1/5） • Web用用系统中常需要检查用户输入的信息是否有效，并在必要时提示用户错误信息 • RequireFieldValidator • CompareValidator • RangeValidator • RegularExpressionValidator • CustomValidator • 必需项 • 与某值对照 • 范围检查 • 模式匹配 • 用户自定义

验证控件（2/5） • 必需项：RequireValidator • 验证谁？ControlToValidate • 出错了提示什么？Text、ErrorMessage • Display

验证控件(3/5) • 对照值验证CompareValidator • ControlToValidate • ControlToCompare • Type • Operator

验证控件(4/5) • 取值范围控件RangeValidator • ControlToValidator • Text • Type • MinimumValue • MaximumValue

验证控件(5/5) • 正则表达式验证控件RegularExpression • ControlToValidator • ValidationExpression

用户自定义控件 • 用户自定义控件与 aspx网页文件类似。 • 区别： • 扩展名：ascx • 没有page指令只有control指令 • 不能独立运行，需要添加aspx页面中使用 • 使用方法： • 拖拽ascx文件到aspx页面中

作业2 • 设计实现用户注册页面 • 要求截图，发表到世界大学城中。并将项目文件打包作为附件添加到文章中。 • 用笔和纸归纳本次课程所学的知识点，和对知识点的理解。并拍照上传到前面的文章中。

Web 应用程序 的 界面 设计