Spring Boot与Thymeleaf使用复选框添加对象到列表 如何仅保留选中项

问题根因 #

你当前使用Thymeleaf的索引[__${stat.index}__]绑定列表字段，Spring MVC参数绑定过程中，会自动为列表中所有未提交的索引位置填充空Ingredient对象或Null值，导致最终列表长度等于页面展示的所有配料总数，未选中的位置就会出现空条目。

可行解决方案 #

方案1：后端直接过滤空条目（改动最小，适配现有逻辑） #

无需修改前端代码，仅需在Controller的提交处理逻辑中新增过滤步骤，剔除无效空条目即可。
修改后的Controller代码如下：

@PostMapping("/formula-details")
public String addFormulaDetails(@ModelAttribute("ingredientListWrapper") IngredientListWrapper ingredientListWrapper, Model model) {
    Formula formula = new Formula();
    // 新增过滤逻辑：仅保留ID不为空的有效选中配料
    List<Ingredient> validIngredients = ingredientListWrapper.getIngredientListWrapper()
            .stream()
            .filter(ingredient -> ingredient != null && ingredient.getIngredientId() != null)
            .toList();
    formula.setIngredients(validIngredients);
    model.addAttribute("formula", formula);
    return "Add-Formula-Form";
}

方案2：优化绑定逻辑（更规范，避免无效数据传输） #

如果不想提交无效的空参数，可以调整绑定逻辑，直接提交选中的配料ID，后端再批量查询完整配料对象：

1. 首先修改IngredientListWrapper类，新增选中ID存储字段：

public class IngredientListWrapper {
    // 原有字段保留
    private List<Ingredient> ingredientListWrapper;
    // 新增字段存储选中的配料ID
    private List<Long> selectedIngredientIds;

    // 补充对应getter、setter方法
}

2. 修改Thymeleaf表单的复选框绑定逻辑：

<input type="checkbox" th:field="*{selectedIngredientIds}" th:value="${ingredient.ingredientId}">

3. 调整后端Controller处理逻辑：

@PostMapping("/formula-details")
public String addFormulaDetails(@ModelAttribute("ingredientListWrapper") IngredientListWrapper ingredientListWrapper, Model model) {
    Formula formula = new Formula();
    // 根据选中的ID批量查询对应配料对象
    List<Ingredient> validIngredients = ingredientService.listByIds(ingredientListWrapper.getSelectedIngredientIds());
    formula.setIngredients(validIngredients);
    model.addAttribute("formula", formula);
    return "Add-Formula-Form";
}

内容的提问来源于stack exchange，提问作者Stone