This is a migrated thread and some comments may be shown as answers.

Grid Edit: Date Format Input Verification

4 Answers 523 Views
Grid
This is a migrated thread and some comments may be shown as answers.
underscore
Top achievements
Rank 1
underscore asked on 27 Dec 2011, 01:23 PM
Looking into Kendo UI for a new web service, I found both code & documentation straightforward.

As always date formats make some trouble. While I don't see any problem to produce any required JSON input coming from my application server, I would like to have a notation like dd.mm.yyyy being displayed in my grid.

Of course, I added some '#=kendo.toString(mytime,"dd.mm.yyyy") #' to the column definition but then things start getting weird.

Although dates are being displayed that way, I am not allowed to enter exactly that format  as it does't pass the input verification. Only by try and error, I found that "12/14/2011" is being accepted.

Even more weird, the datepicker inserts "Wed Dec 14 2011 00:00:00 GMT+0100 (CET)" which is also not accepted - can't submit with the toolbar button of the grid.

So, what is the most recommended date format for Kendo UI internal & external date representation?

And where sits the input format checker? Would be glad to know that, as also text fields need some input checks. For obvious reasons some {,: would otherwise crash the JSON parser.

4 Answers, 1 is accepted

Sort by
0
Nikolay Rusev
Telerik team
answered on 28 Dec 2011, 10:35 AM
Hi,

You can set format for the columns which will be applied in edit mode. For example:
...
columns: [
        "ProductName",
        { field: "OrderDate", format: "{0:dd.MM.yyyy}"}
    ]
...


For more details please check the follwing jsFiddle:
http://jsfiddle.net/rusev/P5Cjg/2/

Regards,
Nikolay Rusev
the Telerik team
Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
0
underscore
Top achievements
Rank 1
answered on 28 Dec 2011, 11:37 AM
zillion thanks, that saved my day.
0
Mukesh
Top achievements
Rank 1
answered on 06 Nov 2012, 06:29 PM
Hi Nikolay,

I had same problem and it fixed as per your jsfiddle..
http://jsfiddle.net/rusev/P5Cjg/2/

I want to have one more further question in that... When i edit any date and clears the date value.. it shows 'null' into datetime editor..
Can i show blank (empty value) instead of 'null' when user clears the field.. and allow user to proceed.. ?

Thanks.
Muksu
0
Sean
Top achievements
Rank 1
answered on 07 Nov 2012, 08:46 PM
I want to use this example to ask another question about dates

if i use this code

var data [
    {
        ProductID1,
        ProductName"ProductName 1",
        OrderDatenew Date(201111)
    },
    {
        ProductID2,
        ProductName"ProductName 2",
        OrderDatenew Date(1352264400*1000)
    }
];

$("#grid").kendoGrid({
    dataSource{
        datadata,
        batchtrue,
        pageSize30,
        schema{
            model{
                id"ProductID",
                fields{
                    ProductIDeditablefalsenullabletrue },
                    ProductNamevalidationrequiredtrue },
                    OrderDatetype"date" }
                }
            }
        }
    },
    editabletrue,
    toolbar["create""save""cancel"],
    columns[
        "ProductName",
        field"OrderDate"format"{0:dd.MM.yyyy}"}
    ]
});‚Äč

the second date is correct, today 7/11/2012

but if i use that as the source for the data (php exports mysql data as json) it shows up as a date from year 1333
Tags
Grid
Asked by
underscore
Top achievements
Rank 1
Answers by
Nikolay Rusev
Telerik team
underscore
Top achievements
Rank 1
Mukesh
Top achievements
Rank 1
Sean
Top achievements
Rank 1
Share this question
or