|
|
|
| 第11课 初体验留言板主页面的动态效果 |
| www.study51.com |
| 【字体：大 中 小】【打印】【关闭】 |
|
|
在学这课之前先给大家解释一下表单和表单域的区别。表单是指< form >代码标签，也就是DW设计视图下看到的红虚线框。
表单域是指表单将来要提交的内容，也就是文本字段、隐藏区域、文本区域、单选按钮、按钮等元件叫表单域，见图1。
图1 这些都是本课要用到的表单域
一、添加表单、布局表格
1、新建文档，保存为write.asp这个页面是签写留言的。首先要插入一个表单见图2。
图2 插入表单面板
2、在表单内添加表格，表格布局设置见图3。
图3 布局表格
二、添加表单域
1、姓名：在姓名对应的表格里添加 文本字段，在属性面板上取名为name见图4，这样做是为了与数据库的字段名字相对应。
图4 姓名对应的表单域命名
2、OICQ、EMAIL、个人主页的表单域的添加方法同上，均为文本字段，分别命名为：OICQ|oicq，EMAIL|mail,个人主页|homepage。
3、头像：在相对应的单元格里分别插入用户头像图片，然后添加对应的单选按钮 命名为：tx。
4、性别：在姓名对应的表格里添加两个单选按钮，选中性别男单选按钮：在属性面板为它改名为sex选定值为男，初始状态－已勾选，
设置见图5。 选中性别女单选按钮：在属性面板为它改名为sex选定值为女，初始状态－未选中，方法同上。
图5 性别男：对应表单域单选按钮的设置
5、提交与重置按钮：在最下面的单元格添加两个按钮 ，选中提交按钮：在属性面板为它改名为Submit，标签选提交，动作－提交表单，
设置见图6。 选中重置按钮：在属性面板为它改名为Submit2，标签选重置，动作－重设表单，方法同上。
图6 提交按钮属性
6、添加隐藏区域：在提交按钮旁单击添加隐藏区域 ，在属性面板里为它改名为IP，在值里添加代码< %= Request("remote_addr") % >
这段代码是获取客户端IP的，见图7。
图7 隐藏区域设置
7、留言内容：在留言内容对应的单元格里添加文本区域 在属性面板里为它改名为liuyan，全部添加完的表单域，见图8。
图8 添加好的表单域
三、定义提交按钮的服务器行为
1、选中的整个表格，打开服务器行为面板，单击“+”按钮选择菜单下的插入记录，见图9。
图9 服务器行为－插入记录
2、设置表单域与数据库字段名一一对应，在表单元素里分别依次选中元素，在下面的列里选择与数据库相对应的域，见图10。
图10 插入记录对话框
四、定义表单提交的错误检查（行为面板）
1、签写留言时为了避免有错误信息的写入，添加表单提交的错误检查功能。打开设计面板下的行为面板，单击"+"选择检查表单，见图11。
图11 设计－行为－检查表单
2、设置表单域和检查事件：name选择必需的，ociq选择数字，mail选择必需的和电子邮件，homepage不选，liuyan选择必需的，见图12。
图12 检查表单对话框 |
|
|
| 【字体：大 中 小】【打印】【关闭】 |
|
|
|
