We use cookies to give you the best experience on our website. If you continue to browse, then you agree to our privacy policy and cookie policy. Image for the cookie policy date
  1. Home
  2. Forum
  3. JavaScript - EJ 2
  4. Formatted Date not working inside Grid Column

Formatted Date not working inside Grid Column

Hello,

I'm trying to render à grid with date but it's not working. 
$scope.data = [
{
"TitreDate_auto": "2019-01-08T15:20:00Z",
"TitreHeure_auto": "2019-01-08T15:20:00Z",
"TitreDateheure": "2019-01-16T15:25:00Z",
"id": "A7F16837-43AF-4811-9256-031BC09A32EC",
"status": "publish",
"isDraft": false,
"isTerminated": false
}
]
        var gridObj = new ej.grids.Grid(
            {
                allowPaging: true,
                dataSource: $scope.data,
                allowFiltering: true,
                allowSorting: true,
                filterSettings: { type: 'Excel' },
                columns: [
                    {
                        "field": "TitreDate_auto",
                        "headerText": "Titre Date",
                        "type": "datetime"
                    },
                    {
                        "field": "TitreHeure_auto",
                        "headerText": "Titre Heure",
                        "type": "datetime"
                    },
                    {
                        "field": "TitreDateheure",
                        "headerText": "Titre Date heure",
                        "type": "datetime"
                    },
                    {
                        "field": "VIEW",
                        "width": 40,
                        "headerText": "",
                        "template": "<button></button>",
                        "allowFiltering": false
                    },
                    {
                        "field": "DUPLICATE",
                        "width": 45,
                        "headerText": "",
                        "template": "<button></button>",
                        "allowFiltering": false
                    },
                    {
                        "field": "DELETE",
                        "width": 40,
                        "headerText": "",
                        "template": "<button></button>",
                        "allowFiltering": false
                    }
                ],
                queryCellInfo: $scope.queryCellInfo,
                rowDataBound: $scope.rowBound,
            });
        gridObj.appendTo("#gridContent");



And here the result :


How can I render the date properly ?

thx

9 Replies
PS Pavithra Subramaniyam Syncfusion Team January 9, 2019 10:14 AM UTC

Hi Foulont, 
 
Thanks for contacting Syncfusion support. 
 
We have prepared the sample to reproduce the reported issue at our end. But unfortunately, this issue was not reproduced in our sample. So we have attached that sample in the below link for your reference. 
 
 
So could you please provide the below details that will be helpful for us to provide a better solution as early as possible , 
 
  1. Do you have customized the data for the “Titre Date” column in in your “queryCellInfo” or “rowDataBound” event
  2. Please reproduce the issue in the above sample if possible.
  3. Share the code for the “queryCellInfo” and “rowDataBound” event you have used.
 
Regards, 
Pavithra S. 


FG Foulont Gaetan January 9, 2019 11:22 AM UTC

Hello,

Thanks for your response.

But when I try to set excel filtering and format date it's not working.

You could see inside this editor :


PS Pavithra Subramaniyam Syncfusion Team January 10, 2019 08:41 AM UTC

Hi Foulont, 
We have validated the defect you have initiated with us. Thank you for taking the time to report this issue and helping us improve our product. At Syncfusion, we are committed to fixing all validated defects (subject to technological feasibility and Product Development Life Cycle ) and including the defect fix in our subsequent patch release which will be rolled out on end of January, 2019. You can now track the current status of your request, review the proposed resolution timeline, and contact us for any further inquiries through https://www.syncfusion.com/feedback/4220/date-value-has-not-been-formatted-in-excel-filter  
 
Regards, 
Pavithra S. 
 


FG Foulont Gaetan January 10, 2019 09:14 AM UTC

Hello,

Thank for your response. I will wait for this resolution ;)

Another question how to get the translation for the whole grid including excel filter in my culture fr ? 

PS Pavithra Subramaniyam Syncfusion Team January 10, 2019 12:11 PM UTC

Hi Foulont, 
 
You can translate the Grid default text content by defining the locale value and translation object of Localization library. Please refer to the below code example and Documentation link. 
 
[index.js] 
ej.base.L10n.load({ 
        'fr': { 
            'grid': { 
                'EmptyRecord': Aucun enregistrement à afficher', 
                'Filter': 'Filtre', 
                'cancel': 'Annuler', 
                'StartsWith':'Commence avec' 
                 .  .  . 
            }, 
            'pager': { 
                .  .  . 
            } 
        } 
    }); 
    var grid = new ej.grids.Grid({ 
        dataSource: data, 
        locale: ‘fr’, 
        allowGrouping: true, 
        allowPaging: true, 
        pageSettings: { pageSize: 6 }, 
        columns: [ 
            { field: 'OrderID', headerText: 'Order ID', textAlign: 'Right', width: 120 }, 
            { field: 'CustomerID', headerText: 'Customer ID', width: 150 }, 
            { field: 'ShipCity', headerText: 'Ship City', width: 150 }, 
            { field: 'ShipName', headerText: 'Ship Name', width: 150 } 
        ], 
        height: 220 
    }); 
    grid.appendTo('#Grid'); 
 
 
Regards, 
Pavithra S. 
 


FG Foulont Gaetan January 10, 2019 12:45 PM UTC

Thanks for your reply. 

Where can I find a full json with all translate data ? Or do I need to translate all by my hand ?

PS Pavithra Subramaniyam Syncfusion Team January 11, 2019 05:26 AM UTC

Hi Foulont, 
 
You can find the locale translation json for various language from the below link. 
 
 
To load translation object in Essential JS 2 components, you can load locale object in L10.load function from ej.base. For example, In the below code snippet we have loaded the locale file for Arabic culture. 
 
    ej.base.setCulture('fr'); 
    var ajax = new ej.base.Ajax('/src/fr.json', 'GET', true); 
    ajax.onSuccess = function (value) { 
        //Assigning locale text value for Essential JS 2 components 
        ej.base.L10n.load(value); 
    }; 
    ajax.send(); 
 
 
Regards, 
Pavithra S. 


FG Foulont Gaetan January 11, 2019 08:14 AM UTC

Hello, 

Cool thanks it's working like a charm :)
.

Another problem not in excel filter but in formatted datetime inside grid.

It'snot showing my formatted datetime dd/MM/yyyy hh:mm  inside the grid.


LR Logesh Rajappa Syncfusion Team January 14, 2019 06:00 AM UTC

Hi Foulont, 

Greetings from Syncfusion. 

Query:  It'snot showing my formatted datetime dd/MM/yyyy hh:mm  inside the grid. 
 
We have analyzed your query and to apply custom format to the grid column, we suggest to provide the format property as an object as mentioned in the below code example and sample. 
  
[.ts] 
... 
{ 
      field: "TitreDateheure", 
      headerText: "Titre Date heure", 
      type:'datetime', 
      format: {format: 'dd/MM/yyyy hh:mm', type: 'datatime'}, 
      width: 55 
    }, 
... 
 
 
Please get back to us for further assistance. 
 
Regards, 
Logesh Rajappa 


Loader.
Up arrow icon