thymeleaf实现树状下拉框

最新推荐文章于 2024-05-10 17:21:46 发布
最新推荐文章于 2024-05-10 17:21:46 发布
阅读量2.5k 收藏 2
点赞数
分类专栏： thymeleaf 文章标签： java spring 前端框架
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/dissplay1/article/details/123596059
版权

项目场景：

项目场景：thymeleaf：实现树状下拉框（可套用与省市县之类的分区结构）

问题描述

最近维护老系统，系统没用主流的前后端分离，用的若依框架thymeleaf+springboot，由于本人不太熟悉thymeleaf模板引擎，所以将实现方式记录于此；

解决方案：

废话不多说，直接上解决方案

数据库结构：经典的省市县字典表结构

在这里插入图片描述

后端接口

俩个接口，一个接口加载全部数据，另一个根据主键id查询数据
在这里插入图片描述

实现类

在这里插入图片描述

树状实体类

在这里插入图片描述

前端

把树状下拉框弄成单独页面，可以理解为Vue中的组件，其他页面调用
在这里插入图片描述
在这里插入图片描述
其他页面调用

新增页面
在这里插入图片描述
修改页面
在这里插入图片描述
相关函数
在这里插入图片描述

实现效果

在这里插入图片描述
这只是一个简单的树状下拉框，等有空了就更新二级联动的树状下拉框
加油，奥利给！

无颜祖6246
关注
  • 0
    点赞
  • 踩
  • 2
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
专栏目录
Thymeleaf+MySQL实现一个两级树状目录首页导航栏
BaldwinM的博客
03-26 1119
第一次完成Web端开发，发现UI界面可以通过数据库实现UI的各用户的特性化设置。
SpringBoot使用Thymeleaf动态绑定下拉框、单选钮、复选框
pan_junbiao的博客
05-20 1万+
项目中如果使用Thymeleaf模板引擎，需要经常的对下拉框、单选钮、复选框进行数据的动态绑定。下面将介绍如何使用Thymeleaf动态绑定下拉框、单选钮、复选框的数据。 1、使用Thymeleaf动态绑定 1.1Select标签的动态绑定（下拉框） <select name="departmentCode" class="b_select" > <option value="">请选择</option> <option th:each=".
若依生成树表和下拉框选择树表结构（在其他页面使用该下拉框输入）
sumMStar的博客
05-10 1138
用到了两个额外对数操作方法，联动子父级菜单的修改 生成完毕，额外处理自己表中数据也是在新增或者修改当中写 2.注册树形组件
thymeleaf实现树状下拉框（二级联动）
陈小翔的博客
03-24 1895
项目场景： 承接上篇文章，此次记录的是树状下拉框的二级联动，点击次链接查看上篇文章: thymeleaf实现树状下拉框. 问题描述 提示：这里描述项目中遇到的问题： 根据选中的组织，展示组织成员 解决方案： 实际上就是点击一级菜单的时候用ajax调用获取二级信息接口即可 后端接口 前端 新增页面 修改页面稍有变化 函数 点击一级菜单的时候用ajax调用获取二级信息接口，然后将元素通过append拼接起来，下拉框循环数据 显示效果 这就是一个简单的二级联动demo,有什么见解大
若依/RuoYi框架（Thymeleaf模板引擎）前端遍历list显示select下拉框，根据选择option动态加载内容
BUG设计师
01-12 1万+
一、前端遍历list显示select下拉框 后台代码： @GetMapping("/addPets/{id}") public String addPets(@PathVariable("id") Long id, ModelMap mmap) { Users users = usersService.selectUsersById(id); ...
thymeleaf动态输出下拉列表
weixin_44575964的博客
07-13 1274
下拉框： 设置默认值：th:selected="selected" 循环下拉框列表 <div class="layui-form-item"> <label class="layui-form-label"> <span class='x-red'>*</span>商品类型 </label> <div class="layui-input-block"> <select th
用Thymeleaf在前台下拉列表取值
热门推荐
一花一世界 一叶一菩提
07-26 1万+
Thymeleaf在网上的资源特别少 这两天在做一个springboot的项目 遇到下拉列表框 从后台取值动态获取列表框 我的做法是在项目启动访问index页面的时候 把要需要的列表集合存到session作用域 然后在页面取值 下面贴出代码@RequestMapping("index") public String index(HttpSession session){
thymeleaf实现th:each双重多重嵌套功能
10-15
在本示例中，我们将探讨如何使用Thymeleaf的`th:each`指令来实现HTML模板中的双重或多重嵌套循环，以便动态加载一二级文章分类。Thymeleaf是一个强大的服务器端模板引擎，常用于Spring Boot项目，用于生成动态HTML...
springboot整合thymeleaf实现滑块功能完整源码
04-27
在这个项目中，"springboot整合thymeleaf实现滑块功能完整源码"，我们将探讨如何在SpringBoot应用中集成Thymeleaf，并利用HTML和JavaScript实现一个滑块验证功能。 首先，我们需要在SpringBoot项目中引入Thymeleaf...
SpringBoot+Mybatis+Thymeleaf实现博客系统
03-02
SpringBoot+Mybatis+Thymeleaf实现博客系统 Thymeleaf Thymeleaf是一个用于Web和独立环境的现代服务器端Java模板引擎。它可以处理HTML，XML，JavaScript，CSS甚至纯文本。Thymeleaf的主要特点包括自然模板，低学习...
Spring Boot + thymeleaf 实现文件上传下载功能
08-28
Spring Boot + Thymeleaf 实现文件上传下载功能 在本文中，我们将学习如何使用 Spring Boot 和 Thymeleaf 实现文件上传下载功能。首先，我们需要新建一个 Spring Boot 项目，选择 Web 选项，并选择 Thymeleaf 作为...
基于SpringBoot+thymeleaf实现的蓝天幼儿园管理系统
12-15
基于SpringBoot+thymeleaf实现的蓝天幼儿园管理系统是为幼儿园提供的一套管理平台，可以提高幼儿园信息管理的准确性，系统将信息准确无误地输入计算机并在数据库中存储起来。 系统功能说明 1、系统共有管理员、老师...
thymeleaf 之循环遍历LIST到select下拉框
学习，是熵减的最有效途径。
01-02 1713
<select> <option th:each="dict:${mList}" th:value="${dict.gid}" th:text="${dict.gname}"> </select> mList为后端model传来的LIST变量名 th:value为下拉框数值 th:text为下拉框显示内容
thymeleaf下拉选框从后台List集合加载选项并回显选中值
shenxiaomo1688的博客
02-28 2435
页面模板：thymeleaf 控件：下拉选框 需求点：1、select中的option动态从后台读取； 2、执行修改时，下拉选框将从后台查到的值回显在选框中，并加载其他选项。 针对第一点需求，实现代码如下： <div class="form-group"> <label class="col-sm-3 control-label"...
48、SpringBoot 的国际化之让用户在程序界面上弄个下拉框，进行动态选择语言
Java 领域技术分享
09-04 858
springboot 的国际化之让用户在程序界面上弄个下拉框，进行动态选择语言
使用Springboot+thymeleaf+mybatis+Ajax做一个三级联动
lyaizmj的博客
11-23 435
这里的三个方法对应的是你的三个实体类，data[a].code/name，也是你实体类里面的属性，注意编写的顺序。我这里为了追求速度就使用注解的方式来写SQL语句了，最好的方法还是自己新建一个mapper目录在里面新建一个.xml文件,然后编写SQL，目前我使用的这种方式处理不了复杂的SQL要求，比如我们要在后面加标签啥的。这个是我的jQuery位置注意你自己的路径问题，这里是否出错可以在下面的函数里面使用alert（）弹窗测试，如果有弹窗就说明这个路径没有问题。
SpringBoot+Thymeleaf，实现Ajax即时刷新select下拉框内容(下拉框联动刷新)
旗袍不开、怎么得胜？
06-09 2566
SpringBoot+Thymeleaf，实现Ajax即时刷新select下拉框内容 复选框内容联动刷新。 当第一个复选框状态发生改变时，触发ajax请求，根据复选框所选中的值，传给后台，查询该值所对应的下一个复选框中的内容参数，并返回给前台，前台对下一个复选框中的内容进行清空重写。从而实现复选框联动刷新的效果。 前台页面(下拉框部分)： <button onclick="selectGroup()">获取部门</button> <select id="selec
thymeleaf下拉菜单、单选按钮、多选按钮的数据回显
ITxiaobaibai的博客
03-23 3813
1、单选按钮 <div class="row cl"> <label class="form-label col-xs-4 col-sm-3"><span class="c-red">*</span>性　　别：</label> <div class="formControls col-...
springBoot+thymeleaf框架实现cms内容管理和商城系统
weixin_45783387的博客
11-07 1239
springBoot+thymeleaf框架实现cms内容管理和商城系统 概要介绍 基于开源框架springBoot2.3+thymeleaf+springSecurity+lucene8.5.2 是在FEBS-Security 权限管理脚手架上增加了cms内容管理和商城管理以及会员中心三个主要模块并集成lucene对商品全文检索,升级了springboot到了最新2.3版本,同时采用 Light Year Admin模板做为管理后台前端. 目前还有很多功能不完善，尤其是模板前端部分。 目前前端输出都使用的
SpringBoot使用Thymeleaf动态绑定下拉框
最新发布
05-31
SpringBoot是一个开源框架，它可以让Java开发人员更快地构建Web应用程序。而Thymeleaf是一种现代化的服务器端Java模板引擎，它允许我们在Web应用程序中创建动态页面。下面是使用Thymeleaf动态绑定下拉框的步骤： 1. 在SpringBoot中添加Thymeleaf依赖。 2. 创建一个数据模型，存储下拉框中的选项，可以使用List或Map等数据结构。 3. 在Controller中将数据模型添加到ModelAndView中。 4. 在HTML页面中使用Thymeleaf语法动态绑定下拉框，例如： ``` <select> <option th:each="option : ${options}" th:value="${option.value}" th:text="${option.label}"></option> </select> ``` 其中`${options}`是在Controller中添加到ModelAndView中的数据模型。
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值