Fastadmin后台页面添加顶部按钮

简介: 操作的前提是需要在fastadmin框架中添加对应的控制器、模型、视图页面,可以手动创建,也可以使用curd一键生成。

一、实现效果

6f27b1e73a6a4d8d86f36868a11ed97f.png


二、具体操作流程

(1)操作的前提是需要在fastadmin框架中添加对应的控制器、模型、视图页面,可以手动创建,也可以使用curd一键生成。


(2)首先在视图页面index.html页面添加按钮的结构样式。


对应的目录如下

c2974a298c054101aa9a347f9d4e7fef.png

对应的结构样式如下:

6b4d55ff186f4f4ebad422ceecc62690.png

 代码是:

<a href="javascript:;" class="btn btn-success btn-export {:$auth->check('download/download/download')?'':'hide'}" title="{:__('Export')}" id="btn-export-file"><i class="fa fa-download"></i> {:__('批量下载')}</a>

(3)初始化表格参数

7f384d5dbed6407cae708bf1100d87ea.png

(4)为表格绑定事件并且指向控制器对应的方法

ebcd4c6e29ff4953a136d6bd5b2e3440.png

代码如下:

            $(document).on('click', '.btn-export', function () {
                var ids = Table.api.selectedids(table);
                console.log(ids);
                Layer.confirm(
                    "是否要下载选中",
                    {
                        title: "操作提示",
                        icon: 0,
                        btn: ["确认", "取消"],
                    },
                    function (index, layero) {
                        $.ajax({
                            method: "POST",
                            url: "download/download/download",
                            data: {
                                uid: 1
                            },
                            success(res) {
                                console.log(222);
                            },
                        });
                    },
                );
            });


这样就可以创建一个顶部按钮了。

欢迎留言区评论交流。

目录
相关文章
|
6月前
|
移动开发 小程序 前端开发
uniapp开发小程序H5页面顶部导航栏navigationBar如何隐藏?三种解决办法
uniapp开发小程序H5页面顶部导航栏navigationBar如何隐藏?三种解决办法
若依的目录结构,有三种一种目录菜单,目录菜单,展开的都是页面的功能,不会跳转,第二种页面菜单,目录里面的一点击都是展示页面,第三种是按钮菜单,点击之后
若依的目录结构,有三种一种目录菜单,目录菜单,展开的都是页面的功能,不会跳转,第二种页面菜单,目录里面的一点击都是展示页面,第三种是按钮菜单,点击之后
若依颜色失效怎么办?F12刷新样式不管用,回到控制台,重新点击项目链接就好了
若依颜色失效怎么办?F12刷新样式不管用,回到控制台,重新点击项目链接就好了
若依如何创建二级页面菜单,点击目录后,右侧空白的悬浮空白的内容,点击系统管理的菜单管理,上级菜单点击主类木有个小三角,选择我们之前创建的主类目
若依如何创建二级页面菜单,点击目录后,右侧空白的悬浮空白的内容,点击系统管理的菜单管理,上级菜单点击主类木有个小三角,选择我们之前创建的主类目
|
6月前
|
小程序
微信小程序实现不同按钮跳转同一个页面显示不同内容
微信小程序实现不同按钮跳转同一个页面显示不同内容
144 0
|
5月前
|
JavaScript
Vue搭配ELEMENT之后,右侧点击栏点击跳转到空白页解决方法
Vue搭配ELEMENT之后,右侧点击栏点击跳转到空白页解决方法
|
6月前
|
Shell 开发工具 git
聊天功能演示系统发布后出现有些页面滚动与鼠标点击问题解决
聊天功能演示系统发布后出现有些页面滚动与鼠标点击问题解决
43 0
|
小程序 JavaScript
小程序点击轮播图跳转到tab导航界面
小程序点击轮播图跳转到tab导航界面
101 0
|
存储 前端开发
ajax实现简单的点击左侧菜单,右侧加载不同网页
ajax实现简单的点击左侧菜单,右侧加载不同网页
84 0
|
前端开发 数据库 容器
ivx页面(4)下拉菜单的页面
ivx页面(4)下拉菜单的页面
90 0