Date format

[mac]

Hello,

There any method to change the format of the data in the grid?

The problem is that I had to filter and show the date with dd/mm/yy format.

Thanks

[paramvir]

Please use $.datepicker.formatDate in the column.render callback function e.g.,

return $.datepicker.formatDate('dd/mm/yy', new Date(ui.cellData));

[mac]

Well, that works to recover data date in mm/dd/yy format and if I don't change the filter format it works too.

But filtering does not work if the date is on this format: dd/mm/yyyy.

Okay, let's see a example code, this is my DatePicker, if I don't change the format (commented line) it works but when I use dd/mm/yyyy format filter doesn't work.

I want to display in filter the same format that on the row.

Code: [Select]

function pqDatePicker(ui) {
        var $this = $(this);
        $this
            .css({ zIndex: 3, position: "relative" })
            .datepicker({
                changeYear: true,
                changeMonth: true,
//dateFormat: "yy-mm-dd",
                onClose: function (evt, ui) {
                    $(this).focus();
                }
            });
    }

[paramvir]

I couldn't get what you mean by filter format.

you have to keep the date in mm/dd/yyyy format in the data for filtering to work while you can present ( view ) the data in grid in any format using render callback.

And datepicker editor has no relation to the filtering.

[mac]

I mean by filter format, the dataFormat on datapicker, was my mistake.

I know that datepicker editor has no relation to the filtering, but if I want to display the same dateFormat on the filter input I can't.

I have this colModel, I keep the date in mm/dd/yyyy format in the data:

Code: [Select]

{ title: "Fecha de carga", width: 200, dataType: "date", resizable:true,
render:function( ui ){
return $.datepicker.formatDate('dd/mm/yy', new Date(ui.cellData));
}



Example images:

Image1: the data on the grid.



Image2: filtered data. With dateFormat default on datepicker.



Image3: no rows with dateFormat:'dd/mm/yy' on datepicker.

[paramvir]

ok, I see what you mean

Its solution is to implement your own filter.listener instead of using the inbuilt listener i.e., listeners : [ 'change' ].

Code: [Select]

listeners: [{ 'change': function (evt, ui) {
        //debugger;
                        ui.value =  change format into mm/dd/yyyy from ui.value
                        ui.value2 = change format into mm/dd/yyyy from ui.value2
        var $grid = $(this).closest(".pq-grid");
        $grid.pqGrid("filter", {
            oper: 'add',
            data: [ui]
        });
}
}]


[mac]

Ok, thanks a lot, now filter does the work that I want.

Maybe in the future you can implement this on pqgrid, can be very useful for people that's not using mm/dd/yy format

For change the date I splited the date like this:

Code: [Select]

var d1 = ui.value.split('/');
var d2 = ui.value2.split('/');
ui.value = d1[1]+'/'+d1[0]+'/'+d1[2];
ui.value2 = d2[1]+'/'+d2[0]+'/'+d2[2];

[paramvir]

Thanks mac

A complete example for custom date format has been posted here: http://paramquery.com/pro/demos/filter_date