Updating GridPanel Store

  1. #1

    Updating GridPanel Store

    I had a hard time figuring out how to update store in 7.2 in controller.
    Posting my solution. Hopefully it will save time for someone.

    List<Company> GetCompanies()
            {
                return new List<Company>
                {
                    new Company {id = 1, name = "3m Co" },
                    new Company {id = 2, name = "Alcoa Inc" },
                    new Company {id = 3, name = "Altria Group Inc" },
                    new Company {id = 4, name = "American Express Company" },
                };
            }
    
    public void OnGet()
            {
                this.GridData ??= GetCompanies().ToList<object>();
            }
    
    public IActionResult OnPostButtonSave_Click(int id, string name, string window)
            {
                List<Company> companies = GetCompanies();
                companies.FirstOrDefault(c => c.id == id).name = name;
    
                this.GetCmp<Window>(window).Close();
                var gp = this.GetCmp<GridPanel>("gpOne");
                gp.Store = new Store
                {
                    Data = companies.ToList<object>(),
                    Fields = new List<DataField>
                    {
                        new NumberDataField { Name = "id" },
                        new DataField{ Name = "name" },
                    }
                };
                return this.Direct();
            }
    Last edited by VADIM; Apr 04, 2021 at 4:11 PM. Reason: Update
  2. #2
    Hello @VADIM!

    Thanks for sharing the solution that works for you! You probably could improve it as there's the need to create a full store each time the data is updated. The best way would, maybe by using a proxy to refresh the data and only the data into the grid.

    It is also to do it via direct events if you are using a button or another client-interatable component to refresh the grid. Roughly speaking, you'd have the direct event return just the data, in lines like that

    private static string now {
        get => DateTime.Now.ToString("yyyy-MM-dd hh:mm:tt");
    }
    
    public List<object> GridData = new List<object>
    {
        new object[] { "3m Co", 71.72, 0.02, 0.03, now },
        new object[] { "Alcoa Inc", 29.01, 0.42, 1.47, now },
        new object[] { "Altria Group Inc", 83.81, 0.28, 0.34, now }
    }
    
    public IActionResult OnPostRefreshGrid()
    {
        return this.Direct(GridData); // your array-of-arrays or array-of-objects containing the grid data
    }
    And assign a success callback to the Direct Event to build up the fetched data in the grid:

    <ext-button text="Load">
        <directEvents>
            <click pageHandler="RefreshGrid" success="App.companyStore2.setData(Ext.decode(response.responseText).result)" method="POST" />
        </directEvents>
    </ext-button>
    The proxy approach would be better integrated with paging, remote sorting/filtering and other dynamic interactions; you can already find some examples of dynamic data with proxy in some threads around:

    - GridPanel remote paging problems
    - Store Filter with GridPanel Paging

    There may be more threads about this functionality if you browse, I just pointed a couple highlights.

    Hope this helps!
    Fabrício Murta
    Developer & Support Expert
  3. #3
    Thanks Fabricio!

    That is really simple.
    Hopefully some day such examples will be available at Ext.Net > Examples.

    Today spent several hours figuring out how to auto-resize an image in a flex panel.
    Finally got it. So many concepts still have no examples :(

    Vadim
  4. #4
    Hello again, @VADIM!

    We understand your frustration about examples. Can you imagine how many examples to illustrate every possible scenario in Ext.NET? I am not sure we have an example for your image scenario in our Ext.NET version 5 WebForms Examples Explorer; with, maybe among the closest ones, the Logos Example using DrawContainer component, probably still not an exact match to what you needed.

    By the way, you knew about examples 5 explorer, right? They have a comprehensive collection of examples, all that can (with some changes) be ported to Ext.NET 7. Basically the data transfer interface changes, so it's going to be a case by case porting endeavor; but they can give a good view on what can (and can't) be done with Ext.NET 7, nevertheless.

    Many client-server communication concepts can also be pulled from the Ext.NET version 5 MVC Examples Explorer. There are less examples there -- yet, more than v7 explorer -- and they showcase some examples and concepts that can be fully reused in MVC model (with the this.GetCmp<>() notable example), but can also be applied in the RazorPages environment, as a number of the WebForms ASP.NET features were left behind in the rise of ASP.NET Core with the TagHelpers and RazorPages tech.

    We are gradually adding more examples to Examples Explorer 7, so if you have trouble translating any v5 example into v7 one, let us know and we will port it for the new examples explorer.

    Hope this helps!
    Fabrício Murta
    Developer & Support Expert

Similar Threads

  1. [CLOSED] Updating Store from Selected Record in GridPanel
    By Argenta in forum 3.x Legacy Premium Help
    Replies: 4
    Last Post: Mar 01, 2016, 4:24 PM
  2. [CLOSED] Auto Updating Store Custom Component
    By vgvallee in forum 2.x Legacy Premium Help
    Replies: 4
    Last Post: Oct 22, 2013, 11:44 PM
  3. Help! Updating Store with complex data...
    By maxiom in forum 1.x Help
    Replies: 1
    Last Post: Aug 06, 2012, 8:49 AM
  4. [CLOSED] Store Filter Not Updating Grid
    By peter.campbell in forum 1.x Legacy Premium Help
    Replies: 6
    Last Post: May 23, 2012, 3:47 PM
  5. Updating GridPanel Store in AjaxEvent
    By niceguymattx in forum 1.x Help
    Replies: 2
    Last Post: Mar 10, 2010, 5:36 AM

Posting Permissions