Jquery ajax 提交序列化或JSON数据到后台

前端提交序列化数据

  • 前端代码
html 复制代码
$.ajax({
	url: "/user/add",
	type: "post",
	dataType: "json",
	data: {
	    user : $('#form').serialize()
	},
	success: function (result) {
	}
})
![在这里插入图片描述](https://i-blog.csdnimg.cn/direct/1f9a7611c2c84249bc317b0b6813af07.png)
  • 后台代码
java 复制代码
@ResponseBody
@RequestMapping("/add")
public Msg form(User user){
	userDao.insert(user); // 添加一条信息
}

前端提交json格式数据

  • 前端代码
html 复制代码
//定义serializeObject方法,序列化表单
function serializeObject(form) {
    let obj = {};
    let a = form.serializeArray();
    $.each(a, function () {
        if (obj[this.name]) {
            if (!obj[this.name].push) {
                obj[this.name] = [obj[this.name]];
            }
            obj[this.name].push(this.value || '');
        } else {
            obj[this.name] = this.value || '';
        }
    });
    return obj;
}

$.ajaxSetup({
    contentType: 'application/json',
});


/**
 * 添加修改数据,提交表单
 * @param path
 * @param aim
 */
function doAddUpdate(path, aim) {
    //阻止表单自动提交
    $("#addUpdateForm").submit(function () {
        return false;
    });
    let obj =  serializeObject($("#addUpdateForm"));
    $.post(path, JSON.stringify(obj), function (data) {
        if (data.code == 200) {
            alert(data.msg);
            window.location.href = aim;
        } else {
            alert(data.msg);
        }
    });
}

<button onclick="doAddUpdate('user/doAddUpdate','user/list')">post数据</button>
  • 后台代码
java 复制代码
@PostMapping("/doAddUpdate")
public ResultBean doAddUpdate(@RequestBody User user) {

}
相关推荐
大新新大浩浩20 小时前
docker-记录一次容器日志<container_id>-json.log超大问题的处理
docker·容器·json
侧耳倾听1113 天前
java json解析工具对比
java·开发语言·json
Jassy1593 天前
论坛系统自动化测试实战
python·selenium·单元测试·json
吾日三省吾码4 天前
用 3D 可视化颠覆你的 JSON 数据体验
人工智能·3d·json
几道之旅4 天前
配置文件,xml,json,yaml,我该选哪个?
xml·python·json
五步晦暝4 天前
【JSON 】全面掌握JSON的相关知识
json
A1-294 天前
QT之INI、JSON、XML处理
xml·c++·qt·json
cesske4 天前
uniapp打包报错:重新在manifest.json中生成自己的APPID
uni-app·json
测试工程喵6 天前
如何测试JWT的安全性:全面防御JSON Web Token的安全漏洞
前端·网络·功能测试·安全·json·接口测试·token
battlestar7 天前
WPF读取json文件,用到combox控件
json·wpf