Axure中继器实现数据的输入查询、模糊查询、条件查询

最新推荐文章于 2024-09-03 09:08:35 发布
原创 最新推荐文章于 2024-09-03 09:08:35 发布 · 3.6k 阅读 · 21 ·
CC 4.0 BY-SA版权
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
文章标签：

#产品经理 #产品设计

本文介绍了如何在Axure中使用中继器实现数据的输入查询、模糊查询和条件查询。通过设置交互动作，如单击、文本改变和选项改变时，结合局部变量和表达式，实现了对中继器数据的筛选操作。同时，还提供了刷新键来清除筛选条件。

1. 效果演示
演示链接：https://li5qan.axshare.com/#id=0evf0b&p=test
在这里插入图片描述
2. 原件准备
如图所示：在这里插入图片描述

  • 设置好中继器的相关数据，如图：
    在这里插入图片描述
    4、设置交互。

  • 简单查询
    1、将文本框命名为**“文本输入”，给“查询按钮”设置交互“单击时”的动作为“添加筛选”。在这里插入图片描述
    2、目标选择中继器，点击函数符号。
    在这里插入图片描述
    3、设置局部变量“LVAR1”为“文本输入”，表达式为“[[Item.id==LVAR1]]”，如图：（注：Item.id为    中继器中**学号栏的命名）

最低0.47元/天 解锁文章
Axure中继器（Repeater）: 列表多选和 列表查询
专注于计算机研发知识和资讯分享
04-10 489
给列标题第一列多选框元件命名为ckeck，并同时添加。基于中继器过滤功能，实现一个列表查询功能。
Axure重要元件三——中继器查询和统计
benleiqiang的博客
10-13 1220
以上是中继器查询页数和数据统计，学习步骤：熟悉中继器设置页面数量——设置每页项目数量——中继器函数（中继器函数较多，根据应用讲函数，这样便于理解，所以等所有交互我们都讲完，在统一讲函数。步骤六：共几页自动统计，和步骤五流程一样，只不过变量设置pageCount。步骤五：共几条数据自动统计。步骤二：为上一页添加交互。步骤三：为下一页添加交互。
Axure:实现中继器的增删改查
Coolstuz的博客
10-05 1454
功能实现：如图，实现中继器的增删改 搜索（即查找功能）Axure学习笔记：实现简单搜索功能_Coolstuz的博客-优快云博客 1.元件需求 一个文本框、三个按钮、一个中继器 2.交互 点击中继器，进入内部，对中继器自带的矩形添加交互，目的是单击时，就标记这一行。 设置一个全局变量Add 现在来对三个按钮添加交互事件 “增”按钮 “删”按钮 ...
猿型库：Axure小练习-条件查询
letmeflee112的专栏
04-06 459
条件查询是经常会使用的功能,今天小猿带大家看看如何实现条件查询。通过这个练习,大家可以掌握局部变量和中继器。 效果查看：http://www.axurestudy.cn/pr/index.html 【需求分析】 1、默认展示所有用户的列表，共7条记录； 2、输入年龄区间（最大和最小值），点击查询以后，显示年龄介于输入条件的用户； 3、如果只输入年龄上限，点击查询以后，显示小于年龄上限...
Axure中继器-数据查询
qq19970496的博客
12-24 4386
使用元件 中继器 使用函数 string.lastIndexOf(“searchValue”) 返回调用该函数的字符串中搜索值的最后一个实例的起始索引。如果没有找到搜索值，则返回-1。 操作步骤 添加中继器 1，添加中继器； 2，点击“右侧添中列”，增加一列 3，双击列的名称进行修改； 4，双击字段值，添加数据； 注：目前页面依然显示一列； 5，双击中继器，打开中继器页面；复制矩形框；...
axure9.0中继器多条件模糊查询总结
qq_56370437的博客
02-07 1781
[(Item.code.indexOf(code)+Item.name.indexOf(code)+Item.phome.indexOf(code)+Item.address.indexOf(code))>-4]]，同样的公式相加并括起来（），而-4则表示在中继器中查询的列数。PS：这效果没有达到预期，当前功能仅能实现单条件模糊的查询，并不能实现多条件模糊查询。3、最重要的地方，引用中继器字段，再插入字符串里面的indexOf（局部变量），检查后就完成了。不过单个模糊查询比较适用手机端。
Axure中继器的运用——实现模糊查询功能
qq_45627939的博客
08-08 1492
Axure中继器的使用——实现模糊查询 首先我们需要使用到Axure RP软件，这里不多赘述，下载安装使用教程自行去找，我不提供哦！ 那我们来打开到Axure的界面来创建一个中继器吧。 首先，我们先将元件库中Default中的中继器这个元件拖拽到页面中。 其次，我们给中继器的右侧样式栏中手动添加数据，添加了两列数据：用户名username和地址place。然后再给拖拽一个单行文本框和一个按钮到页面，自行调整样式。另外再在中继器上方拖拽一个表格作为表头。双击中继器，在中继器容器中添加表格。 单击选中中继器
Axure9 使用中继器实现模糊查询搜索
渡阡
11-25 7843
最近完善产品的元件库，刚好遇到需要用中继器实现查询搜索功能。 要求实现的效果也很简单：如下图，我想根据输入框内文本内容改变时，中继器的C1列按照输入框当前的文本内容，模糊查询结果并显示结果。 接下来就是如何实现： 1.给输入框添加交互“文本改变时”，选择中继器的“添加筛选”动作； 2.选择目标中继器，给筛选取个好辨认的名字，勾选“移除其他选项”，然后点击fx开始写规则； 3.这里我们...
关于Axure中，中继器的模糊查询
ying631099151的博客
11-02 1283
** 关于Axure中，中继器的模糊查询 刚入行的新人产品一枚，想找个地方把学习过的东西整理一下思路，并且都记下来，免得将来记不住，如果文章能给别人带来帮助就更好了！有错误的话还请各路大佬多多指正！话不多说我们进入正题！ 一、创建中继器 在左侧元件库中拖拽出中继器放到画布上，在右侧的列名中写下：name sex、age、grade、hobby五项，并在第一行对应以上字段，分别是姓名、性别、年龄、成绩、爱好，此时我们可以看到中继器上只出现了姓名一个字段，如何显示后面字段呢？ 我们双击中继器，然后会在左上角
axure制作表单查询
csdnjquery163com的博客
06-30 2333
Axure的版本8.0 一、实现的功能及展示效果：对表格数据的查询； 二、元件搭配 1、输入框； 2、中继器； 3、标签； 三、实现逻辑 1、搜索框内的文字长度大于等于1，并且搜索的文字能够模糊匹配表格中的姓名，显示匹配的数据； 2、搜索框内的文字长度小于1，将表格数据完整的显示； 四、操作步骤 1、拖入相关组件并设置好中继器的数据内容； 设置中继器的第一列显示id，第二列显示姓名； 2、搜索框内的文字长度大于等于1，并且搜索的文字能够模糊匹配表格中的姓名，显示匹配的数据； 设置
Axure中继器增删改查
11-28
Axure中继器增删改查，Axure是一款强大的原型制作软件，中继器的功能是目前比较常用的一种动态信息变化的组件。这个案例主要介绍了中继器的使用中的新增、删除、修改、查找等功能。
Axure百度模糊查询功能
iteye_7017的博客
03-03 1481
本文实现的效果是类似于百度等众多网站的模糊查询功能，如图所示1.建立Axure，本文以百度为例，便于了解。2.插入一个单行文本框，长度根据自己的需求设定，文本框后面插入按钮。  3.在文本框下面建立一个动态面板，命名为“搜索列表”，点击动态面板的state1，编辑state1，拖动矩形到state1里面，并在矩形中添加内容，然后设置矩形的边框为none。本文以“天”字为例。   4.开始设...
Axure高保真原型图设计之中继器模拟查询
ofay
09-03 609
设置中继器页面到最后一个（Last）。
Axuer的中继器~增删改查
fddggghrr的博客
03-11 1346
1. 中继器2. 增加3. 全选4. 删除5. 修改6. 排序7.分页。
【Axure RP 9 教程】中继器-增删改查
Beau_Ray的博客！
06-15 5250
一、初识中继器 中继器是 Axure 中一个比较高阶的应用，它可以让我们在纯静态网页中模拟出类似带有后台数据交互的增删改查的效果，虽然它没有真正意义上帮我们存储任何的数据，但是当我们在一次项目体验过程中，它却可以给我们带来更加真实的交互效果，我们可以把中继器理解为是一个临时的数据库表，在我们退出当前预览之前，它都可以帮我们存储所需的数据。 如果你有学过数据库的话，对于中继器的掌握是很容易的，但如...
Axure基础详解六：中继器的增、删、改、查
太空背包客的博客
10-27 1677
中继器（Repeater）是一种特殊的控件，它的作用是允许用户创建重复的数据项，并以列表或表格的形式展示出来。中继器可以用于模拟动态数据，例如产品列表、新闻列表、用户评论等。
Axure使用中继器实现淘宝模糊查询
weixin_63985293的博客
04-14 847
函数的意思为：在中继器中查询文本框中文字出现的位置，也就是说，凡是能返回数字的条目，表示都是包含文本框文字的。当查询不到文本框文字时，返回值为-1（负1），即不包含查询的关键字。=-1的意思是即排除不包含查询的关键字的数据。1）首先点击上图【规则】输入框旁的【fx】，配置筛选函数，为其先添加一个局部变量，即搜索框中的文字。这样出现的模糊查询的结果是，只要包含输入框关键词的任意一个字，模糊查询的选项都会被列出来。2、当输入框的值不为空时，下面的数据项显示，且数据筛选出包含输入框中关键词的数据项；
Axure RP9教程 列表查询
热门推荐
jun118166的博客
06-27 2万+
Axure RP9教程 利用中继器过滤功能添加列表查询一、说明二、案例演示三、操作说明四、总结 一、说明 上一篇我给大家介绍了列表多选操作，本篇将给大家介绍列表查询，列表查询是非常常见的一个功能，我们通过会根据用户自定义的筛选条件去过滤相关数据，如何实现这样一个功能，axure中中继器新增过滤器给我们提供了良好的工具。 二、案例演示 案例链接 三、操作说明 我们在表头上添加所属分类、类型名称查询条件，元件分别命名未txtType、txtName； 再添加查询、重置按钮； 给查询按钮添加鼠标单击时交互动作
Axure中继器的使用-筛选过滤查询（六）
xyphf的博客
09-19 4578
选择按钮添加事件 选择【添加筛选】 点击fx添加筛选规则 精确筛选规则我们要求用户名称等于我们输入的名称 我们添加局部变量 模糊筛选条件
Axurerp9中继器模糊查询
最新发布
03-20
<think>好的，我现在需要帮助用户解决在Axure RP9中如何实现中继器的模糊查询的问题。首先，我需要回忆一下用户提供的引用内容，看看有没有相关的信息。根据引用[2]、[3]、[4]，里面提到了使用中继器进行多条件模糊查询，包括设置筛选事件、局部变量以及使用indexOf方法来判断是否包含输入内容。 首先，用户的需求是根据输入框的内容动态过滤中继器中的数据，这属于模糊查询。Axure的中继器组件可以通过设置筛选条件来实现这一点。根据引用[3]中的例子，当输入框内容改变时，中继器的C1列需要根据输入内容进行模糊查询。这里的模糊查询通常指的是检查某个字段是否包含输入的关键词，而不仅仅是完全匹配。 接下来，我需要整理实现步骤。首先，用户需要在页面上放置输入框和中继器组件。然后，中继器需要加载数据，可能是在中继器的数据集里预先填入数据。之后，给输入框添加交互事件，当输入内容变化时触发筛选。这里的关键是筛选条件的设置，比如使用indexOf方法来判断是否包含输入文本，并且不区分大小写。例如，引用[4]中的条件表达式[[(Item.name.indexOf(name))>-1]]，其中name是局部变量，这里可能需要将输入内容和项目名称都转换为小写或大写，以实现不区分大小写的搜索。 另外，引用[2]提到在查询按钮上建立单击事件并添加筛选，但用户的需求是输入时实时查询，所以应该使用输入框的文本改变事件，而不是按钮的单击事件。同时，设置局部变量来获取输入框的当前值，这是关键步骤。 需要注意的是，Axure的筛选条件可能需要正确的语法，比如使用双括号和正确的变量引用。例如，将输入框的值存入局部变量，然后在筛选条件中使用Item.字段名和局部变量进行比较。同时，处理空值的情况，当输入框为空时显示所有数据，这可以通过条件判断来实现。 可能还需要考虑中继器的分页和刷新，确保在筛选后正确显示结果。此外，如果有多个条件需要组合查询，可以使用逻辑运算符如&&来连接多个条件，如引用[4]中的例子，结合了姓名和性别的筛选。 总结一下，步骤大致如下： 1. 添加输入框和中继器。 2. 设置中继器的数据集。 3. 给输入框添加文本改变时的交互事件。 4. 在事件中添加筛选，使用indexOf方法检查是否包含输入内容，并处理大小写。 5. 处理空输入的情况，显示全部数据。 6. 测试原型，确保筛选正确工作。 用户可能遇到的问题包括筛选条件语法错误，或者没有正确处理大小写，导致查询不准确。这时候需要检查筛选条件的表达式是否正确，以及是否将双方都转换为相同的大小写。此外，局部变量的设置是否正确，是否绑定了正确的输入框组件。 最后，根据用户的示例问题，生成相关的进一步问题，比如如何实现多条件查询、如何优化性能或者如何添加排序功能。这些可以帮助用户更深入地了解中继器的其他应用场景。</think>### Axure RP9 中继器模糊查询实现方法 #### 步骤说明 1. **添加组件** - 在画布上放置**文本框**（用于输入查询内容）和**中继器**组件 - 在中继器内设置需要筛选的字段（如`name`字段） 2. **设置中继器数据** ```javascript // 中继器数据集示例（支持中文） Item.name = "张三" Item.name = "李四科技" Item.name = "王五TEST" ``` 3. **绑定交互事件** - 选中文本框，添加「文本改变时」的交互事件 - 添加「筛选」动作，选择目标中继器 4. **配置筛选规则** 使用以下表达式实现模糊查询： ```javascript [[Item.name.toLowerCase().indexOf(LVAR1.toLowerCase()) >= 0]] // [^3] ``` - `LVAR1`为文本框值的局部变量 - `toLowerCase()`实现不区分大小写 - `indexOf()`检测包含关系 5. **空值处理** 添加条件判断： ```javascript if: [[LVAR1.length > 0]] else: 移除筛选[^4] ``` #### 完整交互流程 ```javascript // 文本框文本改变时 设置局部变量LVAR1=元件文字 if LVAR1非空： 筛选中继器：[[Item.name.toLowerCase().indexOf(LVAR1.toLowerCase()) >= 0]] else： 移除所有筛选 ``` #### 注意事项 1. **特殊字符处理**：输入内容包含`*`等符号时需转义 2. **动态面板联动**：结合动态面板可实现带滚动条的查询结果展示[^4] 3. **性能优化**：超过100条数据建议增加防抖处理（延迟300ms执行）
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值