Question

目标

我有一个数据表（只是文本），在jsp页面加载时检索。我试图让当前包含文本的单元格变成一个文本框，如果单击该文本框，则将其包含在文本框中。有一个＆＃34;更新＆＃34;和＆＃34;删除＆＃34;每行末尾的按钮。更新将传递行当前具有的任何文本到控制器的更新方法（正常工作）。删除会将密钥（我指定为该密钥的那一行中的任何单元格）传递给控制器的删除方法（由于问题＃2而无法工作）。我对控制器类，spring或JSP和JavaScript前端以外的任何问题都没有任何问题。

问题

（所有这些问题都将通过一个最新的示例项目来解决，该项目允许在 HTML表中使用裸地进行就地编辑，删除和插入表行-minimum JavaScript。我已经阅读了很多例子，这些例子要么创建100％JavaScript / jQuery / jTable / etc的表，要么使用HTML表，但没有我描述的基本功能。）

我无法弄清楚如何制作包含文字的单元格，将其转换为包含原始文本的输入文本框。我可以显示带有文本的单元格，也可以显示包含原始文本的文本框的单元格，但不能以交互方式显示。我尝试了不同的JS示例，这些示例都存在我无法解决的问题，主要是因为它们是出于其他目的而略有相似的目的。
我无法弄清楚如何制作两种不同的表单，并且它们各自的提交按钮对同一数据起作用。我有一个每行的表单，并在行的末尾有两个提交按钮，＆＃34;更新＆＃34;和＆＃34;删除＆＃34;。我只能让他们中的一个一次工作，因为我不知道如何将一个提交按钮与更新相关联，同时将另一个按钮，＆＃34;删除＆＃34;，与执行删除操作。
正如您将在控制器代码中看到的，出于某种原因，我必须拥有控制器中的model.addAttribute("row", myService.retrieveRecords().get(0));即使此调用：model.addAttribute("records", myService.retrieveRecords());已填充每一行。如果没有额外的代码，我就不会理解如何完成同样的事情。
我无法弄清楚如何在表格底部放置一行空文本框，可用于向表中添加新行。我尝试复制当前显示行的方式（作为文本框），只是空值，但是Java抱怨<td><form:input path="cell1" value="${row.cell1}"/></td>中的路径变量与我创建的新空行完全相同。

当前代码

JSP

<body>
<div align="center">
    <table border="1" cellpadding="5">
        <caption><h2>TABLE</h2></caption>
        <tr>
            <th>CELL1</th>
            <th>CELL2</th>
            <th>CELL3</th>
            <th></th>
            <th></th>
        </tr>
        <c:forEach var="row" items="${records}">        
            <tr>
                <form:form class="data-form" method="post" action="updateRow" modelAttribute="row">
                    <td><form:input path="cell1" value="${row.cell1}"/></td>
                    <td><form:input path="cell2" value="${row.cell2}"/></td>
                    <td><form:input path="cell3" value="${row.cell3}"/></td>
                    <td><input type="submit" value="UPDATE"/></td>
                    <td><input type="submit" value="DELETE"/></td>
                </form:form>
            </tr>
        </c:forEach>
    </table>
</div>
</body>

控制器

// "C".R.U.D.
@RequestMapping(value = "/addRow", method = RequestMethod.POST)
public String handleCreateRecordRequest(@ModelAttribute("record") TodoListRecord record, Model model) {
    myService.createRecord(record);
    return HOME_PAGE_REDIRECT;
}

// C."R".U.D.
@RequestMapping(value = "/home", method = RequestMethod.GET) // 
public String handleRetrieveRecordsRequest(Model model) throws IOException {
    // This has to be in here or it complains that row is null, even though records populates row...     
    model.addAttribute("row", myService.retrieveRecords().get(0)); 
    model.addAttribute("records", myService.retrieveRecords());
    return HOME_PAGE;
}

// C.R."U".D.
@RequestMapping(value = "/updateRow", method = RequestMethod.POST)
public String handleUpdateRecordRequest(@ModelAttribute("row") TodoListRecord row, Model model) {
    myService.updateRecord(row);
    return HOME_PAGE_REDIRECT;
}

// C.R.U."D".
@RequestMapping(value = "/deleteRow", method = RequestMethod.POST)
public String handleDeleteRecordRequest(@ModelAttribute("key") String key, Model model) {
    myService.deleteRecord(key);
    return HOME_PAGE_REDIRECT;
}

Java JSP SpringMVC：无法使表格单元格可编辑

0 个答案: