MVC学习新增、修改共用模态框

在项目学习里，有很多的新增和修改，它们的弹出模态框样式几乎一样，可并不是同一个模态框，但也可以实现用的是同一个模态框
以下是样式、内容布局、插件引入，还有模态框的样式

当然这只是前提条件
布局样式

<script>
        //先声明全局变量，全局可以使用
        var layerIndex;//弹出层
        var layer, layuiTable;

        //首先给一个页面载入事件
        $(function () {
            //加载和初始化layui提示层模块和table表格
            layui.use(['layer', 'table'], function () {
                //赋值
                layer = layui.layer;
                //layuiTable接收table
                layuiTable = layui.table;
                //进行渲染
                tabNoticeType = layuiTable.render({
                    //绑定的数据
                    elem: '#tabNoticeType',//html table id
                    //数据来源数据库
                    url: '/SystemManagements/IssuanceNotice/SelectNoticeTypeAll',//数据接口
                    //构建表头
                    cols: [[ //表头
                        //自定义一个模板templet:setOperateNoticeType函数
                       { title: '', templet: setOperateNoticeType, align: 'center', fixed: 'right' }//width: 160 指定宽度，align 指定对其方式
                    ]],
                })
            });
        })

        //声明函数  传递数据
        function setOperateNoticeType(data) {
            var ID = data.NoticeTypeID;//获取主键ID
            //返回btn按钮
            var btns = '<button type="button" class="layui-btn layui-btn-xs" updateNoticeType(' + ID + ')>修改</button>';
            return btns;
        }

        //弹出模态框
        //新增点击事件
        $("#insertNoticeType").click(function () {
            //弹出layer窗体
            layerIndex = layer.open({
                type: 1, //页面层
                area: ["480px", "180px"],
                offset: "auto",//默认坐标，即垂直水平居中
                title: "新增内容",
                content: $("#layerNoticeType")
            });
        });

        //修改点击事件
        function updateNoticeType(noticeTypeId) {
            //弹出layer窗体
            layerIndex = layer.open({
                type: 1,//页面层
                area: ["480px", "180px"],
                offset: "auto",//默认坐标，即垂直水平居中
                title: "修改内容",
                content: $("#layerNoticeType")
            });
        }
	//可以看出新增和修改的模态框是同一个的
	//只是修改内容和新增内容不一样

//最后是layer模态框关闭
        //关闭layer
        function layerClose() {
            layer.close(layerIndex);
        }
    </script>

作者：吴炳耀