智能商贸-3 CRUD

1.删除功能

由于JSP页面已经写了按钮,所以直接在JS实现其功能就可以了

var work={
    //查询数据
    search:function () {
        //需要先引入 jquery.serializejson.js 才可以使用这个方法
        var params = searchForm.serializeJSON();
        employeeGrid.datagrid('load',params);
    },
    add:function () {
      //添加数据(弹出添加的模态框)
    },
    edit:function () {
       //修改数据(弹出修改的模态框)
    },
    del:function () {
       //删除数据
        //拿到选中的这条数据
        var row = employeeGrid.datagrid("getSelected");
        if(row){
            $.messager.confirm('确认框', '确定要狠心删除我么?', function(r){
                if (r){
                    //进行删除
                    $.get("/employee/delete",{id:row.id},function (result) {
                        if(result.success){
                            $('#employeeGrid').datagrid('reload');
                        }else{
                            //alert("删除失败");
                            $.messager.alert('提示信息','删除失败!，原因:'+result.msg,"error");
                        }
                    })
                }
            });
        }else{
            $.messager.alert('提示信息','请选择一行再进行删除!','info');
        }
    },
    }, 
    save:function () {
       //保存数据
    }
}

controller层

public abstract class BaseController {
    public static final String SUCCESS = "success";
}

EmployeeController

@RequestMapping("/delete")
@ResponseBody
public Map delete(Long id){
    Map<String,Object> map = new HashMap<>();
    try {
        employeeService.delete(id);
        map.put(SUCCESS, true);
    } catch (Exception e) {
        e.printStackTrace();
        map.put(SUCCESS, false);
        map.put("msg", e.getMessage());
    }
    return map;
}

2.添加修改

$.extend($.fn.validatebox.defaults.rules, {
    equals: {
        validator: function(value,param){
            return value == $(param[0]).val();
        },
        message: '两次密码匹配.'
    }
});
//验证扩展：用户名是否可以重复使用
$.extend($.fn.validatebox.defaults.rules, {
    checkUsername: {
        validator: function(value,param){
            var employeeId = $("#employeeId").val();
            var result = $.ajax({
                type: "GET",
                url: "/employee/checkUsername",
                data:{username:value,id:employeeId},
                async: false //同步
            }).responseText;
            return result=="true";
        },
        message: '用户名不能重复.'
    }
});
…
var work={
    //查询数据
    search:function () {
        //需要先引入 jquery.serializejson.js 才可以使用这个方法
        var params = searchForm.serializeJSON();
        employeeGrid.datagrid('load',params);
    },
    //添加数据(弹出添加的模态框)
    add:function () {
        //如果有data-save属性，我们把它展示出来
        $("*[data-save]").show();
        //启动有data-save属性的input元素的验证功能
        $("*[data-save] input").validatebox("enable"); 
       employeeForm.form("clear");//清除数据
        //弹出表单窗口
        employeeDialog.dialog("center").dialog('open');
    },
    //修改数据(弹出修改的模态框)
    edit:function () {
        //选中了某一条数据才删除
        var row = employeeGrid.datagrid("getSelected");
        if(row){
            //隐藏有data-save属性的元素
            $("*[data-save]").hide();
            //禁用有data-save属性的input元素的验证功能
            $("*[data-save] input").validatebox("disable");

            employeeForm.form("clear");//清除数据
            employeeDialog.dialog("center").dialog('open');
            //单独解决部门的回显问题
            if(row.department){
                row["department.id"] = row.department.id;
            }
            //为form加载数据
            $("#employeeForm").form("load",row);
        }else{
            $.messager.alert('提示信息','请选择一行再进行修改!','info');
        }
    },
save:function () {
    var url  = "/employee/save";
    var id = $("#employeeId").val();
    if(id){
        url = "/employee/update";
    }
    employeeForm.form('submit', {
        url:url,
        onSubmit: function(){
            //做验证
            return $("#employeeForm").form("validate");
        },
        success:function(data){
            var result = JSON.parse(data);//转成相应的json数据
            if(result.success) {
                $('#employeeGrid').datagrid('reload');
            }else{
                $.messager.alert('提示信息','操作失败!，原因:'+result.msg,"error");
            }
            employeeDialog.dialog('close');
        }
    })
}
    …
}

3.数据丢失问题

在URL后面添加一个参数,在修改时会传到后台,然后后台判断是保存还是修改

save:function () {
        var url  = "/employee/save";
        var id = $("#employeeId").val();
        if(id){
            url = "/employee/update?cmd=update";
        }

@ModelAttribute("editEmployee")
public Employee beforeEdit(Long id, String cmd){
    //有id的时候-> 修改功能
    if(id!=null && "update".equals(cmd)) {
        Employee employee = employeeService.findOne(id); 
        return employee;
    }
    return null;
}

解决n-to-n问题

[外链图片转存失败(img-kG6QNaoh-1563673228836)(file:///C:\Users\ADMINI~1\AppData\Local\Temp\ksohtml15100\wps1.jpg)]

@ModelAttribute("editEmployee")
public Employee beforeEdit(Long id, String cmd){
    //有id的时候-> 修改功能
    if(id!=null && "update".equals(cmd)) {
        Employee employee = employeeService.findOne(id);
        //把这个要修改的关联对象设置为null,可以解决n-to-n的问题
        employee.setDepartment(null);
        return employee;
    }
    return null;
}

ls(cmd)) {
Employee employee = employeeService.findOne(id);
//把这个要修改的关联对象设置为null,可以解决n-to-n的问题
employee.setDepartment(null);
return employee;
}
return null;
}