[CLOSED] TreePanel - sorting behavior on drop

  1. #1

    [CLOSED] TreePanel - sorting behavior on drop

    Hello! I'm working on a TreePanel interface and I'm not sure how to achieve a piece of functionality. I'm sure there's a way to do, but I haven't been able to find it in the docs.

    Please consider this example:

    <!DOCTYPE html>
    
    
    <html xmlns="http://www.w3.org/1999/xhtml">
    <head runat="server">
        <title>Ext.NET 2.2 Example</title>
        <ext:ResourcePlaceHolder runat="server" ID="ResourcePlaceHolder1" />
    </head>
    <body>
        <form id="form1" runat="server"> 
            
            <ext:ResourceManager runat="server" />       
    
    
            <%-- Viewport --%>
            <ext:Viewport runat="server" ID="ViewportMain" StyleSpec="background-color: #DFE8F6" Layout="FitLayout">
                <Items>
                    <ext:TreePanel runat="server" ID="ServiceNodeTreePanel" ClientIDMode="Static" RootVisible="false" SingleExpand="true">
                        <Model>
                            <ext:Model runat="server" ID="ServiceNodeModel">
                                <Fields>                                                                
                                    <ext:ModelField Name="Title" Type="String" />                                
                                </Fields>
                            </ext:Model>
                        </Model>                    
                        <ColumnModel>
                            <Defaults>
                                <ext:Parameter Name="Sortable" Value="false" />
                            </Defaults>
                            <Columns>                            
                                <ext:TreeColumn ID="TreeColumn1" runat="server" Text="Title" DataIndex="Title" Flex="1" />
                            </Columns>
                        </ColumnModel>
                        <Root>
                            <ext:Node NodeID="0" Text="Root">
                                <Children>
                                    <ext:Node Expanded="true">
                                        <CustomAttributes>
                                            <ext:ConfigItem Name="Title" Value="Category 1" />
                                        </CustomAttributes>
                                        <Children>
                                            <ext:Node EmptyChildren="true">
                                                <CustomAttributes>
                                                    <ext:ConfigItem Name="Title" Value="Category 2" />
                                                </CustomAttributes>
                                            </ext:Node>
                                            <ext:Node Leaf="true">
                                                <CustomAttributes>
                                                    <ext:ConfigItem Name="Title" Value="Leaf 1" />
                                                </CustomAttributes>
                                            </ext:Node>
                                        </Children>
                                    </ext:Node>
                                    <ext:Node EmptyChildren="true">
                                        <CustomAttributes>
                                            <ext:ConfigItem Name="Title" Value="Category 3" />
                                        </CustomAttributes>
                                    </ext:Node>
                                </Children>
                            </ext:Node>
                        </Root>
                        <View>
                            <ext:TreeView runat="server">
                                <Plugins>
                                    <ext:TreeViewDragDrop runat="server" />
                                </Plugins>
                            </ext:TreeView>
                        </View>
                    </ext:TreePanel>
                </Items>
            </ext:Viewport>
        </form>
    </body>
    </html>
    When I drag "Category 3" onto "Category 1", it is appended after the last child, which is a leaf. I would prefer to have it append after the last folder, but before the first leaf in the drop target's child node collection. That is, the tree should look like this:

    Category 1
    -- Category 2
    -- Category 3
    -- Leaf 1

    But instead it looks like this:

    Category 1
    -- Category 2
    -- Leaf 1
    -- Category 3

    I'm not sure whether I need to intercept the event and modify the index parameter before the drop or do some kind of reorder operation afterwards. If anyone could let me know how to achieve this functionality it would be a great help.

    Thanks!
    Last edited by Daniil; Sep 24, 2013 at 3:42 AM. Reason: [CLOSED]
  2. #2
    Hi @jwf,

    You can do the following:

    <ext:TreePanel>
        <Store>
            <ext:TreeStore runat="server">
                <Model>
                    <ext:Model runat="server" ID="ServiceNodeModel">
                        <Fields>                                                                
                            <ext:ModelField Name="Title" Type="String" />                                
                        </Fields>
                        </ext:Model>
                </Model>
                <Sorters>
                    <ext:DataSorter Property="Title" />
                </Sorters>
            </ext:TreeStore>
        </Store>
    <ext:TreeViewDragDrop runat="server" SortOnDrop="true" />
  3. #3
    Hi Daniil,

    Thanks for the advice, it led me to using the sort function and creating my own custom comparer. You can mark this thread as closed.

Similar Threads

  1. Drag Drop events in TreePanel
    By web4u in forum 2.x Help
    Replies: 0
    Last Post: Aug 08, 2012, 6:31 AM
  2. [CLOSED] Drag and drop from treepanel to treepanel in "copy" mode
    By mattwoberts in forum 1.x Legacy Premium Help
    Replies: 2
    Last Post: Jul 14, 2011, 6:45 PM
  3. [CLOSED] Alternative to Drag/Drop sorting in Multiselect
    By jthompson in forum 1.x Legacy Premium Help
    Replies: 1
    Last Post: Jan 24, 2011, 7:55 PM
  4. TreePanel - Drag & Drop
    By jigpatel06 in forum 1.x Help
    Replies: 0
    Last Post: Oct 19, 2010, 10:31 AM
  5. [CLOSED] TreePanel Drag and Drop
    By davidhoyt in forum 1.x Legacy Premium Help
    Replies: 3
    Last Post: Jan 28, 2009, 5:24 AM

Tags for this Thread

Posting Permissions