fastadmin自定义表格搜索功能

本文介绍如何在FastAdmin中自定义搜索功能,包括禁用默认搜索、启用表单搜索、控制搜索栏显示,并演示如何设置不同的搜索类型如模糊搜索、全名搜索及排除指定字段。

摘要生成于 C知道 ,由 DeepSeek-R1 满血版支持, 前往体验 >

在fastadmin的搜索功能中默认显示所有字段都可以进行搜索,而且是隐藏显示,但我们一般是需要显示出来让客户一目了然,而且有些字段搜索用不上,这边文章记录一下解决方法。
1.首先找到生成的js文件,在文件中找到初始化表格的部分,我们需要禁用默认搜索,开启普通表单搜索
在初始化表格的代码里面加上下面这段代码

//禁用默认搜索
search: false,
//启用普通表单搜索
commonSearch: true,
//可以控制是否默认显示搜索单表,false则隐藏,默认为false
searchFormVisible: true,

代码中第三个字段是用来控制搜索栏目是否要显示在页面上,默认是不显示的,我这里改为了显示
1)字段模糊搜索,将operate对应的值改为大写的LIKE。

{field: 'name', title: '藏品名称',operate:'LIKE'},

2)全名搜索

{field: 'tel', title: __('Tel')},

3)如果想要某些字段不显示在搜索功能栏,将operate对应的值改为false。

{field: 'view', title: __('View'),operate:false},
### 如何在 FastAdmin 中添加自定义按钮 为了实现在 FastAdmin 中添加自定义按钮并执行特定功能,可以通过修改前端 JavaScript 文件来定制化操作按钮的行为。具体方法如下: 对于希望根据某些条件动态控制按钮显示的情况,在相应的 js 文件内编写 `formatter` 函数是一个有效的方案[^1]。 ```javascript // 自定义按钮逻辑 formatter: function(value, row, index) { var that = $.extend({}, this); var table = $(that.table).clone(true); // 添加自定义按钮HTML结构 let customButtonHtml = '<a href="javascript:;" class="btn btn-xs btn-success my-custom-button" data-id="' + row.id + '">Custom Action</a>'; // 判断是否满足显示自定义按钮的条件 if (row.status === 1) { // 当 status 字段值为 1 时才显示此按钮 $(table).find('.my-custom-button').remove(); // 移除可能存在的旧版本按钮 $(table).append(customButtonHtml); // 插入新的自定义按钮 } that.table = table; return Table.api.formatter.operate.call(that, value, row, index); } ``` 上述代码片段展示了如何基于给定数据行的状态字段决定是否渲染一个名为 "Custom Action" 的新按钮。当某条记录的状态符合条件(此处假设状态码为 1),则会创建一个新的链接样式按钮,并将其附加到表格的操作列中[^3]。 除了调整现有按钮外,还可以完全移除不需要的标准按钮选项,比如编辑或删除按钮,这同样依赖于 `formatter` 方法中的逻辑判断。 最后值得注意的是,在实际部署之前应当测试这些更改以确保其按预期工作,并且考虑到用户体验方面的影响因素,如性能开销以及界面一致性等问题。
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值