Spring Boot + Bootstrap + Thymeleaf 单选按钮答案

【问题标题】：Spring Boot + Bootstrap + Thymeleaf Radio ButtonSpring Boot + Bootstrap + Thymeleaf 单选按钮
【发布时间】：2021-11-21 23:24:49
【问题描述】：

我的 Thymeleaf 模板中有这段代码：

<form action="#"
      th:action="@{/update/{id}(id=${user.id})}"
      th:object="${user}"
      method="post"
      enctype="multipart/form-data">

 <tr th:each="pic: ${pics}" >
                        <td class="col_name" >
                            <div class="box small">
                                <img th:src="'pics/' + ${user.id} + '/' + ${pic}"/>
                            </div>
                        </td>
                        <td class="col_actions">
                            <a style="color:#808080; margin-right: 10px;">
                                <input type="radio" th:field="*{mainPicture}" th:value="${pic}" >Main picture<br>
                            </a>
                        </td>
                        <td class="col_actions">
                            <a href="#" style="color:#808080;  text-align: center;"  >
                                <i class="fa fa-times" aria-hidden="true" ></i>
                            </a>
                        </td>
                    </tr>

查看源代码：

<td class="col_actions">
                            <a style="color:#808080; margin-right: 10px;">
                                <input type="radio" value="7e7f6887-c0ce-4dc3-bb95-2b9ef92fc903.jpg" id="mainPicture1" name="mainPicture" >Main picture<br>
                            </a>
                        </td>
                        <td class="col_actions">
                            <a href="#" style="color:#808080;  text-align: center;"  >
                                <i class="fa fa-times" aria-hidden="true" ></i>
                            </a>
                        </td>
                    </tr>
                    <tr >
                        <td class="col_name" >
                            <div class="box small">
                                <img src="pics/5/7e92cc5c-73e7-451b-9ee8-2ae43c1b0125.jpg"/>
                            </div>
                        </td>
                        <td class="col_actions">
                            <a style="color:#808080; margin-right: 10px;">
                                <input type="radio" value="7e92cc5c-73e7-451b-9ee8-2ae43c1b0125.jpg" id="mainPicture2" name="mainPicture" >Main picture<br>
                            </a>
                        </td>

...

在控制器上：

@PostMapping("/update/{id}")
    public String updateUser(@PathVariable("id") long id, @Valid UserPayload userPayload,
            BindingResult result, Model model) {


        System.out.println("===================");
        System.out.println( userPayload.getMainPicture());
        System.out.println("===================");

..
}


@Data
@Builder
@NoArgsConstructor
@AllArgsConstructor
@JsonInclude(NON_NULL)
public class UserPayload implements Serializable {

    private Long id;

    // pics
    private System mainPicture;
...
}

但为空，在模板中我检查了 id="mainPicture2"

【问题讨论】：

问题是什么？
或者更好，什么是你不想为null的null？
请分享更多上下文。模板中的<form> 标签是什么样子的？在@Controller 类中处理表单的方法是什么样的？ UserPayload 类的外观如何？你表现得好像你的问题是关于百里香的，而事实并非如此。渲染的输入既有名称又有值——这就是他们所需要的。 Thymeleaf 按预期工作。除非您提供 java 代码 sn-ps，否则无法判断您的错误在哪里。

标签： java html spring-boot spring-mvc thymeleaf

【解决方案1】：

您的UserPayload 类中的类型有误。而不是：

private System mainPicture;

...你应该有：

private String mainPicture;

当您更改类型时，值会正确绑定，System.out.println( userPayload.getMainPicture()); 将打印 7e92cc5c-73e7-451b-9ee8-2ae43c1b0125.jpg 而不是 null。

编辑：

我会稍微扩展我的答案。

我假设 System 被错误地用来代替 String。

否则，例如System 是你的一类——那么你的问题就会缩小到反序列化问题。有从表单传递给控制器的纯文本值（即"7e92cc5c-73e7-451b-9ee8-2ae43c1b0125.jpg"）。 Java 应该知道如何将这样的文本绑定到您的mainPicture 变量。如果mainPicture 是您的任何自定义类型，那么它不再是一个简单的分配。接受单个 String 参数的构造函数可能就足够了。

【讨论】：