前端向后端 ajax 传递对象数组的 json 数据

1.后端部分

实体类 Table对象 包含实体类 Column对象 数组

public class Table {
	private String tableName;
	private Column[] columns;

	 // 省略 set() get() ......

        @Overrides
	public String toString() {
		return "Table{" +
				"tableName='" + tableName + '\'' +
				", columns=" + Arrays.toString(columns) +
				'}';
	}
}

public class Column {
	private String columnName;
	private String dataType;
	private String dataLength;
    
        // 省略 set() get() ......
        
        @Override
	public String toString() {
		return "Column{" +
				"columnName='" + columnName + '\'' +
				", dataType='" + dataType + '\'' +
				", dataLength='" + dataLength + '\'' +
				'}';
	}
}

2.前端部分

用户在前台表单输入数据库表的相关信息,点击Creat Table按钮调用前台JavaScript函数传输数据

前端 JavaScript 代码

// 获取字符串
function getTableName() {
    var table = $("#tableName").val();
    return table;
}

// 获取对象数组
function getColumns() {
    var columns= new Array();
    for(var i = 0; i <= LineCont; i++) {
        var column= new Object();
        column.lineName = $("#column" + i + " " + "#columnName").val();
        column.dataType = $("#column" + i + " " + "#dataType").val();
        column.dataLength = $("#column" + i + " " + "#dataLength").val();
        columns.push(line);
    }
    return columns;
}

// 传输数据
function creatTable() {
    var tableName = getTableName();    
    var columns = getColumns();        

    $.ajax({
        url:"creatTableAction",
        type:"post",
        data:JSON.stringify({
            tableName:tableName,    // 字符串
            columns:columns}),      // 对象数组
        contentType: "application/json;charset=UTF-8",
        dataType:"json"
    });
}      

3. 后端接收数据

 // 后台接收方法,使用SpringMVC框架
 @RequestMapping("/creatTableAction")
 @ResponseBody
 public void creatTable(@RequestBody Table table) {
     System.out.println(table.toString());
 }

方法内toString()打印数据

Table{
tableName='user', 
columns=[Column{columnName='userName', dataType='VARCHAR', dataLength='20'}, 
        Column{columnName='userId', dataType='VARCHAR', dataLength='20'}, 
        Column{columnName='gender', dataType='CHAR', dataLength='1'}, 
        Column{columnName='address', dataType='VARCHAR', dataLength='60'}]
}

可见包含对象数组的json数据已经被成功接收到了