英文:
getting Ids from selected checkboxes in a table using Spring + Thymeleaf
问题
我遇到了一个错误,NotReadablePropertyException:bean类的无效属性'userIds'。我不确定为什么会出现这个错误。如果我在复选框上移除th:field属性,表格就会正确填充。我已经尝试了th:field="*{requestIds}"和th:field="*{requestIds.ids}"。
表单
public class ListOfIds {
   List<Long> ids = new ArrayList<>();
   public List<Long> getIds() { return ids; }
// 我已经尝试过单独和一起使用set方法。
   public void setIds(List<Long> ids) { this.ids = ids; }
   public void setIds(Long[] ids) { this.ids = Arrays.asList(ids); }
}
请求bean
public class Request {
   long id;
   String name;
   String phone;
   String email;
   // Getter和Setter
}
控制器
@GetMapping("/myTable")
public ModelAndView getMyTable(ModelAndView mav) {
   mav.setViewName("myTable");
   List<Request> requests = service.getRequests();
   mav.addObject("requests", requests);
   mav.addObject("requestIds", new ListOfIds());
   return mav;
}
@PostMapping("/myTable")
public ModelAndView postRequests(ModelAndView mav, @ModelAttribute("requestIds") ListOfIds ids) {
   ...
}
HTML页面
...
<form method="post" th:action="@{/myTable}" th:object="${requestIds}">
   <table class="table ...">
      <thead>
      <tr>
         <th><input type="checkbox" class="selectall" data-target="requests-all"/></th>
         <th>Name</th>
         <th>Phone</th>
         <th>Email</th>
      </tr>
      </thead>
      <tbody>
      <tr role="row" th:each="request : ${requests}">
         <td>
            <input type="checkbox" name="requestId" data-target="requests-all" 
                   th:value="${request.id}" th:field="*{requestIds}"/>
         </td>
         <td th:text="${request.name}"></td>
         <td th:text="${request.phone}"></td>
         <td th:text="${request.email}"></td>
      </tr>
      </tbody>
   </table>
   <button class="btn btn-primary show-selected">Process</button>
</form>
...
<script>
$(document).ready(function() {
   $('button').click(function(e) {
      if (!(confirm("Are you sure you wish to process these requests"))) {
         e.preventDefault();
      }
   });
});
</script>
...
英文:
I'm getting an error NotReadablePropertyException: Invalid property 'userIds' of bean class [...ListOfIds]...  And I'm not sure why. If I remove the th:field attribute on the checkbox, the table fills in properly. I've tried with th:field="*{requestIds}" and th:field="*{requestIds.ids}"
What I'm trying to do is collect the list of ids from the selected checkboxes and pass them back to the controller for the post.
Form
public class ListOfIds {
   List<Long> ids = new ArrayList<>();
   public List<Long> getIds() { return ids; }
// I've tried both set methods by themselves and together.
   public void setIds(List<Long> ids) { this.ids = ids; }
   public void setIds(Long[] ids) { this.ids = Arrays.asList(ids); }
}
Request bean
public class Request {
   long id;
   String name;
   String phone;
   String email;
   // Getters/Setters
}
Controller
@GetMapping("/myTable")
public ModelAndView getMyTable(ModelAndView mav) {
   mav.setViewName("myTable");
   List<Request> requests = service.getRequests();
   mav.addObject("requests", requests);
   mav.addObject("requestIds", new ListOfIds());
   return mav;
}
@PostMapping("/myTable")
public ModelAndView postRequests(ModelAndView mav, @ModelAttribute("requestIds") ListOfIds ids) {
   ...
}
html page
...
<form method="post" th:action="@{/myTable}" th:object="${requestIds}">
   <table class="table ...">
      <thead>
      <tr>
         <th><input type="checkbox" class="selectall" data-target="requests-all"/></th>
         <th>Name</th>
         <th>Phone</th>
         <th>Email</th>
      </tr>
      </thead>
      <tbody>
      <tr role="row" th:each="request : ${requests}">
         <td>
            <input type="checkbox" name="requestId" data-target="requests-all" 
                   th:value="${request.id}" th:field="*{requestIds}"/>
         </td>
         <td th:text="${request.name}"></td>
         <td th:text="${request.phone}"></td>
         <td th:text="${request.email}"></td>
      </tr>
      </tbody>
   </table>
   <button class="btn btn-primary show-selected">Process</button>
</form>
...
<script>
$(document).ready(function() {
   $('button').click(function(e) {
      if !(confirm("Are you sure you wish to process these requests")) {
         e.preventDefault();
      }
   });
});
</script>
...
答案1
得分: 1
所以答案是,name 和 th:field 不能很好地一起使用。
我进行了以下更改,然后它就可以工作了:
控制器
@PostMapping("/myTable")
public ModelAndView postRequests(ModelAndView mav, 
                                 @ModelAttribute("requestIds") Long[] ids) {
   ...
}
HTML
<form id="postMyTable" method="post" th:action="@{/myTable}">
<table ...
     <input type="checkbox" name="requestId" data-target="requests-all" 
                   th:value="${request.id}"/>
...
<script>
   $(document).ready(function() {
   $('button').click(function(e) {
      if (!(confirm("Are you sure you wish to process these requests"))) {
         e.preventDefault();
      } else {
         $("#postMyTable").submit();
      }
   });
});
</script>
英文:
So the answer is that name and th:field don't play nice together.
I made the following changes and it worked:
Controller
@PostMapping("/myTable")
public ModelAndView postRequests(ModelAndView mav, 
                                 @ModelAttribute("requestIds") Long[] ids) {
   ...
}
html
<form id="postMyTable" method="post" th:action="@{/myTable}">
<table ...
     <input type="checkbox" name="requestId" data-target="requests-all" 
                   th:value="${request.id}"/>
...
<script>
   $(document).ready(function() {
   $('button').click(function(e) {
      if !(confirm("Are you sure you wish to process these requests")) {
         e.preventDefault();
      } else {
         $("#postMyTable").submit();
      }
   });
});
</script>
通过集体智慧和协作来改善编程学习和解决问题的方式。致力于成为全球开发者共同参与的知识库,让每个人都能够通过互相帮助和分享经验来进步。


评论