FastAdmin在index的表中勾选checkbox提供url参数

文章讲述了如何在HTML页面中使用A标签实现自定义按钮,当用户选择多个checkbox时,通过JavaScript操作获取数据-url属性,并动态更新链接,涉及test.js文件的修改和test控制器的调用,最终展示弹出结果页面。

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

在页面html中(application\admin\view\test\index.html)添加A标签

<!--测试index页面的自定义按钮-->
 <a href="javascript:;" id="testargs" data-url="test/demo" class="btn btn-danger btn-dialog">界面按钮参数</a>
<!--测试index页面的自定义按钮-->

 修改js代码(\public\assets\js\backend\test.js)

//此处为    index:   范畴
            //改变checkbox时响应  '#table .bs-checkbox [type="checkbox"]' 是checkbox的选择符
            $(document).on('change','#table .bs-checkbox [type="checkbox"]',function(){

                let url=$('#testargs').attr('data-url');//获取id为testargs连接的data-url属性值
                url=url.split('?')[0];//按照?分割后取前部分,后面不要了
                let ids=Table.api.selectedids(table);//取得ids,这个是管理员的

                if(ids.length){
                    let u_id=[];
                    ids.forEach(element=>{
                        let data=Table.api.getrowbyid(table,element);//按照admin_id获取行记录内容
                        console.log(data);
                        if(!u_id.includes(data.admin_id))
                        {//admin_id不在数组里,就添加,重复不添加了
                            u_id.push(data.admin_id);
                        }
                    });
                    if(u_id.length)
                    {//admin_id就拼接url
                        url+='?';
                        url+='id='+u_id.join(',')
                    }
                }
                let obj=$('#testargs');

                //反斜杠可以运行插值
                obj.after(`<a href="javascript:;" id="testargs" data-url="${url}" class="btn btn-danger btn-dialog">界面按钮参数</a>`);
                obj.remove()
                //$('#testargs').attr('data-url',url)
            })

添加勾选checkbox响应事件

选择2个checkbox

 添加test控制器代码

 弹出结果页面 

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值