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

How to set the format and language in Spanish to a date in a childGrid?

Hi, I am setting up a grid with a childGrid and when I try to format a date it always puts the full format as Friday, November 4, 2016 at 1:03:04 PM GMT + 05: 30 in the childGrid. But if I do it in the Grid master, I have no problem
The configuration of locale the hagon with the cldr files. I have a partial view where I load the cldr files
    document.addEventListener("DOMContentLoaded", function () {
            'es-MX': {
                'grid': {
                    "GroupDropArea": "Arrastre una columna para agrupar",
                    "autoFitAll": "Ajuste automático de todas las columnas",
                    "autoFit": "Ajuste automatico de esta columna",
                    "Group": "Agrupar sobre esta columna",
                    "Ungroup": "Desagrupar sobre esta columna",
                    "SortAscending": "Ordenar ascendente",
                    "SortDescending": "Ordenar descendente",
                    "Columnchooser": "Mostrar/Ocultar columnas",
                    "FilterMenu": "Filtrado",
                    "FilterButton": "Filtrar",
                    "ClearButton": "Limpiar",
                    "StartsWith": "Empieza con...",
                    "EndsWith": "Termina con...",
                    "Contains": "Contiene",
                    "Equal": "Igual a",
                    "NotEqual": "Diferente de",
                    "LessThan": "Menor que",
                    "LessThanOrEqual": "Menor o igual que",
                    "GreaterThan": "Mayor que",
                    "GreaterThanOrEqual": "Mayor o igual que",
                    "EnterValue": "Introduzca un valor",
                    "Excelexport": "Exportar",
                    "Add": "Nuevo registro",
                    "Update": "Guardar",
                    "Cancel": "Cancelar",
                    "EditOperationAlert": "Seleccione un registro para editar",
                    "DeleteOperationAlert": "Seleccione un registro para dar de baja",
                    "Search": "Busqueda",
                    "Edit": "Editar",
                    "Delete": "Baja",
                    "ClearFilter": "Limpiar filtro",
                    "UnGroup": "Haga clic aqui para desagrupar",
                    "SelectAll": "Seleccionar todo",
                    "CancelButton": "Cancelar",
                    "TextFilter": "Criterio de filtrado",
                    "EmptyRecord": "No hay registros",
                    'Item': 'Equipo',
                    'Items': 'Equipos'
                'pager': {
                    "FirstPage": "Primera página",
                    "LastPage": "Ultima página",
                    "PreviousPage": "Página anterior",
                    "NextPage": "Página siguiente",
                    "currentPageInfo": "Página {0} de {1}",
                    "totalItemsInfo": "({0} registros)",
                    "previousPageTooltip": "Página anterior",
                    "nextPageTooltip": "Página siguiente",
                    "previousPagerTooltip": "Página anterior",
                    "nextPagerTooltip": "Página siguiente",
                    "firstPageTooltip": "Ir a la primera página",
                    "lastPageTooltip": "Ir a la última pagina"

    function loadCultureFiles(name) {
        var files = ['ca-gregorian.json', 'numbers.json', 'timeZoneNames.json', 'currencies.json'];
        var loadCulture = function (prop) {
            var val, ajax;
            ajax = new ej.base.Ajax(location.origin + '/../../scripts/cldr-data/main/' + name + '/' + files[prop], 'GET', true);
            ajax.onSuccess = function (value) {
                val = value;
            ajax.send().then(function (args) {
        for (var prop = 0; prop < files.length; prop++) {
    document.addEventListener('DOMContentLoaded', function () {
How can I do the configuration? I hope you can help me. Thanks in advance

5 Replies

SS Seeni Sakthi Kumar Seeni Raj Syncfusion Team November 22, 2019 06:48 AM UTC

Hi Juan,  

Greetings from Syncfusion.  

To format the Grid columns, you must update the columns.format. Refer to the following Help Document.  

If you are still facing any problem, please share a JSON data bound to the Grid and its Grid definition. 

Seeni Sakthi Kumar S 

JC Juan Cruz November 22, 2019 08:34 PM UTC

Here is my code

Attachment: Consulta_698e6036.rar

SS Seeni Sakthi Kumar Seeni Raj Syncfusion Team November 25, 2019 06:59 AM UTC

Hi Juan,  

We can reproduce the problem at our end. Since you are using the custom date format, the reported problem occurred. So we suggest to assign the type/format for the date column in the load event of the Grid as follows.  

    function onLoad() { 
      // date column 
      this.columns[3].format = { type: 'dateTime', format: 'dd.MM.yyyy' }; 

 . . . 
           . . . 

Seeni Sakthi Kumar S 

JC Juan Cruz November 25, 2019 11:30 PM UTC

I already made the corrections and it works. I only have one question left: Can I add a search bar in the parent grid and can I search for records at any level?

SS Seeni Sakthi Kumar Seeni Raj Syncfusion Team November 26, 2019 07:04 AM UTC

Hi Juan,  

Thanks for contacting Syncfusion Support.   
We could see you would like to search the child Grid records on giving values for the parent Grid’s search tool.  We will not support the searching of the child Grid records from the parent records. Since they are possessing the different datasets and rendering as a separate control from the parent Grid, it is not feasible to implement this requirement.  

Seeni Sakthi Kumar S

Live Chat Icon For mobile
Up arrow icon