[CLOSED] Grid is loading records when performing initial sort

  1. #1

    [CLOSED] Grid is loading records when performing initial sort

    On version 2.x, When there is no record loaded into the grid, it's possible to sort it without firing grid's load.



    But on version 3.1, it's firing grid's load when performing initial sort.

    Side effect: In my scenario, presented here as simple as possible, some validations are performed before grid's load, and if returns false, there is no visual effect when user performs initial sorting.

    Thanks in advance
    <!DOCTYPE html>
    <html>
    <head id="Head1" runat="server">
        <script type="text/javascript">
            var DoLoad = function () {
                App._str.allowLoad = true;
    
                App._str.loadPage(1);
            }
    
            var BeforeLoad = function () {
                return App._str.allowLoad;
            }
        </script>
    </head>
    <body>
        <ext:ResourceManager runat="server" />
        <ext:Button Text="Load" runat="server">
            <Listeners>
                <Click Handler="DoLoad();" />
            </Listeners>
        </ext:Button>
        <br />
        <ext:GridPanel Title="Ext.Net" Frame="false" Width="500" Height="500" runat="server">
            <Store>
                <ext:Store AutoLoad="false" ID="_str" RemoteSort="true" runat="server">
                    <Listeners>
                        <BeforeLoad Handler="return BeforeLoad();" />
                    </Listeners>
                    <CustomConfig>
                        <ext:ConfigItem Name="allowLoad" Value="false" Mode="Raw" />
                    </CustomConfig>
                    <Sorters>
                        <ext:DataSorter Property="ID" Direction="ASC" />
                    </Sorters>
                    <Proxy>
                        <ext:AjaxProxy Url="~/Example/LoadFakeRecords/">
                            <ActionMethods Read="POST" />
                            <Reader>
                                <ext:JsonReader RootProperty="data" />
                            </Reader>
                        </ext:AjaxProxy>
                    </Proxy>
                    <Model>
                        <ext:Model IDProperty="ID" runat="server">
                            <Fields>
                                <ext:ModelField Name="ID" Type="int" />
                                <ext:ModelField Name="Name" Type="String" />
                                <ext:ModelField Name="LastName" Type="String" />
                                <ext:ModelField Name="Address" Type="String" />
                            </Fields>
                        </ext:Model>
                    </Model>
                </ext:Store>
            </Store>
            <ColumnModel runat="server">
                <Columns>
                    <ext:Column Text="ID" DataIndex="ID" runat="server" />
                    <ext:Column Text="Name" Flex="1" DataIndex="Name" runat="server" />
                    <ext:Column Text="Last Name" DataIndex="LastName" runat="server" />
                    <ext:Column Text="Address" DataIndex="Address" runat="server" />
                </Columns>
            </ColumnModel>
        </ext:GridPanel>
    </body>
    </html>
    namespace SandBox.Controllers
    {
        public class ExampleController : System.Web.Mvc.Controller
        {
            public ActionResult Index()
            {
                return View();
            }
    
            public StoreResult LoadFakeRecords()
            {
                List<Entity> lst = new List<Entity>();
    
                for (int index = 0; index < 15; index++)
                {
                    lst.Add(new Entity
                    {
                        ID = index,
                        Name = string.Format("Name - {0}", index),
                        LastName = string.Format("Last Name - {0}", index),
                        Address = string.Format("Address - {0}", index)
                    });
                }
    
                return new StoreResult(lst, lst.Count());
            }
        }
    
        [Serializable]
        public class Entity
        {
            public int ID { get; set; }
    
            public string Name { get; set; }
    
            public string LastName { get; set; }
    
            public string Address { get; set; }
        }
    }
    Attached Thumbnails ds001.png  
    Last edited by Daniil; Feb 02, 2015 at 5:11 AM. Reason: [CLOSED]
  2. #2
    Hi Raphael,

    That is an interesting change in the behavior. I am not sure what is more correct - previous or current.

    To revert back the old behavior you can try this override.
    Ext.grid.column.Column.override({
        sort: function() {
            var grid = this.up('tablepanel'),
                store = grid.getStore();
    
            this.callParent(arguments);
    
            if (!store.isLoaded()) {
                grid.getView().refresh();
            }
        }
    });
    I doubt we will incorporate it to Ext.NET, but I'll keep that in mind.
  3. #3
    Daniil, i would prefer to use
    this.gridRef
    instead of
    this.up('tablepanel')
    So, we would have the following:
    Ext.grid.column.Column.override({
        sort: function () {
            var grid = this.gridRef;
    
            var store = grid.getStore();
    
            this.callParent(arguments);
    
            if (!store.isLoaded()) {
                grid.getView().refresh();
            }
        }
    });
    But i prefer the following
    Ext.grid.column.Column.override({
        sort: function () {
            this.callParent(arguments);
            if (!this.gridRef.getStore().isLoaded()) {
                this.gridRef.getView().refresh();
            }
        }
    });
    Going further, i would like to aware you that on version 3.1, column's grid member has been replaced by column's gridRef member.

    It's up to you whether this should be added to Breaking Changes Document.
    Last edited by RCN; Feb 02, 2015 at 2:09 AM.
  4. #4
    Thank you Daniil.

    If you agree, please mark this thread as closed.
  5. #5
    Yes, in my override there is no need in the store reference.

    As for the gridRef. Yes, it has been renamed recently. Initially, it was introduced in Ext.NET (not ExtJS) and not supposed to be used publicly. I mean it is meant to be a piece of API. We use it internally in our components and overrides. Though, it looks like we started to use it as API sometimes. Now I see that developers (you, at least) started to use it. Well... finally, I think it is worth to add it to the breaking changes document. I added locally and will be committing soon. Thank you for pointing out the problem.
  6. #6
    Yes, in my override there is no need in the store reference.
    Did you mean grid reference?

    As for the gridRef. Yes, it has been renamed recently. Initially, it was introduced in Ext.NET (not ExtJS) and not supposed to be used publicly. I mean it is meant to be a piece of API. We use it internally in our components and overrides. Though, it looks like we started to use it as API sometimes. Now I see that developers (you, at least) started to use it. Well... finally, I think it is worth to add it to the breaking changes document. I added locally and will be committing soon. Thank you for pointing out the problem.
    I will aware you anytime i find a member that has been renamed, ok?
    Last edited by RCN; Feb 02, 2015 at 5:40 AM.
  7. #7
    Did you mean grid reference?
    No, I meant that:
    Ext.grid.column.Column.override({
        sort: function() {
            var grid = this.up('tablepanel'),
                store = grid.getStore();
    
            this.callParent(arguments);
    
            if (!store.isLoaded()) {
                grid.getView().refresh();
            }
        }
    });
    could be replaced with
    Ext.grid.column.Column.override({
        sort: function() {
            var grid = this.up('tablepanel');
    
            this.callParent(arguments);
    
            if (!grid.getStore().isLoaded()) {
                grid.getView().refresh();
            }
        }
    });
    Going further, yes, you could use this.gridRef instead of this.up('tablepanel').

    I will aware you anytime i find a member that has been renamed, ok?
    Sorry, seems I don't understand what exactly you mean. Please elaborate/rephrase.
  8. #8
    I will aware you anytime i find a member that has been renamed, ok?
    Sorry, seems I don't understand what exactly you mean. Please elaborate/rephrase.
    At this time grid was renamed to gridRef. If i find a new variable renaming i will post in the forums, so other users may be aware of the change.
  9. #9
    Do you mean any other new variable except gridRef? Sure, you are always welcome to post any information like that.
  10. #10
    Do you mean any other new variable except gridRef?
    Yes.

    Sure, you are always welcome to post any information like that.
    Thank you.

Similar Threads

  1. Replies: 2
    Last Post: Oct 27, 2014, 5:24 AM
  2. Replies: 7
    Last Post: Jan 23, 2013, 4:36 PM
  3. Replies: 3
    Last Post: Sep 13, 2012, 8:52 AM
  4. [ Initial Page Start Loading (Mask Load) ]
    By iDevSEO in forum 1.x Help
    Replies: 2
    Last Post: Dec 29, 2011, 1:15 PM
  5. Replies: 3
    Last Post: Apr 23, 2010, 5:00 AM

Posting Permissions