必填字段 | Required Fields

在提交表单之前,检查必填字段是否填写完整。

STEP0:下载练习文件

如果你还没有练习文件,请下载Axure Training.rp并在Axure RP中打开它,该文件包含了Axure培训网站上每个教程的对应页面。我们建议你始终使用我们准备好的文件来学完教程,但是如果你无法保证,那也没有关系,我们也会告诉你在不使用Axure Training.rp文件的情况下,如何创建新文件来完成教程。

STEP1:设置

在练习文件中打开“必填字段”页面。

这个页面包含一个和输入电子邮件的文本字段和一个提交按钮,还有一个包含两种状态(“成功”和“错误”)的动态面板,当填写了电子邮件才能显示“成功”信息,如果没有填写,就会显示“错误”状态。

选中“登录信息”动态面板,点击样式页签下的“隐藏”复选框将其隐藏。

STEP2:当电子邮件为空的时候显示错误信息

选择登录按钮元件,在属性页签下双加“鼠标单击时”来添加一个新的鼠标单击时用例。

在用例编辑器的顶部,点击“添加条件”打开条件设立窗口。

保留第一个下拉列表的选项为“元件文字”,在第二个下拉列表,选择“电子邮件”元件。

后面的两个下拉列表分别设置为“==”和“值”。

最后一个字段,清空内容保持空白状态。

点击“确定”按钮关闭条件设立窗口。

在用例编辑器中,点击左侧“添加动作”栏中的“设置面板状态”。

在右侧“配置动作”栏,选择“登录信息”动态面板。

在这一栏的底部,设置“选择状态”下拉列表的选项为“错误”状态,然后点击“如果隐藏则显示面板”的复选框。

 

在左侧“添加动作”栏,点击“等待”动作。

在右侧“配置动作”栏,你可以设置“等待”动作的时长,将它设置为2000毫秒。

在左侧“添加动作”按,点击“隐藏”动作。

有右侧“配置动作”栏,选择“登录信息”动态面板。

点击“确定”按钮关闭对话框。

STEP3:当电子邮件不为空的时候显示成功信息

在属性页签下再次双击“鼠标单击时”来添加一个新的鼠标单击时用例。

在这个用例中不用添加任何条件,注意中间的“组织动作”列,显示“Else If True”,这个用例会在之前的用例没有发生的情况下触发。

在左侧“添加动作”栏,点击“设置面板状态”动作。

在右侧“配置动作”栏,选择“登录信息”动态面板。

在这一栏的底部,设置“选择状态”的选项为“成功”状态,然后点击“如果隐藏则显示面板”的复选框。

在左侧“添加动作”栏,点击“等待”动作。

在右侧“配置动作”栏,你可以设置“等待”动作的时长,将它设置为2000毫秒。

在左侧“添加动作”按,点击“隐藏”动作。

有右侧“配置动作”栏,选择“登录信息”动态面板。

点击“确定”按钮关闭对话框。

STEP4:预览

点击预览。

尝试在电子邮件为空的情况下点击登录按钮,当错误信息消失以后,在电子邮件中输入一些内容,然后再次点击登录按钮。

评论(1 个评论)

发表回复

您的电子邮箱地址不会被公开。