[CLOSED] Grid Event After Store Data is loaded

  1. #1

    [CLOSED] Grid Event After Store Data is loaded

    Hello,
    I would like to listen to a grid event that fires every time the display data is changed and after the store is loaded. I tried the store load event but it has no reference to the grid as far as I can tell. Is there an event or a way to get this functionality? I even tried the RelayEvent on the grid but this requires that I provide an ID and in my case I cannot do that.
    Thanks.
    Last edited by fabricio.murta; Dec 02, 2016 at 5:27 PM.
  2. #2
    Hello Emidio!

    If you have bound the event to the grid itself, this should point to the grid in the event handler! I'm not sure how you tried it and what your requirements are that are not allowing you to fetch the event trigger grid during the call...
    Fabrício Murta
    Developer & Support Expert
  3. #3
    Hi Fabricio,
    Is there an example with RelayEvents? The signature is
    public virtual void RelayEvents
    ( 
       string origin, 
       string[] events 
    )
    I am not sure what the "origin" is looking for...is it the "ID" of the origin control? Is it the type of the origin control? What if my origin control does not have an id? My attempt at making it work looks like this..

    Ext.Net.GridPanel oGridPanel
    	= new Ext.Net.GridPanel ( )
    
    Ext.Net.Store oStore
    	= new Ext.Net.Store ( )
    
    oStore.Listeners.Load.Handler
    	= @"Core.Browser.OnResultsGridStoreLoad ( this )";
    
    oGridPanel.RelayEvents 
    	( "store" , new string [ ] { "load" } );
    
    
    <script type="text/javascript">
            this.OnResultsGridStoreLoad = function ( sender )
            {
                 var oGrid = sender;
    
                 ....
            }
    
    </script>
    It does not seem to work. My goal is to get a reference to the grid control when the "load" event of the "store" fires. As a result, I would receive a reference to the grid as the "sender" parameter in the "OnResultsGridStoreLoad" javascript function. What am I doing wrong?
    Thanks
    Last edited by edip; Dec 02, 2016 at 1:10 PM.
  4. #4
    Hello Emidio!

    I probably still don't understand your needs but I don't think relayEvent is what you need. The gridPanel fires the load (or the store bound to the grid panel... or the view bound to the gridPanel). While a store may not have a reference to the gridPanel, the grid panel's view will, and you should be able to bind the refresh event, for example.

    You can review relayEvents() documentation, origin is the component which the current component will be relaying. A little confuse but I believe you'll understand once you read the documentation.

    I couldn't piece together your code snippets to make anything out of what you provided, unfortunately. Instead, check this example:

    <%@ Page Language="C#" %>
    
    <script runat="server">
        protected void Page_Load(object sender, EventArgs e)
        {
            if (!X.IsAjaxRequest)
            {
                this.Store1.DataSource = this.Data;
            }
        }
    
        private object[] Data
        {
            get
            {
                return new object[]
                {
                    new object[] { "3m Co", 71.72, 0.02, 0.03, "9/1 12:00am" },
                    new object[] { "Alcoa Inc", 29.01, 0.42, 1.47, "9/1 12:00am" },
                    new object[] { "Altria Group Inc", 83.81, 0.28, 0.34, "9/1 12:00am" },
                    new object[] { "American Express Company", 52.55, 0.01, 0.02, "9/1 12:00am" },
                    new object[] { "American International Group, Inc.", 64.13, 0.31, 0.49, "9/1 12:00am" },
                    new object[] { "AT&T Inc.", 31.61, -0.48, -1.54, "9/1 12:00am" },
                    new object[] { "Boeing Co.", 75.43, 0.53, 0.71, "9/1 12:00am" },
                    new object[] { "Caterpillar Inc.", 67.27, 0.92, 1.39, "9/1 12:00am" },
                    new object[] { "Citigroup, Inc.", 49.37, 0.02, 0.04, "9/1 12:00am" }
                };
            }
        }
    </script>
    
    <!DOCTYPE html>
    
    <html>
    <head runat="server">
        <title>Grid panel load/reload event: reference to own grid</title>
    </head>
    <body>
        <ext:ResourceManager runat="server" />
    
        <h1>Simple Array Grid</h1>
    
        <ext:GridPanel
            runat="server"
            Title="Array Grid"
            Width="700"
            Height="350">
            <Store>
                <ext:Store ID="Store1" runat="server">
                    <Model>
                        <ext:Model runat="server">
                            <Fields>
                                <ext:ModelField Name="company" />
                                <ext:ModelField Name="price" Type="Float" />
                                <ext:ModelField Name="change" Type="Float" />
                                <ext:ModelField Name="pctChange" Type="Float" />
                                <ext:ModelField Name="lastChange" Type="Date" DateFormat="M/d hh:mmtt" />
                            </Fields>
                        </ext:Model>
                    </Model>
                </ext:Store>
            </Store>
            <ColumnModel>
                <Columns>
                    <ext:Column runat="server" Text="Company" DataIndex="company" Flex="1" />
                    <ext:Column runat="server" Text="Price" DataIndex="price" />
                    <ext:Column runat="server" Text="Change" DataIndex="change" />
                    <ext:Column runat="server" Text="Change" DataIndex="pctChange" />
                    <ext:DateColumn runat="server" Text="Last Updated" DataIndex="lastChange" Width="120" />
                </Columns>
            </ColumnModel>
            <SelectionModel>
                <ext:RowSelectionModel runat="server" />
            </SelectionModel>
            <ViewConfig runat="server">
                <Listeners>
                    <Refresh Handler="Ext.Msg.alert('Panel ID', 'Panel ID is [' + this.ownerGrid.id + ']');" />
                </Listeners>
            </ViewConfig>
            <BottomBar>
                <ext:Toolbar runat="server">
                    <Items>
                        <ext:Button runat="server" Text="Reload" Icon="Reload" Handler="this.up('grid').getView().refresh();" />
                    </Items>
                </ext:Toolbar>
            </BottomBar>
        </ext:GridPanel>
    </body>
    </html>
    Hope this helps!
  5. #5
    Hi Fabricio,
    I am trying to create my own paging toolbar because I need specific functionality that is not provided with the built in paging toolbar. I have tried the refresh event on the gridview, but the only problem is that it fires before the "load" event of the store. I need the new state of the store to execute the paging toolbar logic ( ie. enable and disable first, last, previous, and next buttons ). I could probably hack it and save a reference to the grid on the "refresh" event, but I prefer to do things properly.
    Thanks.
  6. #6
    Hi Fabricio,
    I just realized that the "refresh" event fires 2 times. Once before the store is loaded and once after. So, this will work fine for me. Please close this support incident. Thanks, Emidio
  7. #7
    Glad it worked for you Emidio! Thanks for the feedback!
    Fabrício Murta
    Developer & Support Expert

Similar Threads

  1. Replies: 11
    Last Post: Feb 11, 2015, 2:00 PM
  2. [CLOSED] Show hide a ImageCommandColumn AFTER the Grid Data are loaded
    By Peter.Treier in forum 2.x Legacy Premium Help
    Replies: 3
    Last Post: Aug 26, 2014, 5:47 PM
  3. Replies: 6
    Last Post: Apr 30, 2013, 1:44 PM
  4. Replies: 1
    Last Post: May 18, 2009, 1:41 PM

Tags for this Thread

Posting Permissions