使用Ajax提交包含对象集合(数组)的对象到后台

/ 0 条评论 / 408人阅读

使用ajax提交对象时,要注意的坑非常的多少,比如属性名不对之类的细节错误,不出现还好,出现就是砸电脑

1、实体类

Role.java

@Entity
@Data
public class SysRole {

  @Id
  @Column(name="role_id")
  private Long roleId;
  @Column(name="role_name")
  private String roleName;
  @Column(name="role_desc")
  private String roleDesc;
  @Column(name="role_flag")
  private Long roleFlag;

  @ManyToMany(targetEntity = SysRight.class)
  @JoinTable(name = "sys_role_right",
  joinColumns = @JoinColumn(name = "rf_role_id",referencedColumnName = "role_id"),
  inverseJoinColumns = @JoinColumn(name = "rf_right_code",referencedColumnName = "right_code"))
  private List<SysRight> rights;

}


Right.java

@Entity
@Data
@Table(name="sys_right")
public class SysRight {

  @Id
  @Column(name="right_code")
  private String rightCode;
  @Column(name="right_parent_code")
  private String rightParentCode;
  @Column(name="right_type")
  private String rightType;
  @Column(name="right_text")
  private String rightText;
  @Column(name="right_url")
  private String rightUrl;
  @Column(name="right_tip")
  private String rightTip;

}


2、Controller层

@RequestMapping(value="edit.html", method = RequestMethod.POST)
    @ResponseBody
    public String modify(@RequestBody(required = true) SysRole role){
        boolean saved = sysRoleService.saveOrUpdate(role);
        if(saved){
            return "{\"result\":\"true\"}";
        }
        return "{\"result\":\"false\"}";
    }


在这里使用到了RequestBody注解,这个注解是必须的,作用是可以将json数据中的属性绑定到对象上,不写可能会报415异常,或者是属性绑定不到对象,导致空指针

3、前台

$("#send").on("click", function () {
            var arr = $('#treeview-checkable').treeview("getChecked");
            var rights = new Array();

            var roleId = $("#roleId").val();
            var roleName = $("#roleName").val();
            var roleDesc = $("#roleDesc").val();

            $.each(arr, function (idx, node) {
                rights.push(node.data);
            });

            var role = {
                roleId: roleId,
                roleName: roleName,
                roleDesc: roleDesc,
                rights: rights
            };

            $.ajax({
                "url": js_ctx + "/role/edit.html",
                "type": "post",
                "data": JSON.stringify(role),
                "dataType": "json",
                "contentType": "application/json",
                "success": function (data) {
                    if (data.result == "true") {
                        window.location.href = js_ctx + "/role/list.html";
                    }
                }
            });

        })


重点在于 “data”: JSON.stringify(role),“contentType”: “application/json”,这两句代码,要注意data属性,由于设置的是json数据,所以不用写大括号和key,这点比较操蛋,很多人容易忽略这点导致400,而"contentType": "application/json"是将数据以json格式传输到后台(下图所示)

在这里插入图片描述

如果出现400或者415,可能是以下几点原因:

1、Controller方法的参数中没有使用RequestBody注解

2、前台对象的属性和后台实体类的属性对应不上

3、没有写contentType:application/json

4、ajax方法的data属性没写正确

5、设置了某些ajax方法的属性,导致数据乱码了,比如变成了ascll码


Responses /