我遇到了一个可能与HTML和Thymeleaf有关的问题。我还附上了场景的截图。
当我将字段类型更改为type="text"时，带有type="date"的输入字段只显示dd/mm/yyyy，然后它显示日期。我希望它显示日期，而不管type="date"，以便在编辑记录时，用户可以看到以前的日期。
第一个屏幕截图是读取模式。出生日期字段的值为type="text"。
x1c 0d1x的数据
第二个屏幕截图是编辑模式。你可以看到日期是不可见的。此处输入字段为type="date"。

的
以下是我的Thymeleaf模板片段，与此特定字段相关。

<div class="mb-3">
     <label for="dob" class="form-label">Date of Birth</label>
     <input type="date" th:field="*{dob}" class="form-control" id="dob" name="dob">
</div>

字符串
最有可能的是，任何人都需要看的代码就是这个。其余的都是要插入、读取等的标准代码。

public class Student {

    private Optional<LocalDate> dob;

    public Optional<LocalDate> getDob() {
        return dob;
    }

    public void setDob(Optional<LocalDate> dob) {
        this.dob = dob;
    }
}

型
我还想附上inspect元素的屏幕截图。你可以看到日期是正确的，但不知何故，日期选择器没有显示它。相反，它总是显示dd/mm/yyyy。
我想在选择器中显示现有的日期，以便用户可以很容易地看到下一步要更改的内容。
如果我们不设置任何日期在这里的编辑模式。不管存储在DB中的值是什么，它都将从UI中选择空日期并将其更新到DB。这很明显如果它持有选择器中的值，那么它可能不会这样做。任何想法都会很棒。

控制器

@GetMapping("/edit/student/{id}")
public String editStudentDetails(@PathVariable("id") Integer 
    studentId, Model model) {

    Student student = studentService.findStudent(studentId);

    model.addAttribute("student", student);
    model.addAttribute("editMode", true);

    return "editStudent";
}

@PostMapping("/update/student/{id}")
public String editStudentDetails(@PathVariable("id") Integer 
     studentId, Student student, Model model) {

    model.addAttribute("student", student);
    model.addAttribute("editMode", true);

    studentService.updateStudent(studentId, student);

    return "redirect:/view/student/"+studentId;
}

型

RowMapper

public class StudentRowMapper implements RowMapper<Student> {

    @Override
    public Student mapRow(ResultSet rs, int rowNum) throws SQLException {
        Student student = new Student();

        student.setId(rs.getInt("student_id"));
        student.setFirstName(rs.getString("first_name"));
        student.setLastName(rs.getString("last_name"));            
        student.setDob(Optional.ofNullable(rs.getDate
        ("date_of_birth")).map(java.sql.Date::toLocalDate));
        student.setGender(rs.getString("gender"));
        student.setAddress(rs.getString("address"));
        student.setEmail(rs.getString("email"));
        student.setPhoneNumber(rs.getString("phone_number"));
    
        return student;
    }

型

模板

editStudent.html

<div>
        <form th:action="@{/update/student/{id}(id=${student.id})}"
              th:object="${student}"
              th:method="POST"
              style="max-width: 500px; margin: 0 auto;">

            <div class="mb-3">
                <label for="dob" class="form-label">Date of Birth</label>
                <input type="date" th:field="*{dob}"  th:value="${{student.dob.orElse('')}}" class="form-control" id="dob" name="dob">
            </div>   

        </form>
    </div>

</div>

型

模板

viewStudent.html

<div class="mb-3">
    <label for="dob" class="form-label">Date of Birth</label>
    <input type="text" th:field="*{dob}" class="form-control" id="dob" name="dob" readonly>
</div>

型