Get value of grid record count

[Yoab Youssoufou]

Hello,

Please I am trying to to get the value of the number of records returned by a Grid on a particular Search/Filter condition and use it in my program say as javacript alert function on an external button click.

I tried the following where my Grid Id is called MailGrid:

<script type="text/javascript">
    function show_msg() {
        var q = document.getElementById("MailGrid").DataSource.TotalRecordCount;
        alert(q);
    }
</script>

[Sujith Kumar Rajkumar]

Hi Yoab, 

 

Greetings from Syncfusion support. 

 

You can achieve your requirement of retrieving the filtered and searched data in the Grid by using the below mentioned way, 

 

Get filtered data: 

 

The Grid’s filtered data can be retrieved using the Grid’s getFilteredRecords method as demonstrated in the below code snippet, 

 

document.getElementById('filter').addEventListener('click', function () { 

    //Grid instance 

    var gridObj = document.getElementById('Grid').ej2_instances[0]; 

    // Grid's filtered data 

    var filteredData = gridObj.getFilteredRecords(); 

    alert(JSON.stringify(filteredData)); 

}); 

 

API link: https://ej2.syncfusion.com/documentation/api/grid/#getfilteredrecords  

 

Get searched data: 

 

The searched data in the Grid can be retrieved by using the EJ2 data manager instance to execute the searched Grid query with the data set in the Grid. The current Grid query can be retrieved using the generateQuery method of the Grid’s data module. The data manager instance can then be used to execute this query along with the data bound in the Grid to return the current searched data displayed in the Grid. 

 

This is demonstrated in the below code snippet, 

 

document.getElementById('search').addEventListener('click', function () { 

    // Data source set in the Grid 

    var data = @Html.Raw(Json.Serialize(ViewBag.datasource)); 

    //Grid instance 

    var gridObj = document.getElementById('Grid').ej2_instances[0]; 

    // Returns the current Grid query 

    var query = gridObj.getDataModule().generateQuery(true); 

    // Returns the data based on the current Grid query 

    // The data source set in the Grid is passed to the data manager instance here to retrieved the searched data 

    var searchedData = new ej.data.DataManager(data).executeLocal(query); 

    alert(JSON.stringify(searchedData)); 

}); 

 

Note: In the generateQuery method if we pass ‘true’ value, the page query will be skipped in the generated query so the entire data can be retrieved. 

 

We have prepared a sample based on the above queries for your reference. You can download it from the following link, 

 

Sample: https://www.syncfusion.com/downloads/support/forum/158762/ze/GridFilterSearchDataRetrieve-1742510504  

 

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

 

Regards, 

Sujith R 

[Yoab Youssoufou]

Great! Thnak you

[Sujith Kumar Rajkumar]

Hi Yoab, 

 

You’re welcome. Please get back to us if you require any further assistance. 

 

Regards, 

Sujith R