中继器限制重复添加数据

AxureRP8.0教程 小楼一夜听春语 2451℃ 0评论

中继器能够模拟一些列表项添加、删除与修改的操作。

在一些添加的操作中,往往需要限制重复添加。

例如,添加用户数据,会包含用户的id和姓名。

姓名是允许重复的,因为可能出现同名同姓的人。

但是,id一般都是唯一的,不会允许重复。

这样在出现姓名相同的用户时,可以通过唯一的id进行区分。

当我们模拟添加数据的操作时,也要考虑到这种需求,验证新添加的数据是否与已有数据重复。

接下来的案例,就是在添加数据时,要保证id是唯一的。

所以,我们需要能够获取所有已有id,通过条件判断来验证新添加的id是否已存在,只有id不存在,才能添加新的数据。

第一步,我们准备元件。

页面中:

中继器“List”中:

第二步,为中继器“List”的数据集添加一些数据。

第三步,将中继器数据集中的数据和模板中的元件,通过交互进行关联。

注意:以上三步包含了中继器的基本操作,对中继器如果不熟悉,请先阅读《中继器结构与原理详解》。

第四步,为了能够知道中继器中都包含了哪些已有id,我们可以在中继器【每项加载时】,将当前一项的id增加到元件“AllStuId”的文本中,并且将id用花括号分隔开,以免混在一起无法分辨。

我们通过动作【设置文本】于元件“AllStuId”为“[[Target.text]]{[[Item.StuId]]}”,公式中“Target.text”为目标元件的现有文本,“Item.StuId”为中继器当前正在加载的某一项的学号列值(StuId)。

这一步操作完成之后,大家可以尝试预览,在元件“AllStuId”上会显示所有的已有学号(StuId)。

第五步,我们既然已经能够获取到所有的已有id,接下来我们只需要在添加按钮【鼠标单击时】,判断已有id不包含新增的id,满足这个条件,就可以进行添加数据的操作。另外,我们还可以添加一些对输入内容的限制,例如姓名不能为空,成绩必须是数字。

条件设置中,“{[[id]]}”是通过局部变量“id”获取到了文本框元件“IdInput”中输入的新id文本,然后,在两侧添加花括号,与元件“AllStuId”中现有的内容进行对比。

第六步,当我们完成条件的设置,我们先不急于添加新数据的操作。因为添加新数据时,会导致中继器列表刷新,也就是说,【每项加载时】中的交互还会再次执行。这样的话,元件“AllStuId”上的文本会变得很多。为了保持元件“AllStuId”上的id内容最新,我们先将这个元件的文本清空,待到下一步添加数据的操作时,通过【每项加载时】的交互,所有id数据会重新添加到这个元件中。

第七步,我们进行添加数据的交互设置,通过【添加行】的动作设置为中继器“List”添加文本框中新输入的各项数据。

上图中的“id”、“n”、“c”以及“m”都是局部变量,分别获取到文本框元件“IdInput”、“NameInput”、“ChineseInput”以及“MathInput”上的文本内容。

注意:此步骤中局部变量设置并未提供相关截图,不做设置直接输入(例如:“[[id]]”),起不到任何作用。如果不了解局部变量操作,请先阅读AxureRP制作原型中变量的使用(1)AxureRP制作原型中变量的使用(2)

以上为添加按钮上设置的交互。

第八步,我们为删除按钮“Delete”添加交互。(此按钮设置名称,是为了方便部分同学理解该按钮所在的位置)

双击中继器,打开编辑区,点中删除按钮,先添加清空元件“AllStuId”文字的交互。

原因及相关设置参考第六步。

第九步,继续上一步,为删除按钮添加【删除行】的交互,删除中继器“List”中的当前行“This”。

也就是说,点击中继器项目列表中哪一项的删除按钮,就把这一个列表项对应的数据行删除。

以上为删除按钮“Delete”上设置的交互。

以上就是中继器限制重复添加数据的方法。

最后,邀请大家关注微信订阅号“iaxure”(二维码在本站首页右上方),及时获取本站最新动态内容。

硬广插入:《两天掌握Axure RP 8》线下培训,北京、上海正在招生,报名地址http://www.kouer.com。

源文件下载:http://downloads.iaxure.com/no_repeat.rp

 

 

 

 


~~~~~~~~~~~~ 正文结束 下面没了 ~~~~~~~~~~~~

小楼老师再出新作,倾力打造Axure RP 8精品课程系列,以最短的时间高效完成学习目标,入门进阶与实战案例并重,是0基础的新手从入门到精通的必备课程。

《AxureRP 8 入门与实战 - 入门篇》------从零入门进阶的最佳课程------【点此查看详情】

《AxureRP 8 入门与实战 - 案例篇》------实战手册图书的同步视频------【点此查看详情】


转载请注明:Axure原创教程网 » 中继器限制重复添加数据

喜欢 (17)or分享 (0)
发表我的评论
取消评论

表情

Hi,您需要填写昵称和邮箱!

  • 昵称 (必填)
  • 邮箱 (必填)
  • 网址
(1)个小伙伴在吐槽
  1. 重复项如果可以提示不能添加更好
    整夜小楼听春雨2017-08-11 16:13 回复