Spring MVC 和 javascript(添加 Rows 函数) 绑定

Posted 2023-02-22

【中文标题】Spring MVC 和 javascript(添加 Rows 函数) 绑定

【英文标题】：Spring MVC and java script(addRows function) binding

【发布时间】：2012-10-07 07:40:32

【问题描述】：

我对 Spring MVC 中的 javascript 函数绑定有疑问/问题。根据我们的要求，当用户单击“添加”按钮时，我需要在表格中插入一个新行。

第 1 步：因此，当用户单击“添加更多”按钮时，我在表格中插入了一个新行，我正在使用 javascript 处理此问题

第 2 步：当用户点击提交按钮时，我需要将用户输入的值发送到我的控制器（Spring MVC 控制器）。

那么如何将值动态绑定到控制器？

请帮我尽快解决这个问题。

【问题讨论】：

如果您提供表格 html、JavaScript 和控制器代码的示例，回答这个问题会更容易。

【参考方案1】：

我使用 LazyList 实现了这一点。

您需要按照以下方式执行此操作。

Operation.java

    package com.xxx.xxx.model;
// Generated Feb 9, 2012 11:30:06 AM by Hibernate Tools 3.2.1.GA


import java.util.ArrayList;
import java.util.List;

import javax.persistence.CascadeType;
import javax.persistence.Column;
import javax.persistence.Embedded;
import javax.persistence.Entity;
import javax.persistence.FetchType;
import javax.persistence.GeneratedValue;
import javax.persistence.Id;
import javax.persistence.JoinColumn;
import javax.persistence.ManyToOne;
import javax.persistence.OneToMany;
import javax.persistence.Table;

import org.apache.commons.collections.FactoryUtils;
import org.apache.commons.collections.list.LazyList;

@Entity
@Table(name="Operations"
    ,schema="dbo"

)
public class Operations  implements java.io.Serializable 


     private int operationId;
     @Embedded
     private Services services;
     private String operationName;
     private String isHqlsql;
     private String isMultipleTables;
     private String listOfTablesAffected;
     private String hqlQuery;
     private String typeOfOperation;
     private String operationDetail;
     private String inputVariables;
     private String outputparamdatatype;
     private String isCountQuery;
     private String isDynamicWhereQry;
     private String isPaginationRequired;
     private String biInputParameters;
    private List<OperationParameters> operationParameterses = LazyList
            .decorate(new ArrayList<OperationParameters>(),
                    FactoryUtils.instantiateFactory(OperationParameters.class));

    public Operations() 
    


    public Operations(int operationId, Services services, String operationName) 
        this.operationId = operationId;
        this.services = services;
        this.operationName = operationName;
    
    public Operations(int operationId, Services services, String operationName, String isHqlsql, String isMultipleTables, String listOfTablesAffected, String hqlQuery, String typeOfOperation, String operationDetail, String inputVariables, String outputparamdatatype, String isCountQuery, List operationParameterses) 
       this.operationId = operationId;
       this.services = services;
       this.operationName = operationName;
       this.isHqlsql = isHqlsql;
       this.isMultipleTables = isMultipleTables;
       this.listOfTablesAffected = listOfTablesAffected;
       this.hqlQuery = hqlQuery;
       this.typeOfOperation = typeOfOperation;
       this.operationDetail = operationDetail;
       this.inputVariables = inputVariables;
       this.outputparamdatatype = outputparamdatatype;
       this.isCountQuery = isCountQuery;
       this.operationParameterses = operationParameterses;
    

    @Id 
    @GeneratedValue
    @Column(name="operationId", unique=true, nullable=false)
    public int getOperationId() 
        return this.operationId;
    

    public void setOperationId(int operationId) 
        this.operationId = operationId;
    

    @ManyToOne(fetch=FetchType.LAZY)
    @JoinColumn(name="serviceId", nullable=false)
    public Services getServices() 
        return this.services;
    

    public void setServices(Services services) 
        this.services = services;
    

    @Column(name="operationName", nullable=false, length=250)
    public String getOperationName() 
        return this.operationName;
    

    public void setOperationName(String operationName) 
        this.operationName = operationName;
    

    @Column(name="isHQLSQL", length=50)
    public String getIsHqlsql() 
        return this.isHqlsql;
    

    public void setIsHqlsql(String isHqlsql) 
        this.isHqlsql = isHqlsql;
    

    @Column(name="isMultipleTables", length=50)
    public String getIsMultipleTables() 
        return this.isMultipleTables;
    

    public void setIsMultipleTables(String isMultipleTables) 
        this.isMultipleTables = isMultipleTables;
    

    @Column(name="listOfTablesAffected", length=500)
    public String getListOfTablesAffected() 
        return this.listOfTablesAffected;
    

    public void setListOfTablesAffected(String listOfTablesAffected) 
        this.listOfTablesAffected = listOfTablesAffected;
    

    @Column(name="hqlQuery")
    public String getHqlQuery() 
        return this.hqlQuery;
    

    public void setHqlQuery(String hqlQuery) 
        this.hqlQuery = hqlQuery;
    

    @Column(name="typeOfOperation", length=50)
    public String getTypeOfOperation() 
        return this.typeOfOperation;
    

    public void setTypeOfOperation(String typeOfOperation) 
        this.typeOfOperation = typeOfOperation;
    

    @Column(name="operationDetail")
    public String getOperationDetail() 
        return this.operationDetail;
    

    public void setOperationDetail(String operationDetail) 
        this.operationDetail = operationDetail;
    

    @Column(name="inputVariables", length=5000)
    public String getInputVariables() 
        return this.inputVariables;
    

    public void setInputVariables(String inputVariables) 
        this.inputVariables = inputVariables;
    

    @Column(name="outputparamdatatype", length=50)
    public String getOutputparamdatatype() 
        return this.outputparamdatatype;
    

    public void setOutputparamdatatype(String outputparamdatatype) 
        this.outputparamdatatype = outputparamdatatype;
    

    @Column(name="isCountQuery", length=10)
    public String getIsCountQuery() 
        return this.isCountQuery;
    

    public void setIsCountQuery(String isCountQuery) 
        this.isCountQuery = isCountQuery;
    

    public String getIsDynamicWhereQry() 
        return isDynamicWhereQry;
    


    public void setIsDynamicWhereQry(String isDynamicWhereQry) 
        this.isDynamicWhereQry = isDynamicWhereQry;
    


    public String getIsPaginationRequired() 
        return isPaginationRequired;
    


    public void setIsPaginationRequired(String isPaginationRequired) 
        this.isPaginationRequired = isPaginationRequired;
    

    public String getBiInputParameters() 
        return biInputParameters;
    


    public void setBiInputParameters(String biInputParameters) 
        this.biInputParameters = biInputParameters;
    

    @OneToMany(cascade=CascadeType.ALL, fetch=FetchType.LAZY, mappedBy="operations")
    public List<OperationParameters> getOperationParameterses() 
        return this.operationParameterses;
    

    public void setOperationParameterses(List<OperationParameters> operationParameterses) 
        this.operationParameterses = operationParameterses;
    

OperationParameters.java

package com.xxx.xxx.model;

// Generated Feb 9, 2012 11:30:06 AM by Hibernate Tools 3.2.1.GA


import javax.persistence.Column;
import javax.persistence.Entity;
import javax.persistence.FetchType;
import javax.persistence.GeneratedValue;
import javax.persistence.Id;
import javax.persistence.JoinColumn;
import javax.persistence.ManyToOne;
import javax.persistence.Table;

@Entity
@Table(name="OperationParameters"
    ,schema="dbo"

)
public class OperationParameters  implements java.io.Serializable 


     private int parameterId;
     private Operations operations;
     private String inputOutputParamName;
     private String inputOutputParamType;
     private String inputOutputParamDataType;

    public OperationParameters() 
    

    public OperationParameters(int parameterId, Operations operations, String inputOutputParamName, String inputOutputParamType, String inputOutputParamDataType) 
       this.parameterId = parameterId;
       this.operations = operations;
       this.inputOutputParamName = inputOutputParamName;
       this.inputOutputParamType = inputOutputParamType;
       this.inputOutputParamDataType = inputOutputParamDataType;
    

    @Id 
    @GeneratedValue
    @Column(name="parameterId", unique=true, nullable=false)
    public int getParameterId() 
        return this.parameterId;
    

    public void setParameterId(int parameterId) 
        this.parameterId = parameterId;
    
@ManyToOne(fetch=FetchType.LAZY)
    @JoinColumn(name="operationId", nullable=false)
    public Operations getOperations() 
        return this.operations;
    

    public void setOperations(Operations operations) 
        this.operations = operations;
    

    @Column(name="inputOutputParamName", nullable=false, length=250)
    public String getInputOutputParamName() 
        return this.inputOutputParamName;
    

    public void setInputOutputParamName(String inputOutputParamName) 
        this.inputOutputParamName = inputOutputParamName;
    

    @Column(name="inputOutputParamType", nullable=false, length=250)
    public String getInputOutputParamType() 
        return this.inputOutputParamType;
    

    public void setInputOutputParamType(String inputOutputParamType) 
        this.inputOutputParamType = inputOutputParamType;
    

    @Column(name="inputOutputParamDataType", nullable=false, length=250)
    public String getInputOutputParamDataType() 
        return this.inputOutputParamDataType;
    

    public void setInputOutputParamDataType(String inputOutputParamDataType) 
        this.inputOutputParamDataType = inputOutputParamDataType;
    

提供发布请求以添加新操作的控制器方法。

/**
     * Method that will serve the post request to add the operation and operation parameters submitted by the user.
     * @param operations
     * @param map
     * @return @link String The view name that will redirect to the get request to display the previous page with newly entered operation in the list. 
     */
    @RequestMapping(value="/add", method=RequestMethod.POST)
    public String addOperations(@ModelAttribute Operations operations, ModelMap map) 
        operations.getOperationParameterses().removeAll(Collections.singleton(null));

        for(int i=0; i<operations.getOperationParameterses().size(); i++) 
            System.out.println("parameterName :: " + ((OperationParameters)operations.getOperationParameterses().get(i)).getInputOutputParamName());
            if(((OperationParameters)operations.getOperationParameterses().get(i)).getInputOutputParamName() == null || "".equalsIgnoreCase((((OperationParameters)operations.getOperationParameterses().get(i))).getInputOutputParamName())) 
                operations.getOperationParameterses().remove(i);
                System.out.println("empty parameter removed....");
            
        

        return "redirect:/operations/" + operations.getServices().getServiceId();
    

希望对你有所帮助。

【讨论】：

一个JSP页面你是怎么添加动态行的？

【参考方案2】：

如果你创建一个适当的类来保存表单数据，Spring 可以绑定映射和对象列表，然后在你的控制器方法上使用 @ModelAttribute 注释。

例如，如果您的 JavaScript 创建如下表格行：

<tr>
    <td><input name="bells[0]" /></td>
    <td><input name="whistles[0]" /></td>
</tr>
<tr>
    <td><input name="bells[1]" /></td>
    <td><input name="whistles[1]" /></td>
</tr>

然后您可以创建一个模型类，其中包含 HTML 表单中每个重复字段的列表，如下所示：

public class AsapForm 
    private List<String> bells;
    private List<String> whistles;

    // add getters and setters here

然后您可以创建一个控制器方法，使用该类作为带有@ModelAttribute 注释的参数：

public void postAsapForm(@ModelAttribute("contactForm") AsapForm asapForm, BindingResult result) 
    ...

然后您可以使用asapForm.getBells() 和asapForm.getWhistles() 等访问每一行的值。

【讨论】：

这不会绑定动态添加的行。您必须使用特定数量的大小初始化列表。

【参考方案3】：

当我需要绑定来自前端的动态对象列表时，我会执行以下操作：

将数据发布为json array，即采用以下格式

数据：[a:1, b:2, a:3, b:4]

在Controller

@RequestMapping(value="save", method=RequestMethod.POST)
public void save(JSONObject object)

 List<YourType> list = new ArrayList<YourType>();
 JSONArray array = object.getJSONArray("data")
 for(int i=0; i<array.length(); i++)
 
   //getObjectFromJson is your method for converting json to an object of your type.
   list.add(JsonUtils.fromJson(array.getJSONObject(i).toString(), YourType.class);