SSM框架JSP使用Layui实现layer弹出层效果

layui.use(['jquery', 'table', 'layer', 'form'], function() {
  // 加载layui模块，使用其推荐的【预先加载】方式，详见官网【模块规范】一节
  var $ = layui.$;
  var table = layui.table;
  var layer = layui.layer;
  var form = layui.form;

  
    

      ID
      

        
      
    
    

      会议主题
      

        
      
    
    

      备注
      

        
      
    
    

      

        提交
        重置
      
    
  

//监听行工具事件
    table.on('tool(test)', function(obj){
      var data = obj.data;
      //console.log(obj)
      if(obj.event === 'del'){
        $.ajax({
          url: "/delMeeting",
          type: "POST",
          data: {id: data.id,roomShStatus: data.roomShStatus},
          success: function (msg) {
            if (msg) {
              //删除这一行
              obj.del();
              //关闭弹框
              layer.msg("删除成功", {icon: 6});
            } else {
              layer.msg("删除失败", {icon: 6});
            }
          }
        });
      }
      else if(obj.event === 'update'){
        // 每次显示更新会议室的表单前自动为表单填写该行的数据
        form.val('update-form', {
          "id": data.id,
          "subject": data.subject,
          "remarks": data.remarks
        });
        // 显示更新用户表单的弹出层
        layer.open({
          type: 1,
          title: '更新会议室',
          skin: 'layui-layer-molv',
          area: ['500px'],
          content: $('#update-layer')
        });
        // 更新会议室表单提交
        form.on('submit(update-form-submit)', function(data) {
          // ajax方式更新会议室
          $.ajax({
            url: "updateMeeting",
            type: "POST",
            data: JSON.stringify(data.field),
            contentType: 'application/json',
            dataType: 'json',
            success: function(data) {
              if (data.status == 0) {
                layer.close(layer.index);
                layer.msg('更新成功');
                table.reload('test');
                $("#update-user-form")[0].reset();
                layui.form.render();
              } else if(data.status == 1) {
                layer.close(layer.index);
                layer.msg('更新失败');
                $("#update-user-form")[0].reset();
                layui.form.render();
              }
            },
            error: function() {
              console.log("ajax error");
            }
          });
          // 阻止表单跳转
          return false;
        })
      }
    });