[OPEN] [#736] TreeStore - Local Sort

Page 1 of 2 12 LastLast
  1. #1

    [OPEN] [#736] TreeStore - Local Sort

    On the following sample, click on Add Record button.


    The record was added but local sort was not performed as expected (line 16).


    On version 2.x, it works as expected.

    Note: to run the example on version 2.x it's necessary to rename JsonReader's RootProperty to Root.

    Thanks in advance.

    <!DOCTYPE html>
    <html>
    <head runat="server">
        <script type="text/javascript">
            var addRecord = function () {
    
                var record = { id: 99, ID: 99, Name: 'AAAA', LastName: 'BBBB' };
    
                var rootNode = App._trp.getRootNode();
    
                var node = rootNode.createNode(record);
                node.internalId = record.ID.toString();
                node = rootNode.appendChild(record, false, true);
                node.set('leaf', true);
    
                App._str.sort();
            }
        </script>
    </head>
    <body>
        <ext:ResourceManager Theme="Gray" runat="server" />
        <ext:TreePanel ID="_trp" RootVisible="false" Title="Ext.Net" Border="true" Height="220" Width="300" runat="server">
            <Store>
                <ext:TreeStore ID="_str" RemoteSort="false" runat="server">
                    <Sorters>
                        <ext:DataSorter Property="Name" Direction="ASC" />
                    </Sorters>
                    <Proxy>
                        <ext:AjaxProxy Url="~/Example/LoadTreeFakeChildren">
                            <Reader>
                                <ext:JsonReader RootProperty="data" />
                            </Reader>
                        </ext:AjaxProxy>
                    </Proxy>
                    <Model>
                        <ext:Model runat="server">
                            <Fields>
                                <ext:ModelField Name="Name" />
                                <ext:ModelField Name="LastName" />
                            </Fields>
                        </ext:Model>
                    </Model>
                </ext:TreeStore>
            </Store>
            <Root>
                <ext:Node NodeID="0" Text="Root" />
            </Root>
            <ColumnModel>
                <Columns>
                    <ext:TreeColumn Text="Name" DataIndex="Name" Flex="2" runat="server" />
                    <ext:Column Text="LastName" DataIndex="LastName" runat="server" />
                </Columns>
            </ColumnModel>
            <View>
                <ext:TreeView DeferEmptyText="false" />
            </View>
            <Buttons>
                <ext:Button Text="Add Record" runat="server">
                    <Listeners>
                        <Click Handler="addRecord();" />
                    </Listeners>
                </ext:Button>
            </Buttons>
        </ext:TreePanel>
    </body>
    </html>
    namespace SandBox.Controllers
    {
        public class ExampleController : System.Web.Mvc.Controller
        {
            public ActionResult Index()
            {
                return View();
            }
    
            public StoreResult LoadTreeFakeChildren()
            {
                NodeCollection nodes = new NodeCollection(false);
    
                for (int index = 1; index < 6; index++)
                {
                    Node no = new Node();
                    no.NodeID = index.ToString() + DateTime.Now.Second;
                    no.CustomAttributes.Add(new ConfigItem { Name = "Name", Value = string.Format("Name - {0}", no.NodeID), Mode = ParameterMode.Value });
                    no.CustomAttributes.Add(new ConfigItem { Name = "LastName", Value = string.Format("Last Name - {0}", no.NodeID), Mode = ParameterMode.Value });
                    nodes.Add(no);
                }
    
                return new StoreResult { Data = nodes.ToJson() };
            }
    
        }
    }
    Attached Thumbnails Click image for larger version. 

Name:	ls001.png 
Views:	7 
Size:	3.4 KB 
ID:	21441   Click image for larger version. 

Name:	ls002.png 
Views:	6 
Size:	3.9 KB 
ID:	21451   Click image for larger version. 

Name:	ls003.png 
Views:	7 
Size:	3.8 KB 
ID:	21461  
    Last edited by Daniil; Feb 26, 2015 at 5:57 AM. Reason: [OPEN] [#736]
  2. #2
    Hi Raphael,

    It is probably a change in API. Not sure.

    Please use:
    App._str.sort("Name", "ASC");
  3. #3
    Store's sort works as expected, although there was a issue on it: http://forums.ext.net/showthread.php?53731.

    How can we determine whether it's a bug, change or anything else?

    Thanks in advance.
    Last edited by RCN; Feb 25, 2015 at 11:58 AM.
  4. #4
    How can we determine whether it's a bug, change or anything else?
    Do you mean a replacement of store.remoteSort = false; with store.setRemoteSort(false)?
  5. #5
    How can we determine whether it's a bug, change or anything else?
    it was regarding the following:
    It is probably a change in API. Not sure.

    App._str.sort("Name", "ASC");
    When i wrote:
    Store's sort works as expected, although there was a issue on it: http://forums.ext.net/showthread.php?53731.
    I was just saying that Store's sort does not require the property and the direction.
  6. #6
    Thanks, got it. In some scenario passing the parameters is required, in another - not required. Well, I would say it an API quirk:)
  7. #7
    According to Sencha's documentation both sorters and direction are optional.

    Reference: http://docs.sencha.com/extjs/5.0/5.0...re-method-sort

    Click image for larger version. 

Name:	st001.png 
Views:	2 
Size:	26.0 KB 
ID:	21851
    Last edited by RCN; Feb 25, 2015 at 12:39 PM.
  8. #8
    Yes. Maybe, a docs issue. Though, personally, I would expect a .sort() call without parameters toggles existing sorting.
  9. #9
    In my opinion it's a bug since it works on both 2.0 and 2.5 versions and store's sort is working.

    I will investigate and update this thread once i understand better what is going on.
    Last edited by RCN; Feb 25, 2015 at 1:45 PM.
  10. #10
    Since arguments lengh equals 0, and it's performing local sort, TreeStore's forceLocalSort is invoked (line 7)
    sort: function (field, direction, mode) {
        var me = this;
        if (arguments.length === 0) {
            if (me.getRemoteSort()) {
                me.attemptLoad();
            } else {
                me.forceLocalSort();
            }
        } else {
            me.getSorters().addSort(field, direction, mode);
        }
    }
    TreeStore's forceLocalSort invokes TreeStore Data's onSortChange
    forceLocalSort: function () {
        this.getData().onSortChange();
    }
    But since sorted is set to false, it does not perform sorting.
    onSortChange: function () {
        if (this.sorted) {
            this.sortItems();
        }
    }
    It's possible to overcome the issue by doing the following:
    Ext.data.TreeStore.override({
        forceLocalSort: function () {
            this.getData().sortItems();
        }
    });
Page 1 of 2 12 LastLast

Similar Threads

  1. Replies: 8
    Last Post: Dec 21, 2012, 6:42 AM
  2. [CLOSED] Keep TreePanelĀ“s selection after local sort
    By RCN in forum 2.x Legacy Premium Help
    Replies: 2
    Last Post: Jun 23, 2012, 7:05 PM
  3. Replies: 4
    Last Post: Jul 25, 2011, 4:57 PM
  4. Replies: 4
    Last Post: Nov 11, 2010, 11:46 AM
  5. [CLOSED] Inserted records dissapear after local sort operation
    By pschojer in forum 1.x Legacy Premium Help
    Replies: 3
    Last Post: Apr 23, 2010, 5:00 AM

Posting Permissions