double call to method DataSource

[Rubén Valentín]

Hello, I have a problem with datasource. I have double call to method DataSource (OnPostDataSource). A the moment I use the handler call. 

This is the code: 

Razor Pages: 

 public JsonResult OnPostDataSource([FromBody]DataManagerRequest dm)

        {

            CustomFilter customFilter = new CustomFilter();

            if(dm.Custom != null) { customFilter = dm.Custom; }

            var sql = "exec spGetDocumentacion {0},{1},{2},{3};";

            var d = (_Context.DocumentosDTO.FromSql(sql, $"formato=dto and filtrar=no " +

                        $"and idempresa={customFilter.IdEmpresa} " +

                        $"and area={customFilter.Departamento} " +

                        $"and tipo={customFilter.TipoDocumento} " +

                        $"and fechainicio={customFilter.Fecha?.ToString("yyyyMMdd")} "+

                        $"and fechafin={customFilter.Fecha?.ToString("yyyyMMdd")} "

                        , User.Identity.Name,1,50).ToList());

            var listaDocumentos = d.AsEnumerable();

   

            var resultJson = new JsonResult(new { result = listaDocumentos, count = listaDocumentos.Count() });

            return dm.RequiresCounts ? resultJson : new JsonResult(listaDocumentos);

        }

The html 

  @{

                            var labelDescargas = Localizer["Ver"].Value;

                            var labelBorrar = Localizer["Borrar"].Value;

                            List<object> commands = new List<object>();

                            commands.Add(new

                            {

                                type = labelDescargas,

                                buttonOption = new { iconCss = "e-icons fas fa-file-download", cssClass = "comman-descarga btn-color-amarillo e-flat" }

                            });

                            commands.Add(new { type = labelBorrar, buttonOption = new { iconCss = "e-icons e-delete", cssClass = "comman-borrar btn-color-rojo_claro e-flat" } });

                        }

                        <div class="control-section">

                            <ejs-grid id="Grid" allowPaging="true" load="onLoad" commandClick="commandClick" frozenRows="0" height="85vh">

                                <e-grid-filterSettings type="Menu"></e-grid-filterSettings>

                                <e-grid-editSettings allowAdding="true" allowDeleting="true"></e-grid-editSettings>

                                <e-data-manager url="Documentacion/DataSource" adaptor="UrlAdaptor"></e-data-manager>

                                <e-grid-pagesettings pageCount="5"></e-grid-pagesettings>

                                <e-grid-columns>

                                    @*<e-grid-column headerText="Descargar" template="#templateEdit" textAlign="Left"></e-grid-column>*@  //Template Column

                                    <e-grid-column headerText="Acciones" commands="commands" width="120"></e-grid-column>

                                    @*<e-grid-column field="Id" headerText="Id" isPrimaryKey="true" textAlign="Right"  visible="true"></e-grid-column>*@

                                    <e-grid-column field="Fecha" headerText="Fecha" textAlign="Left" width="190"></e-grid-column>

                                    <e-grid-column field="Empresa" allowFiltering="false" headerText="Empresa" width="120" textAlign="Left"></e-grid-column>

                                    <e-grid-column field="Nombre" headerText="Documento" textAlign="Left"></e-grid-column>

                                    <e-grid-column field="Tipo" headerText="Tipo" textAlign="Left"></e-grid-column>

                                    <e-grid-column field="SubTipo" headerText="SubTipo" textAlign="Left"></e-grid-column>

                                    <e-grid-column field="Area" headerText="Area" textAlign="Left"></e-grid-column>

                                    @*<e-grid-column headerText="Ver" template="#templateAdd" textAlign="Right" ></e-grid-column>  //Template Column*@

                                </e-grid-columns>

                            </ejs-grid>

[Thiyagu Subramani]

Hi Rubén, 

Thanks for contacting Syncfusion forum. 

Based on your code example we have created a razor page sample, but in our sample we did not receive the double call to method DataSource.  

Please refer to the below code and sample link. 

@{ 

 

    List<object> commands = new List<object>(); 

    commands.Add(new { type = "Edit", buttonOption = new { iconCss = "e-icons e-edit", cssClass = "e-flat" } }); 

    commands.Add(new { type = "Delete", buttonOption = new { iconCss = "e-icons e-delete", cssClass = "e-flat" } }); 

    commands.Add(new { type = "Save", buttonOption = new { iconCss = "e-icons e-update", cssClass = "e-flat" } }); 

    commands.Add(new { type = "Cancel", buttonOption = new { iconCss = "e-icons e-cancel-icon", cssClass = "e-flat" } }); 

 

} 

<ejs-grid id="Grid" load="onLoad" allowPaging="true" frozenRows="0" allowSorting="true" allowFiltering="true" allowpaging="true" actionComplete="actionComplete" toolbar="@( new List<object>() {"Add","Edit","Delete","Update","Cancel", "Search"})"> 

. . . . .  

    <e-data-manager url="/Index?handler=DataSource" insertUrl="/Index?handler=Insert" removeUrl="/Index?handler=Delete" updateUrl="/Index?handler=Update" adaptor="UrlAdaptor"></e-data-manager>   // have to define server side method name as /index?handler= Name 

    <e-grid-columns>  

        <e-grid-column headerText="Manage Records" width="150" commands="commands"></e-grid-column> 

        . . . . . . 

        <e-grid-column field="OrderDate" headerText="Order Date" customFormat="@(new { type ="dateTime", format="MM/dd/yyyy hh:mm:ss a" })" width="170"></e-grid-column> 

        <e-grid-column field="CustomerName" headerText="CustomerName" textAlign="Right" width="120"></e-grid-column> 

        <e-grid-column field="City" headerText="City" width="150"></e-grid-column> 

    </e-grid-columns> 

</ejs-grid> 

 

public JsonResult OnPostDataSource([FromBody]DataManagerRequest dm) 

        { 

            . . . . 

        } 

 

Sample link :  https://www.syncfusion.com/downloads/support/forum/152918/ze/Grid_Sample-413220585 

 

Please share below details to find root cause of this issue. 

1. Share your .Net Core version. 

2. Share your Syncfusion package version. 

3. Reproduce the issue in attached sample and revert to us . 

(or)  

4. Share your issue reproducing sample. 

5. Share video demonstration of your issue. 

Please get back to us, if you need any further assistance. 

  

Regards, 

 Thiyagu S.

[Rubén Valentín]

I've found the problem, when I´m trying globalize and localize EJ 2 components. 

Example: 

The EJ2 is on english by default,  I try to load my default language using this : 

File: site.js

    

  document.addEventListener('DOMContentLoaded', function () { 

        loadLocalizationForEssentialJS2('es-UY'); 

    }); 

 

//------------------LOCALIZACION PLUGINS -------------//

//----------------------------------------------------//

//===============================================//

//============= EssentialJS2 ====================//

function loadLocalizationForEssentialJS2(culture) {

    var Localization;

    switch (culture) {

        case "es-ES":

            Localization = "es";

            break;

        case "ca-ES":

            Localization = "es";

            break;

        case "en-US":

            Localization = "en-US";

            break;

        default:

            Localization = "es";

    }       

    loadCultureFiles(Localization);

    var ajax = new ej.base.Ajax('/lib/ej2/ej2-locale/'+Localization+'.json', 'GET', true);

    ajax.onSuccess = function (value) {

        var culture = JSON.parse(value);

        //Assigning locale text value for Essential JS 2 components

        ej.base.L10n.load(culture);

        ej.base.setCulture(Localization);

        ej.base.setCurrencyCode('EUR');

    };

    ajax.send();

}

function loadCultureFiles(name) {

    var files = ['ca-gregorian.json', 'numbers.json', 'timeZoneNames.json'];

    //var loader = ej.base.loadCldr;

    var loadCulture = function (prop) {

        var val, ajax;

        ajax = new ej.base.Ajax('/lib/cldr-data/main/' + name + '/' + files[prop], 'GET', false);

        ajax.onSuccess = function (value) {

            val = value;

        };

        ajax.send();

        //loader(JSON.parse(val));

    };

    for (var prop = 0; prop < files.length; prop++) {

        loadCulture(prop);

    }

}

//===============================================//

So, the grid the first time is load on english, and then the grid call again the databound to load the grid on spanish. 

Is there a way to load mi default language first? 

[Thiyagu Subramani]

Hi Rubén, 

Thanks for your update. 

By default the setCulture will called after the Grid rendering, so it will trigger the OnPostDataSource method  twice.  The OnPostDataSource server side method called (once)when rendering grid with default culture. Then if we set culture dynamically , grid content should be change based on applied culture. So, at that time grid will be refreshed and OnPostDataSource method is called(once) again. It’s our default behavior. 

Please get back to us, if you need any further assistance. 

Regards, 

Thiyagu S