ajax 以json形式提交表单
表单元素转JSON
自定义一个函数
$.fn.serializeObject = function()
{
var o = {};
var a = this.serializeArray();
$.each(a, function() {
if (o[this.name] !== undefined) {
if (!o[this.name].push) {
o[this.name] = [o[this.name]];
}
o[this.name].push(this.value || '');
} else {
o[this.name] = this.value || '';
}
});
return o;
};
ajax提交表单
$.ajax({
type : "POST",
url : "rest/role/new",
dataType : "json",
data : $("#form_add_roleRecord").serializeObject(),
success : function(data) {
alert("成功");
},
error : function(data) {
alert("失败");
console.log(data);
}
});
java后台接收
我的后台使用了spring mvc
//模型
public class Role {
private Long id;
private String roleName;
private String roleSign;
private String description;
public Long getId() {
return id;
}
public void setId(Long id) {
this.id = id;
}
public String getRoleName() {
return roleName;
}
public void setRoleName(String roleName) {
this.roleName = roleName == null ? null : roleName.trim();
}
public String getRoleSign() {
return roleSign;
}
public void setRoleSign(String roleSign) {
this.roleSign = roleSign == null ? null : roleSign.trim();
}
public String getDescription() {
return description;
}
public void setDescription(String description) {
this.description = description == null ? null : description.trim();
}
@Override
public String toString() {
return "Role [id=" + id + ", roleName=" + roleName + ", roleSign=" + roleSign + ", description=" + description + "]";
}
}
//控制器
@Controller
@RequestMapping(value = "/role")
public class RoleController {
@RequestMapping(value = "/new", method = RequestMethod.POST, produces = { "application/json;charset=UTF-8" })
@ResponseBody
public String newRecord(Role role, HttpServletRequest request) {
try {
System.out.println(role.toString());
} catch (Exception e) {
e.printStackTrace();
}
return "{\"success\":\"true\"}";
}
}
//输出
Role [id=null, roleName=testaa, roleSign=user:create, description=]
毛宇鹏V
只有不断学习,才有转变的机会.
推荐阅读
Html 打印模板 (带页眉页脚)
{代码...}
毛宇鹏阅读 1.7k
再也不学AJAX了!(三)跨域获取资源 ① - 同源策略
「再也不学 AJAX 了」是一个以 AJAX 为主题的系列文章,希望读者通过阅读本系列文章,能够对 AJAX 技术有更加深入的认识和理解,从此能够再也不用专门学习 AJAX。本篇文章为该系列的第四篇,最近更新于 2023 年 1...
libinfs赞 19阅读 4.1k评论 4
再也不学 AJAX 了!(一)AJAX 概述
跨域获取数据:介绍了与「跨域发送 AJAX 请求」相关的一些内容:例如「同源策略」与四种跨域请求资源的方式:JSONP,CORS,postMessage 和 WebSocket;
libinfs赞 22阅读 4k评论 6
从JQuery出发总结的关于原型使用上的一些浅薄理解
MyObj本身是一个对象,可以通过MyObj.doit()的方式调用其上的方法或属性为了实现需求,第一反应是: {代码...} 然后在MyObj上挂载静态方法,在MyObj.prototype上挂载对象方法。
zxl20070701赞 4阅读 361
再也不学AJAX了!(二)使用AJAX ② Fetch API
「再也不学 AJAX 了」是一个以 AJAX 为主题的系列文章,希望读者通过阅读本系列文章,能够对 AJAX 技术有更加深入的认识和理解,从此能够再也不用专门学习 AJAX。本篇文章为该系列的第三篇,最近更新于 2023 年 1...
libinfs赞 2阅读 873
Ajax实现搜索联想 搜索关键词提醒 无刷新搜索
通过javascript监听搜索框的内容,调用后端即可。(1)javascript监听搜索框的内容(2)把搜索框的关键词传给后端进行搜索(3)搜索到结果,遍历到页面
TANKING赞 1阅读 4.7k
【永久开源】Pear Admin Layui 基于 Layui 的后台管理模板
Pear Admin Layui 是基于 Layui 的后台管理系统模板,扩展Layui原生UI样式,整合第三方开源组件,提供便捷快速的开发方式,延续LayuiAdmin的设计风格,持续完善的样式与组件的维护,基于异步Ajax的菜单构建,相对...
就眠仪式赞 2阅读 7.1k评论 1
**粗体** _斜体_ [链接](http://example.com) `代码` - 列表 > 引用
。你还可以使用@
来通知其他用户。