我正在尝试弄清楚如何将 DateTime 值呈现为短字符串或以 dd/mm/yyyy 格式呈现。我尝试了 DateCreated.Value.ToShortDateString() 和 DateCreated.ToShortDateString()，但似乎没有为 DataTable 定义
我当前的输出看起来像 2017-04-23T17:39:20.687
如何在 DataTable 中将其呈现为 dd/mm/yyyy？
@model IEnumerable<TestApp.Models.Announcement>
@{
ViewBag.Title = "Announcement List";
Layout = "~/Views/Shared/_Layout.cshtml";
}
<h2>AnnouncementList</h2>
@Html.ActionLink("New Announcement", "New", "Annoucement", null, new {@class = "btn btn-primary"})
<table id="announcement" class="table table-bordered table-hover">
<thead>
<tr>
<th>Title</th>
<th>Description</th>
<th>Date Created</th>
<th>Delete</th>
</tr>
</thead>
<tbody></tbody>
</table>
@section scripts
{
<script>
$(document).ready(function() {
var table = $("#announcement").DataTable({
ajax: {
url: "/api/announcements",
dataSrc: ""
},
columns: [
{
data: "title",
render: function(data, type, announcement) {
return announcement.title;
}
},
{
data: "description",
render: function(data, type, announcement) {
return announcement.description;
}
},
{
data: "dateCreated",
render: function(data, type, announcement) {
return announcement.dateCreated;
}
},
{
data: "id",
render: function(data) {
return "<button class='btn-link js-delete' data-announcement-id=" +
data +
">Delete</button>";
}
}
]
});
$("#announcement").on("click",
".js-delete",
function() {
var button = $(this);
bootbox.confirm("Are you sure you want to delete this annoucement?",
function(result) {
if (result) {
$.ajax({
url: "/api/announcement/" + button.attr("data-annoucement-id"),
method: "DELETE",
success: function() {
table.row(button.parents("tr")).remove().draw();
}
});
}
});
});
});
</script>
}
模型
using System;
using System.Collections.Generic;
using System.ComponentModel.DataAnnotations;
using System.Linq;
using System.Web;
namespace TestApp.Models
{
public class Announcement
{
public int Id { get; set; }
[DataType(DataType.MultilineText)]
public string Title { get; set; }
[DataType(DataType.MultilineText)]
public string Description { get; set; }
public DateTime DateCreated { get; set; }
// public bool? SendEmail { get; set; }
}
}
CodingYoshi 发布的答案
<script>
$(document).ready(function() {
var table = $("#announcement").DataTable({
ajax: {
url: "/api/announcements",
dataSrc: ""
},
columns: [
{
data: "title",
render: function(data, type, announcement) {
return announcement.title;
}
},
{
data: "description",
render: function(data, type, announcement) {
return announcement.description;
}
},
{
data: "dateCreated", //also tried putting data: dateCreatedFormatted here too:
render: function (data, type, announcement) {
return announcement.dateCreatedFormatted;
}
},
{
data: "id",
render: function(data) {
return "<button class='btn-link js-delete' data-announcement-id=" +
data +
">Delete</button>";
}
}
]
});
$("#announcement").on("click",
".js-delete",
function() {
var button = $(this);
bootbox.confirm("Are you sure you want to delete this annoucement?",
function(result) {
if (result) {
$.ajax({
url: "/api/announcement/" + button.attr("data-annoucement-id"),
method: "DELETE",
success: function() {
table.row(button.parents("tr")).remove().draw();
}
});
}
});
});
});
</script>
earloc 发布的答案
<script>
$(document).ready(function() {
var table = $("#announcement").DataTable({
ajax: {
url: "/api/announcements",
dataSrc: ""
},
columns: [
{
data: "title",
render: function(data, type, announcement) {
return announcement.title;
}
},
{
data: "description",
render: function(data, type, announcement) {
return announcement.description;
}
},
{
data: "dateCreated",
render: function (data, type, announcement) {
return announcement.FormattedDate;
}
},
{
data: "id",
render: function(data) {
return "<button class='btn-link js-delete' data-announcement-id=" +
data +
">Delete</button>";
}
}
]
});
$("#announcement").on("click",
".js-delete",
function() {
var button = $(this);
bootbox.confirm("Are you sure you want to delete this annoucement?",
function(result) {
if (result) {
$.ajax({
url: "/api/announcement/" + button.attr("data-annoucement-id"),
method: "DELETE",
success: function() {
table.row(button.parents("tr")).remove().draw();
}
});
}
});
});
});
</script>
我把这个放在
public string FormattedDate => DateCreated.ToShortDateString();
public DateTime DateCreated { get; set; }
在模型中
最佳答案
我认为你在这里混合技术!
或者，在您的模型中提供格式化的字符串表示形式(C# 6 语法):
public string FormattedDate => DateCreated.ToShortDateString()
并通过以下方式在 JavaScript 中提取此属性:
columns: [
{
data: "dateCreated",
render: function(data, type, announcement) {
return announcement.FormattedDate;
}
},
或者，正如 Maria 建议的那样，使用 here 中解释的技术直接在客户端格式化日期或借助例如:moment.js
(客户端 JavaScript 对“ToShortDateString”一无所知 - 日期方法...)
关于c# - 将日期时间呈现为 DataTable 中的 dd/mm/yyyy 格式，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/43577061/