JavaScript — проблема даты и времени плагина FooTable
Я создал динамическую таблицу, используя плагин FooTable jQuery. http://jsbin.com/wasawa/edit
Здесь я использовал метку времени MySQL, используя PHP date('Y-m-d H:i:s') формат. например- 2016-01-19 01:22:13, но с помощью FooTable я не получаю фактический формат даты.
Любая помощь будет оценена.
Решение
Обновлен объект столбцов, как показано ниже:
{
"name": "createdat",
"title": "Created On",
"formatter": function(value){
return moment(value).format('MMM Do YY');
}
}
Я должен обновить функцию форматирования.
И теперь он работает нормально, как и ожидалось.
Спасибо за вашу поддержку.
Другие решения
В случае, если это помогает кому-то еще с той же проблемой. Мне удалось получить пример с сайта, используя следующее. Вы должны включить moment.js, чтобы это работало. https://momentjs.com/
Этот код не запускается в средстве выполнения кода SO, так как footable требует localalstorage.
Он отображает время Unix из внешнего источника, как вы хотите. У меня это с помощью MMM Do YY в этом примере.
jQuery(function($) {
$('#showcase-example-22').footable({
"useParentWidth": true,
columns: [
{
"name": "id",
"title": "ID",
"breakpoints": "xs sm",
"type": "number",
"style": {
"width": 80,
"maxWidth": 80
}
},
{
"name": "firstName",
"title": "First Name"},
{
"name": "lastName",
"title": "Last Name"},
{
"name": "something",
"title": "Never seen but always around",
"visible": false,
"filterable": false
},
{
"name": "jobTitle",
"title": "Job Title",
"breakpoints": "xs sm",
"style": {
"maxWidth": 200,
"overflow": "hidden",
"textOverflow": "ellipsis",
"wordBreak": "keep-all",
"whiteSpace": "nowrap"}
},
{
"name": "started",
"title": "Started On",
"type": "numeric",
"breakpoints": "xs sm md"},
{
"name": "dob",
"title": "Date of Birth",
"formatter": function(value) {
var datetime = JSON.parse(value)
return moment(datetime).format("MMM Do YY")
}
},
{
"name": "status",
"title": "Status"}
],
rows: [{
"id": 1,
"firstName": "Annemarie",
"lastName": "Bruening",
"something": 1381105566987,
"jobTitle": "Cloak Room Attendant",
"started": 1367700388909,
"dob": 122365714987,
"status": "Suspended"},
{
"id": 2,
"firstName": "Nelly",
"lastName": "Lusher",
"something": 1267237540208,
"jobTitle": "Broadcast Maintenance Engineer",
"started": 1382739570973,
"dob": 183768652128,
"status": "Disabled"},
{
"id": 3,
"firstName": "Lorraine",
"lastName": "Kyger",
"something": 1263216405811,
"jobTitle": "Geophysicist",
"started": 1265199486212,
"dob": 414197000409,
"status": "Active"},
{
"id": 4,
"firstName": "Maire",
"lastName": "Vanatta",
"something": 1317652005631,
"jobTitle": "Gaming Cage Cashier",
"started": 1359190254082,
"dob": 381574699574,
"status": "Disabled"},
{
"id": 5,
"firstName": "Whiney",
"lastName": "Keasler",
"something": 1297738568550,
"jobTitle": "High School Librarian",
"started": 1377538533615,
"dob": -11216050657,
"status": "Active"},
{
"id": 6,
"firstName": "Nikia",
"lastName": "Badgett",
"something": 1283192889859,
"jobTitle": "Clown",
"started": 1348067291754,
"dob": -236655382175,
"status": "Active"}
]
});
});<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery-footable/3.1.4/footable.min.js"></script>
<link href="https://cdnjs.cloudflare.com/ajax/libs/jquery-footable/3.1.4/footable.bootstrap.css" rel="stylesheet" /><table id="showcase-example-1" class="table" data-paging="true" data-filtering="true" data-sorting="true" data-editing="true" data-state="true"></table><script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery-footable/3.1.4/footable.js"></script>enter code here