JVS低代码表单设计:数据联动详解(多级数据级、数据回显等)

在这信息化时代,表单作为数据的收集和展示工具,已经渗透到不同的角落。JVS低代码对表单的设计和操作进行了不断的优化和创新。其中,联动回显作为一项重要的功能,无论是多级数据级联控制、组件的联动控制,还是多表的数据回显控制,都能极大地提升用户体验和数据的精准度,让用户可以更加高效、便捷地填写表单。

在表单填写时,往往存在一些数据根据表单的选择数据进行联动回显。

例如,地区选择时,下拉选择“重庆”,则展示“重庆“对应的地区。

联动目前存在多种情况:

1、多级数据级联控制

2、组件的联动控制

3、多表的数据回显控制

多级数据级联控制

实现多级数据级联控制可以通过树形字典实现,多级数据的联动选择。

如图所示:

操作的方式:

a、选择级联选择组建

b、选择对应的静态字典的数据

c、在界面上可以看到对应的级联选择

字典的设置位置:

在应用字典中,选择对应的字典项,选择对应的操作,即可实现多级字典的配置。

组件的显隐控制

组件显隐控制,组件的显隐状态控制根据其他组件的值来判断是否显示。通过组件有一个显隐控制的配置项实现。

例如下图,通过地址下拉框联动实现4个地址输入框的显示与隐藏。

第一步:如下图先配置对应的下拉框与输入框

第二步:设置下拉框的选项,如图所示:

第三步:设置每个输入框的显隐控制,进入显隐控制界面,

配置的效果如图所示:

一对多的联动回显

主表对子表的多数据联动回显设置,效果如下:

配置如图:

步骤:

第一步:选择表格组件

第二步:选择表格对应的子表模型

第三步:拖对应的基础组件进入表格,并选择对应的字段

在线demo:https://frame.bctools.cn/

基础框架开源地址:https://gitee.com/software-minister/jvs

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mfbz.cn/a/170052.html

如若内容造成侵权/违法违规/事实不符,请联系我们进行投诉反馈qq邮箱809451989@qq.com,一经查实,立即删除!

相关文章

Unexpected WSL error

问题描述 启动 Docker Desktop 报错 Unexpected WSL error,报错完整信息如下: Docker Desktop - Unexpected WSL error An unexpected error was encountered while executing a WSL command, Commoncauses include access rights issues, which occur…

[github初学者教程] 分支管理-以及问题解决

作者:20岁爱吃必胜客(坤制作人),近十年开发经验, 跨域学习者,目前于新西兰奥克兰大学攻读IT硕士学位。荣誉:阿里云博客专家认证、腾讯开发者社区优质创作者,在CTF省赛校赛多次取得好成绩。跨领域…

虚拟化逻辑架构: 创建KVM中的VM与实现VNC远程登录

目录 一、实验 1.安装KVM环境管理工具并创建VM(虚拟机) 2.Windows使用VNC Viewer连接KVM中的VM(虚拟机) 二、问题 1.如何下载安装VNC Viewer 一、实验 1.安装KVM环境管理工具并创建VM(虚拟机) (1) 采…

golang学习笔记——日志记录

文章目录 日志与错误log包记录到文件记录框架Contextual LoggingLeveled LoggingSetting Global Log Level Error Logging 日志与错误 通常,发生错误时,最终用户只会看到一条消息,指示程序出现问题。日志是简单错误消息以外的更多信息。 lo…

城市智慧路灯智能照明管理系统简介

城市路灯存在着开关灯控制方式单、亮灯时间不准确、巡查困难、故障处理不及时、亮灯率无法把控等问题,从而导致路灯系统能耗高,维护成本高。传统的路灯控制系统已无法满足智慧城市管理的需要,智能路灯照明控制系统从而得到广泛应用。 叁仟智…

【C++】使用std::vector()函数实现矩阵的加、减、点乘、点除等运算

本文通过vector&#xff08;&#xff09;函数表示矩阵的形式&#xff0c;对 加、减、点乘、点除等运算进行编码和运行&#xff0c;相应结果如下文所述。 #include <iostream> #include <vector>using namespace std;// 矩阵加法 vector<vector<int>> …

buildadmin+tp8表格操作(4) Table组件,baTable类和 elementplus中的属性关系

在buildadmin 中&#xff0c;table组件是封装的 element-plus中的方法&#xff0c; 所以说&#xff0c; 在 buildadmin的table组件中&#xff0c;是可以通用 elementplus中的属性的 以上这些属性&#xff0c; 在buildadmin中都是可以使用的 使用方式和 elementplus el-table用…

linux rsyslog综合实战1

本次我们通过rsyslog服务将A节点服务器上的单个日志(Path:/var/log/245-1.log)实时同步到B节点服务器目录下(Path:/opt/rsyslog/245) 1.rsyslog架构 2.环境信息 环境信息 HostnameIpAddressOS versionModuleNotersyslog1192.168.10.245CentOS Linux release 7.9.2009 (Core)rs…

工作记录---为什么双11当天不能申请退款?(有趣~)

为什么&#xff1f; 服务降级了 服务降级&#xff1a; 当服务器压力剧增的情况下&#xff0c;根据实际业务情况及流量&#xff0c;对一些服务和页面有策略的不处理或换种简单的方式处理&#xff0c;从而释放服务器资源以保证核心交易正常运作或高效运作。 分布式系统的降级…

十四、Docker的基本操作

目录 &#xff08;一&#xff09;镜像命令 一、拉取Nginx 二、查看镜像 三、导出文件 四、删除镜像 五、加载镜像 &#xff08;二&#xff09;容器命令 一、例子&#xff1a;运行一个nginx容器 1、输入运行命令 2、使用命令查看宿主机ip 3、在外部浏览器访问 4、查看…

crmchat安装搭建教程文档 bug问题调试

一、安装PHP插件&#xff1a;fileinfo、redis、swoole4。 二、删除PHP对应版本中的 proc_open禁用函数。 一、设置网站运行目录public&#xff0c; 二、设置PHP版本选择纯静态。 三、可选项如有需求则开启SSL,配置SSL证书&#xff0c;开启强制https域名。 四、添加反向代理。 …

苹果CMS首涂第30套可装修DIY主题模板免授权版

这是一款可以装修的主题&#xff0c;类似淘宝店装修一样&#xff0c;可以针对首页、栏目页、详情页、播放页进行自定义装修&#xff0c;内置10个模块自由选择、添加、修改、删除、排序操作&#xff0c;后续升级还会增加更多实用和个性模块供选择&#xff0c;主题内包含的导航、…

类与对象(上篇)

前言 在之前我们学的C入门主要是为现在学习类与对象打基础&#xff0c;今天我们才算真正开始学习C了。因为类与对象的知识点比较多&#xff0c;所以我们将它分为三部分讲解&#xff0c;今天我们学习类与对象的上篇。 一、面向过程和面向对象的初步认识 1、面向过程 面向过程顾…

基于安卓android微信小程序的个人管理小程序

运行环境 开发语言&#xff1a;Java 框架&#xff1a;ssm JDK版本&#xff1a;JDK1.8 服务器&#xff1a;tomcat7 数据库&#xff1a;mysql 5.7&#xff08;一定要5.7版本&#xff09; 数据库工具&#xff1a;Navicat11 开发软件&#xff1a;eclipse/myeclipse/idea Maven包&a…

Java架构师软件架构设计导论

目录 1 软件架构设计导论2 HR角度看架构师3 软件架构设计概述4 顶级大师眼中的架构5 建筑中的架构师6 软件架构的发展阶段7 软件架构的意义8 架构是项目干系人进行交流的手段9 架构有助于循序渐进的原型设计10 架构是设计决策的体现11 架构明确系统设计约束条件12 架构与组织结…

【python】直方图正则化详解和示例

直方图正则化&#xff08;Histogram Normalization&#xff09;是一种图像增强技术&#xff0c;目的是改变图像的直方图以改善图像的质量。具体来说&#xff0c;它通过将图像的直方图调整为指定的形状&#xff0c;以增强图像的对比度和亮度。 直方图正则化的基本步骤如下&…

[计算机网络]网络层概述

呼,写了这么久终于重新开始啦! 自己落下了太多东西了.....是时候应该重新拾掇起来了. 关于后面的代码项目,我的想法是vilas.js仍然使用js来进行编写,但是后续其他的项目会开始尝试使用ts来进行书写了. 就算是前端也需要点规范吧..... 0.写在前面 这篇文章要和大家道个歉,首…

“非旺玖原装的PL2303,.........“解决办法

"非旺玖原装的PL2303&#xff0c;…"解决办法 windows安装PL2303串口驱动提示“非旺玖原装的PL2303&#xff0c;请联系您的供货商”的解决办法&#xff1a; 主要原因&#xff1a;驱动版本无法兼容&#xff0c;需要降低使用版本 解决办法&#xff1a; 1.插好串口线&…

万字长文 - Python 日志记录器logging 百科全书 - 高级配置之 日志分层

万字长文 - Python 日志记录器logging 百科全书 - 高级配置之 日志分层 前言 在 Python 的logging模块中&#xff0c;它不仅提供了基础的日志功能&#xff0c;还拥有一系列高级配置选项来满足复杂应用的日志管理需求。 说到logging 模块的高级配置&#xff0c;必须提及日志分…

HDCTF2023 - Reverse方向全WP

文章目录 [HDCTF 2023]easy_re[HDCTF 2023]easy_asm[HDCTF 2023]fake_game[HDCTF 2023]enc[HDCTF 2023]double_code[HDCTF 2023]买了些什么呢[HDCTF2023]basketball [HDCTF 2023]easy_re UPX壳&#xff0c;脱壳 一个base64编码。 [HDCTF 2023]easy_asm ida打开后可以看到xor 10…
最新文章