FastAdmin表格自定义操作按钮3

上一篇讲了如何在FastAdmin的表格上给每一行加自定义的按钮，分为Dialog和Ajax两种，这篇着重讲下Dialog这种形式。

Dialog是打开一个弹窗，弹窗里是Html，类似添加/编辑的页面。

这里我们还是以实名认证操作为例。

先贴下field operate的代码

{field: 'operate', title: __('Operate'), table: table, events: Table.api.events.operate,
    buttons: [
        {
            name: 'realname',
            title: '实名认证',
            classname: 'btn btn-xs btn-primary btn-dialog',
            icon: 'fa fa-address-card',
            url: 'user/user/realname',
            callback: function (data) {
                console.log(data);
            }
        }
    ],
    //formatter: Table.api.formatter.operate
    formatter: function(value, row, index){
        var that = $.extend({}, this);
        var table = $(that.table).clone(true);
        //隐藏删除按钮
        $(table).data('operate-del', null);
        //根据状态判断是否要显示该按钮
        if(row.realname_status != 1){
            $(table).data('operate-realname', null);
        }
        that.table = table;
        return Table.api.formatter.operate.call(that, value,row,index)
    }
}

其中formatter是控制按钮的显示隐藏的，如果要按钮一直显示，就不需要自定义方法，直接用默认的formatter: Table.api.formatter.operate就好了。

加完这些之后按钮就可以操作了，只是有个问题：在弹窗中点击确定按钮后弹窗中的页面会刷新，继而报错找不到记录，而弹窗未关闭，列表也没刷新。而我们要的效果是编辑完后弹窗自动关闭且列表自动刷新。

其实实现也很简单，在下方再加一个事件即可，最终效果如下

api: {
    bindevent: function () {
        Form.api.bindevent($("form[role=form]"));
    }
},
realname:function(){
    Controller.api.bindevent();
}

也就是加一个跟按钮的name同名的方法到表格方法中。需要注意的是这个方法的名称、按钮的name，要和按钮的url的方法名要一样，不然弹窗还是不会自动关闭！