当前位置: 首页 > 知识库问答 >
问题:

输入type=“date”thymeleaf

董翰墨
2023-03-14

我需要向我的实体添加日期,并让用户在web表单中设置它。默认情况下,该字段需要填写今天的日期。

1. <input type="date" value="2016-08-01"> 

显示为默认值设置的正确日期

2. <input type="date" th:value="${startDate}"> 

显示没有任何值的日期选择器(注意:String startDate=“2016-08-01”;)

3. <input type="date" th:field="${startDate}"> 

生成 400 错误(错误请求)(注意:开始日期 = 新日期 ();)

那么,问题是:如何使用胸膜输入日期?

  • 我可以使用Date()数据类型输入和存储这些数据吗
  • 我需要如何在表单中设置“th:field”
  • 我需要如何以相同的形式设置“th:value”

我的控制器:

@RequestMapping("/project_new")
public String createProject(Model model) {
    Project project = new Project ();
    List<Role> roles = mRoleService.findAll();

    project.setStart(new Date());

    model.addAttribute("page_title", "create project");
    model.addAttribute("roles", roles);
    model.addAttribute("statuses", Status.values());
    model.addAttribute("project", project);
    return "project_new";
}

@RequestMapping(value = "/project_new", method = RequestMethod.POST)
public String createProject(@ModelAttribute Project project, Model model) {
    // Fill id field for project.rolesNeeded
    mRoleService.setRolesId(project.getRolesNeeded());
    project.fixCollaboratorsAndRoles();

    mProjectService.save(project);
    return "redirect:/";
}

我的模板:

<form th:action="@{/project_new}" method="post" th:object="${project}">
  <div class="project-list single">
    <label for="name">Name:</label>
    <input type="text" id="name" required="true" th:placeholder="*{name}" th:value="*{name}" th:field="*{name}"/>
    <label for="description">Description:</label>
    <textarea rows="5" id="description" type="text"  required="true" th:placeholder="*{description}" th:value="*{description}" th:field="*{description}"/>

    <label for="date-started">Date started:</label>
    <input type="date" th:value="${project.start}" th:field="${project.start}" id="date-started"/>

    <div>
      <label for="project_status">Project Status:</label>
      <div class="custom-select">
        <span class="dropdown-arrow"></span>
        <select th:field="*{status}" id="project_status">
          <option th:each="s : ${statuses}" th:value="${s}" th:text="${s}">Active</option>
        </select>
      </div>
    </div>

  <div class="roles-collaborators">
    <ul class="checkbox-list">
      <li th:if="${role.name} ne 'Undefined'" th:each="role : ${roles}">
      <input type="checkbox"  th:value="${role}" th:field="${project.rolesNeeded}" class="checkbox"/>
      <span th:text="${role.name}" th:value="${role}" class="checkbox">Developer</span>
      </li>
    </ul>
  </div>

  <div class="actions">
    <button type="submit" class="button">Save</button>
    <a th:href="@{/}" class="button button-secondary">Cancel</a>
  </div>
</div>
</form>

项目实体:

@Entity
public class Project {
@Id
@GeneratedValue(strategy = GenerationType.IDENTITY)
private Long id;

@NotNull
@Size (min = 3)
private String name;

@Column(columnDefinition="TEXT")
private String description;

@Column
private Status status;

@Column
private Date start;

@ManyToMany
@LazyCollection(LazyCollectionOption.FALSE)
private List<Role> rolesNeeded;

@ManyToMany
@LazyCollection(LazyCollectionOption.FALSE)
private List<Collaborator> collaborators;

public Date getStart() {
    return start;
}

public void setStart(Date start) {
    this.start = start;
}

共有3个答案

罗浩然
2023-03-14
@DateTimeFormat(pattern = "yyyy-MM-dd")
private Date date;

控制器类

pNow.setDate(new Date());
赵越
2023-03-14

使用字符串而不是日期:

@DateTimeFormat(pattern = "yyyy-MM-dd")
private String fromDate;
谭向晨
2023-03-14

查看带有错误日志的注释,似乎是字符串java.util.Date之间的转换问题。在百里香GitHub中搜索了一段时间后,我看到了两个问题,可以解释在这种情况下如何继续:

    < li >本期包括日期在内的转换讨论。 < li >下面介绍转换的实现。

从最后一点开始,我在项目类的开始日期添加了一个注释:

// This is "org.springframework.format.annotation.DateTimeFormat"
@DateTimeFormat(pattern = "yyyy-MM-dd")
private Date start;

之后,我可以在您的控制器POST方法中接收日期。

请注意,您还需要将日期值的模板中的th: valueth: field属性从${project.start}更改为*{start},就像我在评论中所写的那样,就像您对namedescription字段所做的那样。

 类似资料:
  • 我正在使用html5日期输入,但在新表单中Chrome没有正确显示完整值。格式是DD-MM-YYYY,但YYYY部分显示为空白。不过,我可以看到值在那里。 似乎输入右侧的空白是为控件保留的(交叉到清除值、上/下箭头、下拉箭头)。 我没有空间来扩大输入范围。如何使完整日期可见? 例子:http://jsfiddle.net/U6MYy/

  • 问题内容: 但它不起作用,如何设置默认值? 问题答案: 日期应采用格式。一位数的日期和月份应填充0。一月是01。 从文档中: 代表日期的字符串。 值:RFC3339中定义的有效完整日期,另外具有年份部分为四位或更多位数字表示大于0的数字的资格。 您的代码应更改为:

  • 我需要添加日期到我的实体,让用户设置在web形式。默认情况下,此字段需要填写今天的日期。 显示为默认值设置的正确日期 显示没有任何值的日期选择器(注意:String startDate=“2016-08-01”;) 生成400个错误(错误请求)(注意:Date startDate=new Date();) null 我的控制器: 我的模板: 项目实体:

  • 问题内容: tl; dr 我有一个输入,我想像仅使用CSS 的输入一样显示星星。 基本上我有一个带有以下输入的表单: 我没有生成表单,根本没有访问它的HTML的权限。但是,我确实可以将CSS应用于该页面。 我想要的是使其表现为,即-为用户输入的内容显示星号,而不是实际输入的文本。基本上,我希望该方面(用户输入的表示)看起来像一个字段。 由于这似乎只是一个演示问题,所以我认为必须使用CSS来解决此问

  • 我想在html表单中将用户输入限制为正数。 我知道您可以设置min=“0”,但是可以通过手动输入负数绕过此设置。 有没有其他方法可以解决这个问题而不用编写验证函数?

  • 输入[type=“datetime local”]行为在chrome 81和83之间发生了更改 论铬 在chrome 83上,这种行为已经改变:回车键触发日历的打开,并且没有键盘事件被触发(参见saucelabs上的行为)-chrome 83 以下代码(也在https://jsfiddle.net/os139hw6/) 显示keyup 13事件 我使用这个keyup 13事件来验证/提交数据,但这