fastadmin表格操作按钮btn-dialog、btn-addtabs 遇到的坑

最新推荐文章于 2025-10-25 16:08:24 发布
原创 最新推荐文章于 2025-10-25 16:08:24 发布 · 1.1k 阅读 · 0 ·
CC 4.0 BY-SA版权
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
文章标签：

#php #thinkphp

在使用Fastadmin开发时，尝试修改表格操作按钮颜色，将btn-dialog错误地替换为了btn-warning，结果导致编辑按钮不再弹出对话框。正确做法是为a标签添加btn-dialog以实现弹窗效果。此外，btn-addtabs用于打开新选项卡。这是一个关于Fastadmin自定义类名和功能的小教训。

好久没写博客了。今天用fastadmin在实现表格操作按钮的时候，遇到了一个坑，耽误了我一下午的时间，给大家分享下，以免踩坑。

下图标注所示，本来我是要改按钮颜色，但是却把"btn-dialog"直接改成了我想要的"btn-warning" ，导致点击编辑按钮一直不是弹窗的效果。a标签添加btn-dialog就可以出现弹框。添加btn-addtabs弹出新的选项卡这是fastadmin自己定义的。
在这里插入图片描述

就说到这里吧，估计也不会有人跟我一样，这样操作改出了这个问题~~~

fastadmin：如何点击按钮弹出存在的指定页面的弹窗
weixin_46001736的博客
02-25 5619
fastadmin：如何点击按钮弹出存在的指定页面的弹窗
fastadmin设置点击按钮出现弹窗，并自定义弹窗宽高
weixin_46001736的博客
02-25 2103
fastadmin设置点击按钮出现弹窗，并自定义弹窗宽高
fastadmin笔记----fastadmin弹出窗口标题设置
魍魉
12-04 1532
首先需要注意的是 buttons 中的 classname 这个参数btn-detail 标题btn-dialog 弹出层btn-click 点击事件而我先前用的是前面的那两个，并未用btn-click 这个属性。buttons 会优先使用 btn-detail 和 btn-dialog。如果要使用 btn-click 就得先 删掉前面那两个。否则会像我一样，提示控制器不存在。text: __('添加状态'),title: this.mc_name+' - 查看',},{
fastadmin 自定义添加按钮和删除按钮
最新发布
lfbin5566的博客
10-25 195
根据条件显示编辑，删除按钮。
2021-10-28 工作记录--fastAdmin-一张图细化FastAdmin中的表格列表的部分功能
weixin_48850734的博客
10-29 1948
fastAdmin 可参考的优秀文章（去fastAdmin问答社区上也可以看到）【堪称yyds】： 1、https://ask.fastadmin.net/article/5567.html 2、https://ask.fastadmin.net/article/323.html
Fastadmin-表格按钮
koudandan的博客
12-19 2345
当表格列表中，有其他切换状态的按钮时，需要在控制器中新增一个定义，否则除开超级管理员，其他账号会出现无权限的提示（status为默认的，所以不需要单独在控制器中设置）。
FastAdmin 自定义表格按钮
honeyatelier的专栏
09-17 2627
提供一个 自定义 Fastadmin 表格按钮的方法
[备忘]记一次fastadmin关于btn-dialog跳转问题，点击确定按钮不是弹出框而是跳转页面的问题
qq_15941409的博客
01-25 3106
解决方法在最后。 故事背景： 这是一次挖坑踩坑经历！ 测试人员说：“哎老铁，你的功能有问题哎，你看一下。” 我：“好的”。 放下手里的事情打开浏览器，输入本地地址看看，发现：“没问题啊！” 测试一脸追命表情：“有问题啊！不信自己看！” 我（内心开始着急）：“嗯！等会儿看。” 自己测了一会儿，没问题，然后去测试环境看，没问题，摸着下巴自言自语：“奇了怪了！没问题啊！” 过了几分钟，确实发现了会出现这个问题。问题是重现了，但问题的原因就是找不到！ 遂，看自己优雅的代码，读框架源码，打断点.
fastadmin中表格列中自定义按钮buttons
qq_36458898的博客
07-26 1193
【代码】fastadmin中表格列中自定义按钮buttons。
fastadmin自定义按钮btn-dialog 在关闭弹窗后刷新父窗体 刷新 关闭 按钮 callback 自定义
热门推荐
qq_40971915的博客
01-31 1万+
自定义按钮 页面A {field: ‘operate’, title: __(‘Operate’), table: table, width:‘30%’,buttons:[ //width是规定这列的宽度 { name: ‘编辑详情’, //按钮的名称 text: ‘编辑详情’,//显示的字 icon: ‘fa fa-image’,//按钮的图标 classname: ‘btn btn-xs bt...
fastadmin前端根据条件显示操作按钮
LordForce的博客
03-31 2115
fastadmin前端根据条件显示操作按钮
fastadmin 向表格后面添加一个自定义按钮 并带上该行某参数
qq_34700162的博客
03-15 1153
附加：另一个知识点， 弹窗模式有三种模式 添加按钮类名就好。目标在后面添加一个自定义按钮。直接在js文件里添加代码。
FastAdmin表格操作栏部分按钮隐藏
qq_37117521的博客
06-08 2379
//formatter:Table.api.formatter.operate formatter:function(value,row,index){ var that = $.extend({}, this); var table = $(this.table).clone(true); $(table).data("operate-edit",null); $(table).data("operate-del",null); that.table =tab.
【fastadmin】根据字段值设置操作按钮状态
metlin的博客
07-10 1515
在FastAdmin这一快速开发框架中，我们经常需要根据数据表中某个字段的值来动态控制页面上操作按钮的显示与隐藏，甚至改变按钮的状态（如启用/禁用）。这里定义了按钮的一些属性，其中可以是值，也可以是一个 function，我们需要什么属性就可以再buttons中配置什么属性就可以了。除了控制按钮禁用状态之外，buttons中还可以配置其他的属性，具体我们可以查看框架源码。数组，用于定义操作列中的按钮。表格操作列的渲染方法调用的是。
fastadmin给操作按钮添加权限菜单控制|新增权限控制菜单
LordForce的博客
07-01 2599
fastadmin5给新添加的方法增加权限菜单管理节点
fastadmin后台自定义按钮和弹窗
小坚的技术博客
01-31 8948
后台添加自定义按钮和弹窗
记录一次在fastadmin中列表顶部增加操作按钮并
qq_40528652的博客
06-13 1255
在require-table.js文件中新增addsbtn 的操作按钮。页面对应的js文件中的初始化表格参数配置中配置对应按钮的操作链接。定义一个新的操作按钮，
[fastadmin] 如何在页面添加操作按钮，做一个echarts图表页面
weixin_42629862的博客
11-06 1155
"></div>
fastadmin按钮事件整理
iloveallcode的博客
03-06 1650
此处例子为点击弹出窗口，输入文字，执行ajax请求。
fastadmin btn-dialog限制多次弹框
12-28
### 解决方案 为了防止 FastAdmin 中 `btn-dialog` 按钮重复触发弹出对话框，可以采取以下措施： #### 方法一：禁用按钮直到操作完成 通过 JavaScript 或 jQuery，在点击事件发生时立即禁用按钮，待异步请求完成后重新启用。 ```javascript $('.btn-dialog').on('click', function() { var $this = $(this); $this.prop('disabled', true); // 禁用按钮 $.ajax({ url: $this.attr('href'), type: 'GET', success: function(response) { // 处理响应逻辑... // 对话框关闭后的回调函数内重置按钮状态 $('#yourDialogId').on('hidden.bs.modal', function () { $this.prop('disabled', false); }); }, error: function(xhr, status, error) { console.error(error); alert('Error occurred'); $this.prop('disabled', false); } }); return false; }); ``` 此方法确保每次点击后都会暂时阻止再次点击，直至当前的操作完全结束[^1]。 #### 方法二：使用一次性标记 引入一个全局变量作为标志位来控制是否允许执行打开新对话框的动作。当首次点击时设置该标志为真，并在成功处理完一次完整的交互流程后再将其恢复成假的状态。 ```html <script> var canOpenNewDialog = true; $(document).ready(function(){ $('.btn-dialog').on('click', function(e){ e.preventDefault(); if (!canOpenNewDialog) return; canOpenNewDialog = false; // 执行打开对话框的相关代码... // 假设这里是你定义好的关闭对话框的方法 $('#myModal').on('hidden.bs.modal', function (e) { canOpenNewDialog = true; }) }); }) </script> ``` 这种方法同样能有效避免短时间内连续多次触发相同行为的情况出现[^3]。 #### 方法三：利用 ZK 的特性 如果项目基于 ZK 框架构建，则可以直接借助其内置机制实现防抖动效果。例如，在创建模态窗口之前先判断是否存在已存在的实例；如果有则不再新建而是直接调用现有实例的 `.doModal()` 方法即可[^2]。 ```java if(window != null && !window.isOpen()){ window.doModal(); } else { Window window = (Window) Executions.createComponents("/path/to/dialog.zul", null, null); window.setClosable(true); window.setTitle("Title"); window.setWidth("80%"); window.setHeight("60%"); window.setPosition("center"); window.setBorder("normal"); window.setVisible(true); } ``` 以上三种策略可以根据具体应用场景灵活选用或组合应用以达到最佳用户体验和性能表现。
评论
成就一亿技术人!
拼手气红包6.0元
还能输入1000个字符
 
红包 添加红包
表情包 插入表情
表情包 代码片
 条评论被折叠 查看
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

运营侠

你的鼓励将是我创作的最大动力

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付：¥1
获取中
扫码支付

您的余额不足，请更换扫码支付或充值

打赏作者

实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

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

余额充值