html-table - 如何在Struts 2中提交多个Line Item？

Question

我有一个购买请求表单，它动态创建 ItemName、quantity、specification、unit 行> 测量。

我有一个名为“添加项目”的单按钮，它可以动态创建新行。

当我提交此表单时，如何将其放入 Struts2 中的 Action 类中。

JSP:

    <table id="itemDetails" width="100%">
    <tr  width="100%" cellpadding="0" cellspacing="0" border="1" >
    <th ><center>+</center></th>
    <th >Item</th>
    <th >Specification</th>
    <th >Quantity</th>
    <th >Unit Of Measurement</th>
    <th >Operations</th>
    </tr>

    <s:iterator value="id" status="ctr" >
     <tr>
      <td  width="5%"><input type="checkbox"  name="rdel"  ><br><br></td>
      <td  width="30%" ><input  type="text" name="id[%{#ctr.index}].itemname" /></td>
      <td  width="30%"><input type="text" name="id[%{#ctr.index}].specification"  ></td>                      
      <td  width="20%"><input type="text" name="id[%{#ctr.index}].quantity" ></td>
      <td  width="5%"><input type="text"  name="id[%{#ctr.index}].uom" ></td>
      <td  width="10%"><a href="#" >Delete</a></td>
     </tr>
    </s:iterator>
    </table>

用于动态行创建的Javascript:

<SCRIPT language="javascript">
function addRow(itemDetails) {

    var table = document.getElementById(itemDetails);

    var rowCount = table.rows.length;

    var row = table.insertRow(rowCount);
    var counts=rowCount-1;


    var cell1 = row.insertCell(0);
    var check = document.createElement("input");
    check.type = "checkbox";
    check.name="rdel";
    cell1.appendChild(check);

    var cell2 = row.insertCell(1);
    var item = document.createElement("input");
    item.type = "text";
    item.name="id.item";
    cell2.appendChild(item);

    var cell3 = row.insertCell(2);
    var specification = document.createElement("input");
    specification.type = "text";
    specification.name="id.specification";
    cell3.appendChild(specification);

    var cell4 = row.insertCell(3);
    var quantity = document.createElement("input");
    quantity.type = "text";
    quantity.name="id.quantity";
    cell4.appendChild(quantity);

    var cell5 = row.insertCell(4);
    var uom = document.createElement("input");
    uom.type = "text";
    uom.name="id.uom";
    cell5.appendChild(uom);

    var cell6 = row.insertCell(5);
    var operations = document.createElement("a");
    operations.setAttribute("href","#");
    operations.innerText="Delete";
    cell6.appendChild(operations);


}

</SCRIPT>

Action类方法:

 private List<ItemDetails> id;
 public List<ItemDetails> getId(){

    return this.id;
 }

 public void setId(List<ItemDetails> id) {
    this.id = id;
 }

 public String savePurchaseRequest(){
  try{

      setId(getId());   

   for(ItemDetails itemdetails:id ) {
       System.out.println( itemdetails.getItemname() + ":" + itemdetails.getSpecification() +":"+ itemdetails.getQuantity()+ ":"+ itemdetails.getUom() );
    }

    }catch(Exception e){
      System.out.println("Exception:"+e);
    }

  return SUCCESS;
 }

和ItemDetails类:

public class ItemDetails implements java.io.Serializable {

private String itemname;

private String specification;

private String quantity;

private String uom;



public ItemDetails() {

}



public ItemDetails(String itemname, String specification, String quantity, String uom) {

this.itemname = itemname;

this.specification = specification;

this.quantity = quantity;

this.uom = uom;

}




}



public String getItemname() {

return this.itemname;

}



public void setItemname(String itemname) {

this.itemname = itemname;

}



public String getSpecification() {

return this.specification;

}



public void setSpecification(String specification) {

this.specification = specification;

}



public String getQuantity() {

return this.quantity;

}



public void setQuantity(String quantity) {

this.quantity = quantity;

}



public String getUom() {

return this.uom;

}



public void setUom(String uom) {

this.uom = uom;

}




}

Answer 1

你就快到了。

只需更改分配 name 属性的 Javascript 部分，包括与迭代中完全相同的索引:

item.name="id.item";
specification.name="id.specification";
// ecc...

必须成为

item.name="id["+counts+"].itemname";
specification.name="id["+counts+"].specification";

你会做得很好。