[CLOSED] Need of Coolite TreePanel 0.8 examples

Hybrid View

Previous Post Previous Post   Next Post Next Post
  1. #1

    [CLOSED] Need of Coolite TreePanel 0.8 examples

    Dear Team:

    We have our Web Application created and hosted with coolite 0.8 version.

    Our requirement is to Integrate 2 Tree Panel, add the Items from one Tree Panel to another one (also vice versa), i am not able to find any examples for 0.8 version. Please provide me the examples if you have any ?
    Last edited by Daniil; Dec 16, 2010 at 12:31 PM. Reason: [CLOSED]
  2. #2
    Hi,

    Please clarify do you mean drag and drop? Something like the following?
    https://examples1.ext.net/#/TreePane...Between_Trees/
  3. #3

    Need of Coolite TreePanel 0.8 examples

    Hi Daniil:

    I am in need of requirement as follows, when i select a node from left side and click on ">" button the node has to moved to right side
    and vice versa. Need example for 0.8 version, please don't forget.

    Click image for larger version. 

Name:	Tree.jpg 
Views:	489 
Size:	28.1 KB 
ID:	2029
  4. #4
    Hi,

    Example
    <%@ Page Language="C#" %>
    
    <%@ Register Assembly="Coolite.Ext.Web" Namespace="Coolite.Ext.Web" TagPrefix="ext" %>
    
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" 
        "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml">
    <head runat="server">
        <title>Coolite 0.8.X Example</title>
    
        <script type="text/javascript">
            var X = {
                add: function(source, destination) {
                    source = source || TreePanel1;
                    destination = destination || TreePanel2;
                    var selectedNode = source.getSelectionModel().getSelectedNode();
                    if (selectedNode) {
                        destination.getRootNode().appendChild(selectedNode);
                    }
                },
                
                addAll: function(source, destination) {
                    source = source || TreePanel1;
                    destination = destination || TreePanel2;
                    destination.getRootNode().appendChild(source.getRootNode().childNodes.slice());
                },
    
                remove: function(source, destination) {
                    this.add(destination, source);
                },
                
                removeAll: function(source, destination) {
                    this.addAll(destination, source);
                }
            };
        </script>
    
    </head>
    <body>
        <form runat="server">
        <ext:ScriptManager runat="server" />
        <ext:Panel runat="server" Height="200" Width="500">
            <Body>
                <ext:ColumnLayout runat="server" FitHeight="true">
                    <ext:LayoutColumn ColumnWidth="0.5">
                        <ext:TreePanel ID="TreePanel1" runat="server" RootVisible="false">
                            <Root>
                                <ext:TreeNode Text="Root" Expanded="true">
                                    <Nodes>
                                        <ext:TreeNode Text="Node1" Leaf="true" />
                                        <ext:TreeNode Text="Node2" Leaf="true" />
                                        <ext:TreeNode Text="Node3" Leaf="true" />
                                        <ext:TreeNode Text="Node4" Leaf="true" />
                                        <ext:TreeNode Text="Node5" Leaf="true" />
                                    </Nodes>
                                </ext:TreeNode>
                            </Root>
                        </ext:TreePanel>
                    </ext:LayoutColumn>
                    <ext:LayoutColumn>
                        <ext:Panel 
                            runat="server" 
                            Width="35" 
                            BodyStyle="background-color: transparent;" 
                            Border="false">
                            <Body>
                                <ext:AnchorLayout runat="server">
                                    <ext:Anchor Vertical="25%">
                                        <ext:Panel runat="server" Border="false" BodyStyle="background-color: transparent;" />
                                    </ext:Anchor>
                                    <ext:Anchor>
                                        <ext:Panel runat="server" Border="false" BodyStyle="padding:5px;background-color: transparent;">
                                            <Body>
                                                <ext:Button runat="server" Icon="ResultsetNext" StyleSpec="margin-bottom:2px;">
                                                    <Listeners>
                                                        <Click Handler="X.add();" />
                                                    </Listeners>
                                                    <ToolTips>
                                                        <ext:ToolTip runat="server" Title="Add" Html="Add Selected Node" />
                                                    </ToolTips>
                                                </ext:Button>
                                                <ext:Button runat="server" Icon="ResultsetLast" StyleSpec="margin-bottom:2px;">
                                                    <Listeners>
                                                        <Click Handler="X.addAll();" />
                                                    </Listeners>
                                                    <ToolTips>
                                                        <ext:ToolTip runat="server" Title="Add all" Html="Add All Nodes" />
                                                    </ToolTips>
                                                </ext:Button>
                                                <ext:Button runat="server" Icon="ResultsetPrevious" StyleSpec="margin-bottom:2px;">
                                                    <Listeners>
                                                        <Click Handler="X.remove(TreePanel1, TreePanel2);" />
                                                    </Listeners>
                                                    <ToolTips>
                                                        <ext:ToolTip runat="server" Title="Remove" Html="Remove Selected Node" />
                                                    </ToolTips>
                                                </ext:Button>
                                                <ext:Button runat="server" Icon="ResultsetFirst" StyleSpec="margin-bottom:2px;">
                                                    <Listeners>
                                                        <Click Handler="X.removeAll(TreePanel1, TreePanel2);" />
                                                    </Listeners>
                                                    <ToolTips>
                                                        <ext:ToolTip runat="server" Title="Remove all" Html="Remove All Nodes" />
                                                    </ToolTips>
                                                </ext:Button>
                                            </Body>
                                        </ext:Panel>
                                    </ext:Anchor>
                                </ext:AnchorLayout>
                            </Body>
                        </ext:Panel>
                    </ext:LayoutColumn>
                    <ext:LayoutColumn ColumnWidth="0.5">
                        <ext:TreePanel ID="TreePanel2" runat="server" RootVisible="false">
                            <Root>
                                <ext:TreeNode Text="Root" Expanded="true" />
                            </Root>
                        </ext:TreePanel>
                    </ext:LayoutColumn>
                </ext:ColumnLayout>
            </Body>
        </ext:Panel>
        </form>
    </body>
    </html>
  5. #5

    Need of Coolite TreePanel 0.8 examples

    Hi Daniil:

    Thanks, it worked, is it possible for me to get a complete example for TreePanel, because i have to do lot of manipulations with Tree Panel, like changing the order up/down, adding/deleting a node/parent node, change the properties of the node. Save the Node values in an XML. it will be helpful if i get a complete example.


    Thanks.
  6. #6
    Hi,

    Unfortunately, we have no complete TreePanel example to achieve your requirements. Also TreePanel's functionality in Coolite 0.8.x is rather restricted compared with Ext.Net 1.0.

    like changing the order up/down
    You could convert to 0.8.x the following example
    https://examples1.ext.net/#/TreePane...Reorder_Nodes/

    adding/deleting a node/parent node
    There are respective .parentNode, .childNodes, .appendChild(), .remove(), .removeChild() members of TreeNode class, see
    http://dev.sencha.com/deploy/yui-ext....tree.TreeNode

    change the properties of the node
    There are respective .attributes, .setText() members of TreeNode, see the link above.

    Save the Node values in an XML.
    Please clarify what exactly problems do you have with this requirement?

    P.S. Could you clarify why do you use 0.8.x? I would suggest you to migrate to Ext.Net 1.0.

    Many-many things are easy and possible with Ext.Net 1.0. It's not so difficult to migrate but be sure, the benefits are great, see
    http://forums.ext.net/showthread.php...to-Ext.Net-1.0
    http://forums.ext.net/showthread.php...0-step-by-step

    Most developers has already migrated to Ext.Net 1.0 and all of them is very glad.

Similar Threads

  1. [CLOSED] Options TreePanel font in Ext.Net examples v1 vs. v2
    By bogc in forum 1.x Legacy Premium Help
    Replies: 3
    Last Post: Jun 12, 2012, 5:52 PM
  2. [CLOSED] Coolite examples
    By asztern in forum 1.x Legacy Premium Help
    Replies: 5
    Last Post: Nov 08, 2010, 6:15 AM
  3. Coolite 0.82 examples
    By toinho in forum Open Discussions
    Replies: 1
    Last Post: Jun 24, 2010, 4:38 PM
  4. [CLOSED] Coolite.Examples report
    By methode in forum 1.x Legacy Premium Help
    Replies: 4
    Last Post: Nov 27, 2008, 11:00 AM
  5. [CLOSED] Can't build Coolite.Examples
    By methode in forum 1.x Legacy Premium Help
    Replies: 3
    Last Post: Nov 21, 2008, 5:56 AM

Tags for this Thread

Posting Permissions