前端向后端 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數據已經被成功接收到了