ajax提交复杂对象数据

Posted 太白的技术博客

tags:

篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了ajax提交复杂对象数据相关的知识,希望对你有一定的参考价值。

public class RouteItemManageReq {
    private List<WorkNodeReq> targetNodes;
    private RouteItemReq obj;
    public List<WorkNodeReq> getTargetNodes() {
        return targetNodes;
    }
    public void setTargetNodes(List<WorkNodeReq> targetNodes) {
        this.targetNodes = targetNodes;
    }
    public RouteItemReq getObj() {
        return obj;
    }
    public void setObj(RouteItemReq obj) {
        this.obj = obj;
    }
}
    public @ResponseBody List<SpiderBaseRespCenterExt> pushAddRouteItem(RouteItemManageReq req,Model model) {
        return nodeManageService.pushAddRouteItem(req);
    }

要在ajax中提交类似这样的结构,不能直接将js直接附加到ajax请求的data上,否则不管是数组还是属性都会以obj[prop][subprop]的方式传递到服务端,导致spring mvc无法解析而报错。

所以,如果在ajax中需要通过拼接成string的方式传递。类似如下:

            for(var x=0;x<targetNodes.length;x++) {
                formData = formData + "targetNodes[" + x + "].clusterName=" + targetNodes[x].split(":")[0] + "&";
                formData = formData + "targetNodes[" + x + "].ip=" + targetNodes[x].split(":")[1] + "&";
                formData = formData + "targetNodes[" + x + "].port=" + targetNodes[x].split(":")[2] + "&";
            }
            formData = formData + "obj.routeItem.serviceId=" + $("#myModal-route input[name=‘serviceId‘]").val() + "&";
            formData = formData + "obj.routeItem.systemId=" + $("#myModal-route input[name=‘systemId‘]").val() + "&";
            formData = formData + "obj.routeItem.subSystemId=" + $("#myModal-route input[name=‘subSystemId‘]").val() + "&";
            formData = formData + "obj.routeItem.appVersion=" + $("#myModal-route input[name=‘appVersion‘]").val() + "&";
            formData = formData + "obj.routeItem.companyId=" + $("#myModal-route input[name=‘companyId‘]").val() + "&";
            formData = formData + "obj.routeItem.clusterName=" + $("#myModal-route input[name=‘clusterName‘]").val();

            $.ajax({
                url: "/middle/00000110.json",    //请求的url地址
                dataType: "json",   //返回格式为json
                // async: false, //请求是否异步,默认为异步,这也是ajax重要特性
                data: formData,    //参数值
                type: "GET",   //请求方式

 

以上是关于ajax提交复杂对象数据的主要内容,如果未能解决你的问题,请参考以下文章

spring mvc接收ajax提交的JSON数据,并反序列化为对象

html 输入类型提交通常在单击时重新加载页面。此片段使输入不重新加载页面以便进行ajax调用

向后台提交数据:通过form表单提交数据需刷新网页 但通过Ajax提交数据不用刷新网页可通过原生态Ajax或jqueryAjax。Ajax代码部分

ajax传递数组form表单提交对象数组

使用ajax提交form表单

jQuery选取所有复选框被选中的值并用Ajax异步提交数据