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}" 
    }
]