layer.msg弹窗的使用

直接po图和代码,设也不说

 {
                    title: '操作',
                    align: 'center',
                    formatter: function(value, row, index) {
                        var actions = [];
                        actions.push('+ editFlag + '" href="javascript:void(0)" οnclick="Freeze(\'' + row.collateralId + '\')" >解冻处理 ');
                        return actions.join('');
                    }
                }

这里是使用的a 标签,因为本身就是在表单中,class的是btn的样式 editFlag是写在script中的,连接的是controller层的edit请求 ,onclick是自己重新编写的点击事件,这边主要绑定的是collateralId。

  <script th:inline="javascript">
        var editFlag = [[${@permission.hasPermi('admin:collateral:edit')}]];

然后就是编写点击事件了

 function Freeze(collateralId){
            layer.msg('请选择解冻方式',{
                icon: 3,
                title:'提示',
                time:60000, //60s后自动关闭弹窗
                area:['350px', '200px'],
                btn:['抵扣车款','违约金','取消'],
                yes: function (index, layero) {
                        $.ajax({
                            url: prefix + "/edit",
                            type: "post",
                            data: {
                                collateralId:collateralId,
                                useType : 2,
                            },
                        })
                    parent.location.reload(); // 父页面刷新
                    return true
                },
                btn2: function (index, layero) {
                    $.ajax({
                        url: prefix + "/edit",
                        type: "post",
                        data: {
                            collateralId:collateralId,
                            useType : 3,
                        },
                    })
                    parent.layer.close(index);
                    return true
                }
            });
        }

这边样式自己调把,主要看的还是btn按钮的功能请求。
yes对应的是我这边自己做的抵扣车款的按钮,data绑定的值就是在navicat里表中的资金流向的字段,useType这个字段,为了方便看出来,也顺便绑定了collateralId字段,url一定别写错,搁哪儿的请求就写哪儿的。

后面的parent.layer.close(index);是为了点击之后刷新父页面的。

出来的效果就是

layer.msg弹窗的使用_第1张图片
视频效果po不出来,有点尴尬,反正点击哪个资金流向就变成哪个,

如果对头像有兴趣的可以关注一下我的公众号哦。
layer.msg弹窗的使用_第2张图片
如果有问题的话,就加我企鹅把:772758287

你可能感兴趣的:(layer弹窗,bootstrap,js,ajax,前端)