How to get grid data

[JoeCSolomon]

How do you get the filtered and sorted data out of the Blazor IgbDataGrid grid? It does not have the Filtered... methods that Angular has.

[zdrawku]

Hey Joseph, I will get back to you shortly on this. As I see, we do not have such methods exposed for Blazor, yet.

https://www.infragistics.com/blazor/docs/api/api/IgniteUI.Blazor.Controls.IgbDataGrid.html#IgniteUI_Blazor_Controls_IgbDataGrid_GetCurrentSelectedItems

[zdrawku]

As our dev team has replied in Discord:

You could use a strategy like this:

protected async void onButtonClick(MouseEventArgs args)
    {
        var view = await JSRuntime.InvokeAsync<string[]>("getCurrentView", "dataGrid1");

        Dictionary<string, CountryStatsItem> primaryKeyMap = new Dictionary<string, CountryStatsItem>();
        for (var i = 0; i < CountryStats.Count; i++)
        {
            primaryKeyMap[CountryStats[i].Code] = CountryStats[i];
        }
        List<CountryStatsItem> dataView = new List<CountryStatsItem>();
        for (var i = 0; i < view.Length; i++)
        {
            dataView.Add(primaryKeyMap[view[i]]);
        }

        Debug.WriteLine(dataView.Count);
        for (var i = 0; i < dataView.Count; i++)
        {

            Debug.WriteLine(dataView[i].Name);
        }
        Debug.WriteLine("done");
    }

making sure to add some js to the main html to handle the JS part of the action:

<script>
        window.getCurrentView = function (gridId) {
            console.log("here");
            let grid = document.querySelector("#dataGrid1 igc-data-grid");
            let ds = grid.actualDataSource;

            let ret = [];
            for (let i = 0; i < ds.actualCount; i++) { 
                let keyVal = ds.getItemPropertyAtIndex(i, ds.actualPrimaryKey[0]);
                ret.push(keyVal);
            }
            console.log(ret);
            //return JSON.stringify(ret);
            return ret;
        }
    </script>

based on a grid defined like so:

<IgbDataGrid id="dataGrid1"
                    DataSource="CountryStats"
                    IsColumnOptionsEnabled="true"
                    SelectionMode="GridSelectionMode.MultipleRow"
                    PrimaryKey="primaryKey"
                    Name="dataGrid1"
                    @ref="dataGrid1">
       </IgbDataGrid>

note, this relies on having defined a primary key so that values can be be corellated

[JoeCSolomon]

Thanks! I will try this out this week. Joe From: Zdravko Kolev ***@***.***> Sent: Tuesday, September 27, 2022 11:52 AM To: IgniteUI/app-builder ***@***.***> Cc: Solomon, Joseph C ***@***.***>; Author ***@***.***> Subject: Re: [IgniteUI/app-builder] How to get grid data (Discussion #18) As our dev team has replied in Discord: You could use a strategy like this: protected async void onButtonClick(MouseEventArgs args) { var view = await JSRuntime.InvokeAsync<string[]>("getCurrentView", "dataGrid1"); Dictionary<string, CountryStatsItem> primaryKeyMap = new Dictionary<string, CountryStatsItem>(); for (var i = 0; i < CountryStats.Count; i++) { primaryKeyMap[CountryStats[i].Code] = CountryStats[i]; } List<CountryStatsItem> dataView = new List<CountryStatsItem>(); for (var i = 0; i < view.Length; i++) { dataView.Add(primaryKeyMap[view[i]]); } Debug.WriteLine(dataView.Count); for (var i = 0; i < dataView.Count; i++) { Debug.WriteLine(dataView[i].Name); } Debug.WriteLine("done"); } making sure to add some js to the main html to handle the JS part of the action: <script> window.getCurrentView = function (gridId) { console.log("here"); let grid = document.querySelector("#dataGrid1 igc-data-grid"); let ds = grid.actualDataSource; let ret = []; for (let i = 0; i < ds.actualCount; i++) { let keyVal = ds.getItemPropertyAtIndex(i, ds.actualPrimaryKey[0]); ret.push(keyVal); } console.log(ret); //return JSON.stringify(ret); return ret; } </script> based on a grid defined like so: <IgbDataGrid id="dataGrid1" DataSource="CountryStats" IsColumnOptionsEnabled="true" SelectionMode="GridSelectionMode.MultipleRow" PrimaryKey="primaryKey" Name="dataGrid1" @ref="dataGrid1"> </IgbDataGrid> note, this relies on having defined a primary key so that values can be be corellated — Reply to this email directly, view it on GitHub<https://urldefense.com/v3/__https:/github.com/IgniteUI/app-builder/discussions/18*discussioncomment-3744770__;Iw!!NHLzug!L_o7EHNOuYkBWDKsnLMXYiJirk92hc74t-4NcNhJC_L0jMbC3LGw4MRWoKxpjDCueYT5VymV1xHiQNvz2uzwow4x_A$>, or unsubscribe<https://urldefense.com/v3/__https:/github.com/notifications/unsubscribe-auth/A2SFE7FYMJVAVMOJG7D45CLWAMJ3BANCNFSM56ZG622Q__;!!NHLzug!L_o7EHNOuYkBWDKsnLMXYiJirk92hc74t-4NcNhJC_L0jMbC3LGw4MRWoKxpjDCueYT5VymV1xHiQNvz2uz5aljuWQ$>. You are receiving this because you authored the thread.Message ID: ***@***.******@***.***>>