1.首先前端需使用ajax传递参数，使之序列化传递到后台

<script>
	$(function () {
		//提交按钮的单击事件
		$("#btnAdd").click(function () {
			$.ajax({
				type: "POST",
				url: "/team/add.do",
				data: $("#myForm").serialize(),
				dataType:"json",
				success: function(vo){
					if(vo.code==200) {
						window.location.href = "/pages/team/list.html";
					}else{
						alert("添加失败！"+vo.msg);
					}
				}
			});
		});
	});
</script>

2.后台使用控制器接收数据，注意传参方式，入参方式，以及string-Date可能的类型转换

@RequestMapping(value = "add.do",method = RequestMethod.POST)
    public ResultVo<Team> teamAdd(Team team){
        System.out.println(team.toString());
        Integer integer = teamService.addTeam(team);
        if (integer > 0) {
            return new ResultVo<Team>();
        }
        return new ResultVo<Team>("500","服务器内部错误，请稍后再试");
    }

这里使用封装对象类，入参

3.service层事务插入

	@Override
    @Transactional(propagation = Propagation.REQUIRED,rollbackFor = {Exception.class})
    public Integer addTeam(Team team){
        return teamMapper.insertSelective(team);
    }

二，更新
1.原始数据加载，这里使用js脚本

queryById(teamId);
function queryById(teamId) {
		$.ajax({
			type: "GET",
			url: "/team/"+teamId+".do", //RESTful风格的API定义
			data: "",
			success: function (vo) {
				console.log(vo);
				let obj=vo.object;
				let teamId=obj.teamId;
				let teamLogo=obj.teamLogo;
				let teamName=obj.teamName;
				let chineseName=obj.chineseName;
				let coach=obj.coach;
				let stadium=obj.stadium;
				let location=obj.location;
				let time=obj.createTime;
				let area=obj.area;
				$("input[name='teamId']").val(teamId);
				$("input[name='teamName']").val(teamName);
				$("input[name='chineseName']").val(chineseName);
				$("input[name='coach']").val(coach);
				$("input[name='stadium']").val(stadium);
				$("input[name='location']").val(location);
				$("input[name='createTime']").val(time);
				$("select[name='area']").val(area);
				if(teamLogo!=null){
					$("img[name='teamLogo']").attr("src","/img/uploadFile/"+teamLogo);
				}else{
					$("img[name='teamLogo']").addClass("hidden");
					$("img[name='teamLogo']").parent().html("还没有上传logo图片");
				}
			}
		});
	}

2.控制器入参

	@RequestMapping(value = "{id}.do",method = RequestMethod.GET)
    public ResultVo<Team> teamQueryById(@PathVariable("id") Integer teamId){
        Team team = teamService.queryById(teamId);
        System.out.println(team.toString());
        if (team != null && !team.getTeamName().equals("")) {
            return new ResultVo<Team>(team);
        }
        return new ResultVo<Team>("500","服务器内部错误，请稍后再试");
    }

3.service实现

	@Override
    @Transactional(propagation = Propagation.REQUIRED,readOnly = true)
    public Team queryById(Integer integer){
        return teamMapper.selectByPrimaryKey(integer);
    }

4.修改数据的put请求 在mvc中，如果使用Restful风格，用put来修改数据，那么，在Ajax添加请求时，应当注意：

$(function () {
		//根据地址获取teamId,如果null则执行增加，否则执行更新
		let url = document.location.toString();//获取URL
		let teamId=url.GetValue("teamId");
		let pageNum=url.GetValue("pageNum");
		let pageSize=url.GetValue("pageSize");
		//alert(teamId);
		//根据id查询要更新的球队信息并回显到页面
		queryById(teamId);
		//提交按钮的单击事件--实现真正的更新
		$("#btnUpdate").click(function () {
			$.ajax({
				type: "POST",//这里必须写POST
				url: "/team/"+teamId+".do",
				data: $("#myForm").serialize()+"&_method=PUT",
				dataType:"json",
				success: function(vo){
					if(vo.code==200) {
						window.location.href = "/pages/team/list.html?pageNum="+pageNum+"&pageSize="+pageSize;
					}else{
						alert("更新失败！"+vo.msg);
					}
				}
			});
		});
	});

ajax请求必须使用post

data: $("#myForm").serialize()+"&_method=PUT",只有添加了&_method=PUT，才会被spring识别为put请求。

成功不要忘记添加页数，实现定位

控制层标识方法为put访问

	@RequestMapping(value = "{id}.do",method = RequestMethod.PUT)
    public ResultVo<Team> teamUpdate(@PathVariable("id") Integer teamId,Team team){
        team.setTeamId(teamId);
        System.out.println(team.toString());
        Integer integer = teamService.updateTeam(team);
        if (integer == 1) {
            return new ResultVo<Team>(team);
        }
        return new ResultVo<Team>("500","服务器内部错误，请稍后再试");
    }

注意前端页面如果teamId设置为disabled，那么值是取不到的，需要从url路径传递参数过来，再复制到封装对象中去。

team.setTeamId(teamId);

5.service层根据对象动态更新变化

teamMapper.updateByPrimaryKeySelective(team);

三，软删除

service层使用动态更新软删除方式，删除数据

	@Override
    @Transactional(propagation = Propagation.REQUIRED,rollbackFor = {Exception.class})
    public Integer deleteTeam(Integer teamId){
        Team team = teamMapper.selectByPrimaryKey(teamId);
        team.setIsDel(1);
        return teamMapper.updateByPrimaryKeySelective(team);
    }

控制层使用delete请求方式

	@RequestMapping(value = "{id}.do",method = RequestMethod.DELETE)
    public ResultVo<Team> teamDelete(@PathVariable("id") Integer teamId){
        Integer integer = teamService.deleteTeam(teamId);
        if (integer == 1) {
            return new ResultVo<>();
        }
        return new ResultVo<>("500","服务器内部错误，请稍后再试");
    }

3.前端ajax请求的数据注意标识

//删除按钮
	function deleteTeam(id) {
		if(confirm("确定要删除吗?")) {
			//发起异步请求
			$.ajax({
				type: "POST",
				url: "/team/" + id+".do",//RESTful风格的API定义
				data: "_method=DELETE",
				success: function (vo) {
					if(vo.code==200){
						loadData();
					}else{
						alert("删除失败！"+vo.msg);
					}
				}
			});
		}
	}