提交给Spring控制器的JSP表单提交复选框

我想用Spring和JSP创建一个'待办事项列表'类型的Web应用程序。我的tasks.jsp页面显示数据库中的任务列表。一些JSON被传递给视图并用于通过tasks.js中的JS函数创建HTML表格。导致以下观点：提交给Spring控制器的JSP表单提交复选框

我现在希望能够选择通过复选框（看到每一行的右侧）任务，并删除那些选择行。任务表是一个表单，“删除选定的”按钮用于提交表单。

我使用传递到视图中的任务JSON（ID）作为每个复选框的值的字段，因此每个人都有与特定行关联的唯一值。

当我点击'删除所选'时，我可以验证一个复选框的值提交给我的控制器，因为我在taskDelete()中打印出该值。

我的问题是，即使检查多个框，也只会打印一个值。我怎样才能让我的表单提交已经检查过的所有复选框值的列表？

TaskController.jsp

package com.petehallw.todolist.main; 

@Controller 
public class TaskController { 

    private static final String TASKS = "/tasks"; 
    private static final String DELETE_TASK = TASKS + "/delete"; 

    @Autowired 
    private TaskEntityDao taskEntityDao; 

    ObjectMapper mapper = new ObjectMapper(); 

    @RequestMapping(value = TASKS, method = RequestMethod.GET) 
    public ModelAndView readTasks() 
    { 
     List<TaskEntity> tasks = taskEntityDao.readAllTasks(); 
     String tasksJson; 

     try { 
      tasksJson = mapper.writeValueAsString(tasks); 
      return new ModelAndView("tasks", "tasksJson", tasksJson); 
     } catch (IOException e) { 
      // ... 
     }  
    } 

    @RequestMapping(value = DELETE_TASK, method = RequestMethod.POST) 
    public String taskDelete(@ModelAttribute("selectedTasks") String selectedTasks) 
    {   
     System.out.println(selectedTasks); 
     return "taskDeleted"; 
    } 
}

tasks.jsp

<%@taglib uri = "http://www.springframework.org/tags/form" prefix = "form"%> 
<html> 
<head> 
<link rel="stylesheet" type="text/css" href="${pageContext.request.contextPath}/css/stylesheet.css"> 
<script type="text/javascript" src="${pageContext.request.contextPath}/js/jquery-1.8.3.js"></script> 
<script src="${pageContext.request.contextPath}/js/tasks.js"></script> 
</head> 
<body> 
    <h2>My Tasks</h2> 
    <div> 
     <form:form action = "tasks/delete"> 
      <table> 
       <tbody id="tasks_table_body"/> 
      </table> 
      <div> 
       <input type = "submit" value = "Delete Selected"/> 
       <input type = "submit" value = "Do something else"/> 
      </div> 
     </form:form> 
    </div> 
    <br> 
    <div class="actions"> 
     <a href="addTask">Add Task</a> 
    </div> 

    <!-- Populate tasks table. --> 
    <script type="text/javascript"> 
     taskJsonToTable(${tasksJson}); 
    </script> 

</body> 
</html>

tasks.js

/** 
* Populate the tasks table from JSON. 
* @param tasksJson A JSON array representing the tasks data from the database. 
*/ 
function taskJsonToTable(tasksJson) 
{ 
    var tableBody = document.getElementById('tasks_table_body'); 

    var tableHeaders = "<tr><th>Title</th>" 
      + "<th>Description</th>" 
      + "<th>Due Date</th>" 
      + "<th>Priority</th>" 
      + "<th>Select</th></tr>"; 

    /* Add the table headers to the table. */ 
    tableBody.innerHTML += tableHeaders; 

    for (var i = 0; i < tasksJson.length; i++) 
    {  
     var tableContent = "<tr>"; 

     tableContent += "<td>" + tasksJson[i].title + "</td>" 
       + "<td>" + tasksJson[i].description + "</td>" 
       + "<td>" + tasksJson[i].dueDate.toString() + "</td>" 
       + "<td>" + tasksJson[i].priority + "</td>" 
       + "<td><input type='checkbox' name='selectedTasks' value='" + 
       + tasksJson[i].taskId + "'" 
       + "/></td></tr>"; 

     /* Add the table row to the table. */ 
     tableBody.innerHTML += tableContent; 
    } 
}

来源

2017-08-08 petehallw

你可以使用数组的String [] selectedTasks控制器获得多个复选框具有相同的名称。并且访问每一个，使用它们的索引selectedTasks [0]。 –

@GurkanYesilyurt这似乎不工作 - 我仍然得到一个返回值。我尝试了'taskDelete（@ModelAttribute（“selectedTasks”）String [] selectedTasks）'，然后检查数组的长度，该数组仍然是1，并且选中了多个框。 – petehallw

你有没有尝试过'taskDelete（@RequestParam String [] selectedTasks）'？ –

更换

taskDelete(@ModelAttribute("selectedTasks") String[] selectedTasks)

到

taskDelete(@RequestParam String[] selectedTasks)

来源

2017-08-08 14:49:31

提交给Spring控制器的JSP表单提交复选框

回答

相关问题