thymeleaf+bootstrap,onclick传参实现模态框中遇到的错误

简介: onclick调javascript函数时,不能直接使用onclick=“editUser(${prod.id})”,这样会报错,需要修改成如下的格式。 <a href="#editModal" role="button" data-toggle="modal" th:onclick="'javascript:editUser('+${prod.id}+');'">修改&

onclick调javascript函数时,不能直接使用onclick=“editUser(${prod.id})”,这样会报错,需要修改成如下的格式。

<a href="#editModal" role="button" data-toggle="modal" th:onclick="'javascript:editUser('+${prod.id}+');'">修改</a>

<script>

function editUser(id){
         $.get("/projectName/user/edit",{objectid:id},function(data) {
                $("#frm_container1").html(data);
            });
     }

</script>


另外调用bootstrap.js之前需要将jQuery.js引用,否则会出现点击两次才出现模态框的情况。

目录
相关文章
N..
|
8月前
|
开发框架 前端开发 JavaScript
Bootstrap模态框
Bootstrap模态框
N..
68 1
|
2月前
|
JSON 缓存 前端开发
个人练习前端技术使用Bootstrap、JQuery、thymeleaf
个人练习前端技术使用Bootstrap、JQuery、thymeleaf
40 3
Bootstrap5 模态框3
通过添加不同的类,如 `.modal-fullscreen` 可实现模态框全屏显示,`.modal-fullscreen-*-*` 控制特定尺寸下的全屏显示,`.modal-dialog-centered` 实现模态框居中,以及 `.modal-dialog-scrollable` 使模态框内部内容可滚动。
Bootstrap5 模态框2
通过在模态框的 `&lt;div&gt;` 元素中添加 `.fade` 类,可以实现模态框弹出和关闭时的淡入淡出动画效果。此外,通过添加 `.modal-sm`、`.modal-lg` 和 `.modal-xl` 类,可以调整模态框的大小,分别创建小、大和超大的模态框。
Bootstrap5 模态框1
Bootstrap5 模态框是一种覆盖在当前页面上的对话框,用于展示信息或进行用户交互。通过按钮触发,模态框包含标题、内容和底部操作区,实现页面内交互而不跳转。示例代码展示了如何使用 Bootstrap5 创建一个基本的模态框。
|
4月前
|
JSON 缓存 前端开发
个人练习前端技术使用Bootstrap、JQuery、thymeleaf
个人练习前端技术使用Bootstrap、JQuery、thymeleaf
33 2
bootstrap+thymeleaf 页面多选回显时莫名其妙多了
【1月更文挑战第5天】bootstrap+thymeleaf 页面多选回显时莫名其妙多了 问题分析处理
|
8月前
|
前端开发 JavaScript
Bootstrap 5 保姆级教程(十一):模态框 & 提示框
Bootstrap 5 保姆级教程(十一):模态框 & 提示框
|
前端开发 JavaScript
|
前端开发 CDN
前端:Bootstrap 模态框
前端:Bootstrap 模态框
107 0
前端:Bootstrap 模态框