Bạn có chắc chắn muốn xóa bài viết này không ?
Bạn có chắc chắn muốn xóa bình luận này không ?
Html5 DateTime + Ajax Jquery + SpringBoot @JsonFormat example
https://grokonez.com/frontend/html-5/html5-datetime-ajax-jquery-springboot-jsonformat-example
Html5 DateTime + Ajax Jquery + SpringBoot @JsonFormat example
In the tutorial, JavaSampleApproach will show you how to build an web application with Html5 DateTime + Jquery Ajax + SpringBoot @JsonFormat
.
Related posts:
I. Technologies
– Java 1.8
– Maven 3.6.1
– Spring Tool Suite – Version 3.8.1.RELEASE
– Html 5
– JQuery Ajax
– Bootstrap
– Spring Boot – 1.5.7.RELEASE
II. Html5 DateTime + Ajax Jquery + SpringBoot
For working with time input, Html5 support a set of new Input Types:
- date
- datetime-local
- time
- week
- To bind data from Html5 date input with JQuery, we use
new Date()
:
$("#taskForm").submit(function(event) {
// Prevent the form from submitting via the browser.
event.preventDefault();
// get data from submit form
var formTask = {
taskName : $("#taskName").val(),
startTime : new Date($("#startTime").val()),
endTime : new Date($("#endTime").val())
}
- To display
Date
object with customized format, we can use someDate
methods as below code
function timeFormat(date){
if(date instanceof Date){
var isoDate = date.getFullYear() + '-' + (date.getMonth() + 1) + '-' + date.getDate();
var time = date.toLocaleString('en-US', { hour: 'numeric',minute:'numeric', hour12: true });
return isoDate + ' @ ' + time;
}else{
return "";
}
}
- When exchange data between client to server, Json format is used by
JSON.stringify()
, andDate
objects will be converted to String type with UTC standard format.
https://grokonez.com/frontend/html-5/html5-datetime-ajax-jquery-springboot-jsonformat-example
Html5 DateTime + Ajax Jquery + SpringBoot @JsonFormat example





