Remove 'No records to display'

[Unknown]

Hello,

I would like to know if it is posible to remove the message that appears  when the grid has no data.

Thank you in advance

[Balaji Marimuthu]

Hi Antonio,

Thanks for contacting Syncfusion support.

Yes, it’s possible to remove the “No records to display” message when the Grid has no data using the ej.Grid.Locale object. By default, the Grid locale is “en-US”. If you use other locale, then you need to specify the locale name in object appropriately for e.g.: ej.Grid.Locale[“de-DE”]. Refer to the sample, Help Document and code example as follows.

Sample: http://jsplayground.syncfusion.com/3hbzx05l

Help Documents: http://help.syncfusion.com/js/grid/globalizationandlocalization

                       http://help.syncfusion.com/js/localization

<script type="text/javascript">

        $(function () {

            // the datasource "window.gridData" is referred from jsondata.min.js

            var data = ej.DataManager(window.gridData).executeLocal(ej.Query().take(50));

            $("#Grid").ejGrid({

                dataSource: [],

                allowPaging: true,

                allowSorting: true,

                columns: [

                        { field: "OrderID", headerText: "Order ID", width: 75, textAlign: ej.TextAlign.Right },

                        { field: "CustomerID", headerText: "Customer ID", width: 80 },

                        { field: "EmployeeID", headerText: "Employee ID", width: 75, textAlign: ej.TextAlign.Right },

                        { field: "Freight", width: 75, format: "{0:C}", textAlign: ej.TextAlign.Right },

                        { field: "OrderDate", headerText: "Order Date", width: 80, format: "{0:MM/dd/yyyy}", textAlign: ej.TextAlign.Right },

                        { field: "ShipCity", headerText: "Ship City", width: 110 }

                ],

            });

        });

        ej.Grid.Locale["en-US"] = {

            EmptyRecord: "&nbsp;",

        }
    </script>

Output screenshot:





Regards,
Balaji Marimuthu

[Unknown]

It works.

Thank you

[Balaji Marimuthu]

Hi Antonio,

Thanks for the update.

We are happy that the provided solution helped you. Please get back to us if you need any further assistance.

Regards,
Balaji Marimuthu

[Raj Kumar]

But this is changing for all the grids i have in that page.

can't it be customized for particular grid?

[Farveen Sulthana Thameeztheen Basha]

Hi Raj kumar, 

Query #:- But this is changing for all the grids i have in that page. can't it be customized for particular grid? 

We have achieved your requirement by using the load and dataBound event of the Grid. In the load event of the particular Grid( i.e. the Grid which you want to  customize the locale)  you can change the locale for No Records to Display and revert the changes in the dataBound event of the Grid then the locale customization not affect the other Grids in the page. 

Refer to the below code example, 

<script type="text/javascript"> 

    $(function () { 

        // the datasource "window.gridData" is referred from jsondata.min.js 

        var data = ej.DataManager(window.gridData).executeLocal(ej.Query().take(50)); 

        $("#Grid").ejGrid({ 

            dataSource: [], 

                  .       .       . 

            ], 

            load: function (args) { 

                ej.Grid.Locale["en-US"] = { 

                    EmptyRecord: "&nbsp;", 

                } 

            }, 

 

            dataBound: function (args) { 

                ej.Grid.Locale["en-US"] = { 

                    EmptyRecord: "No records to display", 

                } 

            } 

        }); 

 

 

 

 

    }); 

 

</script> 

Refer to the sample and API link:- 

http://jsplayground.syncfusion.com/unmc3c1h 

https://help.syncfusion.com/api/js/ejgrid#events:load 

https://help.syncfusion.com/api/js/ejgrid#events:databound 

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

Regards, 

Farveen sulthana T