输入类型=“日期”百里香 [英] Input type="date" thymeleaf
问题描述
我需要为我的实体添加日期，让用户以Web形式设置它。
此字段需要默认填写日期。
1。 < input type =datevalue =2016-08-01>
显示为默认设置的正确日期
2。 < input type =dateth：value =$ {startDate}>
显示没有任何值的日期选择器（注意：String startDate =2016-08-01;）
3。 < input type =dateth：field =$ {startDate}>
生成400错误（错误请求）（注意：Date startDate = new Date（）;） p>
所以问题是：如何使用百里香输入日期？
- 使用Date（）数据类型输入和存储这些数据？
- 我需要在表单中设置th：field？
- 我需要以同样的形式设置th：value？
我的控制器：
@RequestMapping（/ project_new）
public String createProject（Model model）{
Project project = new Project（）;
列表<角色> roles = mRoleService.findAll（）;
project.setStart（new Date（））;
model.addAttribute（page_title，创建项目）;
model.addAttribute（roles，roles）;
model.addAttribute（statuses，Status.values（））;
model.addAttribute（project，project）;
returnproject_new;
}
@RequestMapping（value =/ project_new，method = RequestMethod.POST）
public String createProject（@ModelAttribute Project project，Model model）{
//为project.rolesNeeded填充id字段
mRoleService.setRolesId（project.getRolesNeeded（））;
project.fixCollaboratorsAndRoles（）;
mProjectService.save（project）;
returnredirect：/;
}
我的模板：
< form th：action =@ {/ project_new}method =postth：object =$ {project}>
< div class =project-list single>
< label for =name> Name：< / label>
< input type =textid =namerequired =trueth：placeholder =* {name}th：value =* {name}th：field =* {name }/>
< label for =description>说明：< / label>
< textarea rows =5id =descriptiontype =textrequired =trueth：placeholder =* {description}th：value =* {description}th：field =* {description}/>
< label for =date-started>开始日期：< / label>
< input type =dateth：value =$ {project.start}th：field =$ {project.start}id =date-started/>
< div>
< label for =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 =checkboxth：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 =submitclass =button> Save< / button>
< a th：href =@ {/}class =button button-secondary>取消< / 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
私人状态;
@Column
私人日期开始;
@ManyToMany
@LazyCollection（LazyCollectionOption.FALSE）
私人列表<角色>角色需要
@ManyToMany
@LazyCollection（LazyCollectionOption.FALSE）
私人列表<协作者>合作者
public Date getStart（）{
return start;
}
public void setStart（Date start）{
this.start = start;
}
使用错误日志，它似乎是 String 到 java.util.Date 之间的转换问题。在Thymeleaf GitHub中搜索了一段时间之后，我发现了两个问题，可以在这种情况下解释如何处理：
从最后一点起，我添加了一个注释到项目类的开始日期：
//这是org.springframework.format.annotation.DateTimeFormat
@DateTimeFormat（pattern =yyyy-MM-dd）
private Date start;
之后，我可以在控制器POST方法中收到日期。
考虑到您还需要从模板中更改th：value和th：field属性，以从 $ {project.start} 到 * {start} ，就像我在名称和描述字段一样在评论中写的。
I need to add date to my entity and let the user set it in web form. This field needs to have today's date filled in by default.
1. <input type="date" value="2016-08-01">
shows correct date setted for default
2. <input type="date" th:value="${startDate}">
shows date picker without any value (note: String startDate = "2016-08-01";)
3. <input type="date" th:field="${startDate}">
generates 400 error (Bad request) (note: Date startDate = new Date();)
So, question is: how to use thymeleaf for input date?
- can I use Date() datatype for input and store such data?
- how I need to set "th:field" in form?
- how I need to set "th:value" in same form?
My controller(s):
@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:/";
}
My template:
<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>
Project entity:
@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;
}
Taking a look at the comment with the error log it seems to be a conversion problem between String to java.util.Date. After searching for a while in the Thymeleaf GitHub I saw two issues which can explain how to proceed in this case:
- Discussion of the conversion including date in this issue.
- Implementacion of the conversion is explained here.
From the last point, I added an annotation to the start date of your project class:
// This is "org.springframework.format.annotation.DateTimeFormat"
@DateTimeFormat(pattern = "yyyy-MM-dd")
private Date start;
And after that, I was able to receive the date in your controller POST method.
Take into account you also need to change your "th:value" and "th:field" attributes from your template for the date value from ${project.start} to *{start} as I wrote in the comments as you did for the name and description fields.
这篇关于输入类型=“日期”百里香的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
