kendodatepicker - kendo grid type date format

La columna de la fecha de la grilla Kendo no formatea

Question

Tengo un KendoGrid como a continuación y cuando ejecuto la aplicación, no obtengo el formato esperado para la columna de date .

$("#empGrid").kendoGrid({
dataSource: {
data: empModel.Value,
pageSize: 10
},
columns: [
{
field: "Name",
width: 90,
title: "Name"
},
{
field: "DOJ",
width: 90,
title: "DOJ",
type: "date",
format:"{0:MM-dd-yyyy}"
}
]
});

Cuando ejecuto esto, 2013-07-02T00:00:00Z " 2013-07-02T00:00:00Z " en la columna DOJ. ¿Por qué no está formateando? ¿Alguna idea?

Answer 1

Así es como lo haces usando ASP.NET:

add .Format("{0:dd/MM/yyyy HH:mm:ss}");
@(Html.Kendo().Grid<AlphaStatic.Domain.ViewModels.AttributeHistoryViewModel>()
.Name("grid")
.Columns(columns =>
{
columns.Bound(c => c.AttributeName);
columns.Bound(c => c.UpdatedDate).Format("{0:dd/MM/yyyy HH:mm:ss}");
})
.HtmlAttributes(new { @class = ".big-grid" })
.Resizable(x => x.Columns(true))
.Sortable()
.Filterable()
.DataSource(dataSource => dataSource
.Ajax()
.Batch(true)
.ServerOperation(false)
.Model(model =>
{
model.Id(c => c.Id);
})
.Read(read => read.Action("Read_AttributeHistory", "Attribute", new { attributeId = attributeId })))
)

Answer 2

Encontré esta información y la hice funcionar correctamente. Los datos que me dieron estaban en formato de cadena, así que necesitaba analizar la cadena con kendo.parseDate antes de formatearla con kendo.toString .

columns: [ { field: "FirstName", title: "FIRST NAME" }, { field: "LastName", title: "LAST NAME" }, { field: "DateOfBirth", title: "DATE OF BIRTH", template: "#= kendo.toString(kendo.parseDate(DateOfBirth, ''yyyy-MM-dd''), ''MM/dd/yyyy'') #" }, ... Referencias

1. format-date-in-grid
2. jsfiddle
3. formato de fecha kendo ui

Answer 3

Esto podría ser útil:

columns.Bound(date=> date.START_DATE).Title("Start Date").Format("{0:MM dd, yyyy}");

Answer 4

Intente formatear la fecha en la grilla de kendo como:

columns.Bound(x => x.LastUpdateDate).ClientTemplate("#= kendo.toString(LastUpdateDate, /"MM/dd/yyyy hh:mm tt/") #");

Answer 5

La opción que uso es la siguiente:

columns.Bound(p => p.OrderDate).Format("{0:d}").ClientTemplate("#=formatDate(OrderDate)#");
function formatDate(OrderDate) {
var formatedOrderDate = kendo.format("{0:d}", OrderDate);
return formatedOrderDate;
}

Answer 6

Por lo que sé, para formatear un valor de fecha, debe manejarlo en parameterMap,

$(''#listDiv'').kendoGrid({
dataSource: {
type: ''json'',
serverPaging: true,
pageSize: 10,
transport: {
read: {
url: ''@Url.Action("_ListMy", "Placement")'',
data: refreshGridParams,
type: ''POST''
},
parameterMap: function (options, operation) {
if (operation != "read") {
var d = new Date(options.StartDate);
options.StartDate = kendo.toString(new Date(d), "dd/MM/yyyy");
return options;
}
else { return options; }
}
},
schema: {
model: {
id: ''Id'',
fields: {
Id: { type: ''number'' },
StartDate: { type: ''date'', format: ''dd/MM/yyyy'' },
Area: { type: ''string'' },
Length: { type: ''string'' },
Display: { type: ''string'' },
Status: { type: ''string'' },
Edit: { type: ''string'' }
}
},
data: "Data",
total: "Count"
}
},
scrollable: false,
columns:
[
{
field: ''StartDate'',
title: ''Start Date'',
format: ''{0:dd/MM/yyyy}'',
width: 100
},

Si sigue el ejemplo anterior y simplemente cambia el nombre de objetos como ''StartDate'', entonces debería funcionar (ignore ''data: refreshGridParams,'')

Para obtener más detalles, consulte el enlace a continuación o simplemente busque el parámetro de cuadrícula Kendo y vea lo que otros han hecho.

http://docs.kendoui.com/api/framework/datasource#configuration-transport.parameterMap

Answer 7

solo es necesario poner el tipo de datos de la columna en el origen de datos

dataSource: {
data: empModel.Value,
pageSize: 10,
schema: {
model: {
fields: {
DOJ: { type: "date" }
}
}
}
}

y luego tu columna de extracto:

 columns: [
{
field: "Name",
width: 90,
title: "Name"
},
{
field: "DOJ",
width: 90,
title: "DOJ",
type: "date",
format:"{0:MM-dd-yyyy}"
}
]