如何编辑表格的字段？

Question

我有一个表格来显示一长串项目，我想知道如何编辑字段并提交表单以更新它们？

 <form name="edit" method="POST" action="edit">
    <table border="4">
        <tbody>
            <c:forEach items="${basket.items}" var="item">
                <tr>
                    <td>
                        <input name="item.id" value="${item.id}"/>  
                    </td>
                    <td>
                        <input label="Price" value="${item.product.price}"/>
                        <br/>
                    </td>
                </tr>
            </c:forEach>
        </tbody>
    </table> 
    this is a new one
   <input id="edit" type="submit" name="edit" value="Edit"/>
</form>

Answer 1

您正在使用 Struts2，使用 JSTL 和 EL 而不是 Struts Tags 和 OGNL...是否有特殊原因迫使您放弃大部分框架机制？

也就是说，您的输入无效（未指定类型）并且 HTML 中的“这是一个新的”句子似乎表明愿意插入新行，而不是编辑现有的条目。你的描述和你的代码似乎问了两个不同的事情......插入一个新的，只需调用另一个名为“add”而不是“edit”的动作（或另一个动作）方法，发送一个单一元素和将其添加到集合中。这里不需要使用 AJAX...

如果相反，问题是：

如何编辑字段并提交表单以更新它们？

就是这样：

<s:form method="POST" action="edit">
    <table border="4">
        <tbody>
            <s:iterator value="basket.items" var="item" status="ctr">
                <tr>
                    <td>
                        <s:textfield name="item[%{#ctr.index}].id" />
                    </td>
                    <td>
                        <s:textfield name="item[%{#ctr.index}].product.price" />
                    </td>
                </tr>
            </s:iterator>
        </tbody>
    </table> 
    <s:submit value="Edit"/>
</form>

Answer 2

我建议您使用 jquery 进行 AJAX 调用来更新新的。然后在成功处理程序中，您可以将新行附加到现有表中。在此之前，您需要为您的表提供正确的 id，以便更容易使用 JQUERY。

var newLine = document.createElement("tr");
var cellName = document.createElement("td");
$(cellName).text("itemId");
$(newLine).append(cellName);
// similarly create other td's
$("#modelTable").append(newLine);// replace modelTable by the id of your table