Question

我想使用ajax帖子提交表单，并避免刷新页面。我正在使用Spring和Jquery。

有人如何通过ajax提交表单并使用控制器中的类来执行操作？

模型类是拍卖（我试图提交的那个）：

public class Auction {

    private int id;
    private int userId;
    private String dateStart;
    private String dateEnd;
    private double maxPrice;
    private boolean payed;
    private boolean delivered;
    private boolean scheduledTaskParsed;
    private SimpleRegisteredUser user;
    private WantedProduct wantedProduct;
    (...)
}

并且WantedProduct类是

public class WantedProduct {
    private int id;
    private String title;
    private String description;
    private int userId;
    private int productStateId;
    private String stateDescription;
    private int productTypeId;
    private String brand;
    private String brandURL;
    (...)
}

提交表格是：

<form:form id="new-auction" modelAttribute="auction" action="/product/create/" method="post" enctype="multipart/form-data">
    <form:hidden path="id"/>
    <form:input path="wantedProduct.title" id="title" maxlength="300" placeholder="${nameLabel}*"/>
    <form:input id="uploadFile" path="wantedProduct.photosWantedProduct[0].photo.photoFile" type="file"  accept="image/*"/>
    <form:select id="productTypeSelect" path="wantedProduct.productTypeId" >                                                                                                                        
         <c:forEach var="t" items="${types}">                                                                                                               
            <form:option value="${t.id}">
                <spring:message code="${t.description}"/>
            </form:option>
          </c:forEach>                                          
    </form:select>      
    <form:input path="wantedProduct.brand" id="brand" placeholder=""/>      
    <form:input path="maxPrice"/>                                                   
    <form:input path="wantedProduct.description"/>      
    <form:select path="wantedProduct.productStateId" >                                                                                                                      
         <c:forEach var="state" items="${productStates}">                                                                                                               
            <form:option value="${state.id}">
                <spring:message code="${state.description}"/>
            </form:option>
          </c:forEach>                                          
    </form:select>      

    (...)   
</form:form>

谢谢

Answer 1

在尝试了许多解决方案后，我想出了。

首先我将表格序列化：

app.controller("myFarmController", function($scope, $http, Data) {
  Data.farm.idFarm = 5;
  $scope.Data = Data;
}

然后我解析了这个字符串以转换成这样的数组：

var formFields = $('*:not(.no-serialize)', '#new-auction').serialize();

最后我称之为ajax方法：

var fieldArray = convertToArray(formFields);

function getUrlVars(url,isInt) {
    var hash;
    var myJson = {};
    var hashes = url.slice(url.indexOf('?') + 1).split('&');
    for (var i = 0; i < hashes.length; i++) {
        hash = hashes[i].split('=');
        if(hash[0] !='language'){                
            myJson = processsField(hash[0],hash[1],myJson,isInt);
        }           
    }
    return myJson;
}

function processsField(key,value,myJson,isInt){

    if(key.indexOf('.')>0){
        keys = key.split('.');
        myJson[keys[0]] = processsField(keys[1],value,myJson[keys[0]],isInt);
    } else{    
        if(myJson === undefined){
            myJson = {};
        }
        myJson[key] = value.length>0?(isNaN(value) || isInt.indexOf(key) < 0 ?value.toString():Number(value)):null;    
    }
    return myJson;
}

这样，控制器将类Auction作为输入，一切都像魅力一样！

谢谢你的一切!!

在Spring MVC页面中使用Ajax提交表单

1 个答案: