我在我的表中使用 WebAPI(JSON),我需要在 bootstrap-table 中使用 datetimepicker 过滤“日期”。请。谁来帮帮我。
注:时间戳是需要过滤的日期
表 - 这是在我的表中调用 WebApi
var WebApi = "http://track.asiacom.co.th/fmswebapi/api/posinfo";
$(document).ready(function () {
$('#report').bootstrapTable({
idField: 'PosID',
url: WebApi,
columns: [{
field: 'PosID',
title: 'id',
class: 'hidden-xs hidden-sm hidden-md hidden-lg hidden-desktop'
}, {
field: 'Asset',
title: 'Vehicle'
}, {
field: 'Tag',
title: 'Device'
}, {
field: 'Location',
title: 'Location'
}, {
field: 'Timestamp',
title: 'Timestamp',
formatter: timestampFormatter
}, {
field: 'Battery',
title: 'Battery'
}, {
field: 'Engine',
title: 'Engine',
formatter: engineFormatter
}, {
field: 'Ignition',
title: 'Ignition',
formatter: ignitionFormatter
}]
});
});
HTML - 这是 datetimepicker 表单
<input id="dateFrom" type="text" class="form-control" placeholder="DD-MMM-YYYY HH:MM">
<input id="dateFrom" type="text" class="form-control" placeholder="DD-MMM-YYYY HH:MM"><br/>
<input id="dateTo" type="text" class="form-control" placeholder="DD-MMM-YYYY HH:MM">
<small class="text-muted pull-left">To</small>
Javascript
$('#dateFrom').datetimepicker({
format: 'dd-M-yyyy hh:ii:ss P',
autoclose: 'true',
todayBtn: 'true',
todayHighlight: 'true',
keyboardNavigation: 'true'
});
$('#dateTo').datetimepicker({
format: 'dd-M-yyyy hh:ii:ss P',
autoclose: 'true',
todayBtn: 'true',
todayHighlight: 'true',
keyboardNavigation: 'true'
});
转换日期
function timestampFormatter(value, row) {
var t = value;
function convertUTCDateToLocalDate(date) {
var newDate = new Date(date.getTime() + date.getTimezoneOffset() * 60 * 1000);
var offset = date.getTimezoneOffset() / 60;
var hours = date.getHours();
newDate.setHours(hours - offset);
return newDate;
}
var date = convertUTCDateToLocalDate(new Date(t));
var timestamp = moment(date.toLocaleString()).format("D-MMM-YYYY, hh:mm:ss A");
return '<div>' + '<span><i class="fa fa-clock-o hidden-xs hidden-md"></i> ' + timestamp + '</span>' + '</div>';
}