Results 1 to 3 of 3

Thread: [CLOSED] Custom atributes of Treepanel's nodes on Itemclick listener

  1. #1
    Member
    Join Date
    Jan 2013
    Posts
    40

    [CLOSED] Custom atributes of Treepanel's nodes on Itemclick listener

    I have a treepanel which is populated in codebehind with database information.
    My treepanel has an ItemClick listener to dynamically add Tabs in a TabPanel.

    I want to set custom titles in tabs depending on which node has been clicked.Actually I use as tittle node's text.
    This my actual code:

    CodeBehind:

    Code:
    protected void Page_Load(object sender, EventArgs e)
            {
                if (!IsPostBack && !X.IsAjaxRequest)
                {
                    this.ArmarArbol(this.MenuTree.Root);               
                }            
            }
    private Ext.Net.NodeCollection ArmarArbol(Ext.Net.NodeCollection nodes)
            {
                if (nodes == null)
                {
                    nodes = new Ext.Net.NodeCollection();
                }
                Ext.Net.Node root = new Ext.Net.Node();
                root.Text = GetLocalResourceObject("nodoProyecto").ToString();
                root.NodeID = "0";
                root.Href = this.Page.ResolveUrl("projects.aspx");            
                root.Expanded = false;
                nodes.Add(root);
               
    
                proNeg = new ProjectNegocio();
                try
                {
                    //this method gets data from database.
                    List<Project> projs = this.proNeg.GetAll();
    
                    foreach (Project pro in projs)
                    {
                        Ext.Net.Node nodoProyecto = new Ext.Net.Node();
                        nodoProyecto.Text = pro.Name;
                        nodoProyecto.NodeID = "P" + pro.ID.ToString();                    
                        root.Children.Add(nodoProyecto);
    
                        Ext.Net.Node nodoVariable = new Ext.Net.Node();
                        nodoVariable.Text = GetLocalResourceObject("nodoVariable").ToString();
                        nodoVariable.Leaf = true;
                        nodoVariable.NodeID = "V" + pro.ID.ToString();                    
                        nodoVariable.Href = this.Page.ResolveUrl("variables.aspx?id=" + pro.ID.ToString());
                        nodoProyecto.Children.Add(nodoVariable);
    
                        Ext.Net.Node nodoConexion = new Ext.Net.Node();
                        nodoConexion.Text = GetLocalResourceObject("nodoConexion").ToString();
                        nodoConexion.Leaf = true;
                        nodoConexion.NodeID = "C" + pro.ID.ToString();
                        nodoConexion.Href = this.Page.ResolveUrl("connections.aspx?id=" + pro.ID.ToString());
                        nodoProyecto.Children.Add(nodoConexion);
    
                    }
                }
                catch (Exception ex)
                {
                    string titulo = GetLocalResourceObject("mensajeErrorTitulo").ToString();
                    X.Msg.Show(new MessageBoxConfig
                    {
                        Title = titulo,
                        Message = ex.Message,
                        Icon = MessageBox.Icon.ERROR
                    });
                    //X.Msg.Alert(titulo, ex.Message).Show();
                }
                return nodes;
          }
    
    [DirectMethod]
            public string RefreshMenu()
            {
                Ext.Net.NodeCollection nodes = this.ArmarArbol(null);
    
                return nodes.ToJson();
            }
    Markup:

    Code:
    <%@ Page Language="C#" AutoEventWireup="true" CodeBehind="home.aspx.cs" Inherits="ETL_Profit.Program.home" %>
    
    <%@ Register Assembly="Ext.Net" Namespace="Ext.Net" 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></title>
        <script>
    
            var refreshTree = function (tree) {
                App.direct.RefreshMenu({
                    success: function (result) {
                        var nodes = eval(result);
                        if (nodes.length > 0) {
                            tree.setRootNode(nodes[0]);
                        }
                        else {
                            tree.getRootNode().removeAll();
                        }
                    }
                });
            };
            var loadPage = function (tabPanel, record) {
                var tab = tabPanel.getComponent(record.getId());
                            if (!tab) {
                    tab = tabPanel.add({
                        id: record.getId(),
                        title: record.data.text,
                        closable: true,
                        loader: {
                            url      : record.data.href,                        
                            renderer: "frame",
                            loadMask: {
                                showMask: true,
                                msg:  record.data.href 
                            }
                        },
                        autoScroll: true
                    });
                }
    
                tabPanel.setActiveTab(tab);
            };
        </script>
    </head>
    <body>
        <form id="form1" runat="server">
            <ext:ResourceManager ID="ResourceManager1" runat="server">
            </ext:ResourceManager>
            <ext:Viewport ID="Viewport1" runat="server" Layout="Border">
                <Items>
                    <ext:Panel ID="PHeader"  Height="100px" runat="server" Border= "true" Region="North" Layout="Fit" Collapsible ="false" > 
                     <Content> 
                         <ext:Label ID="Label1" Text="LOGO" runat="server">
                         </ext:Label>
                     </Content>        
                    </ext:Panel>
                    <ext:Panel ID="PMenu" runat="server" Width="300" Border= "true" Region="West" Layout="Fit" Collapsible ="true" >
                        <Items>
                            <ext:Panel ID="PETL" Title="ETL" runat="server"  Layout="Accordion" Margins="0 0 15 0">
                                <LayoutConfig>
                                    <ext:AccordionLayoutConfig OriginalHeader="true" />
                                </LayoutConfig>
                                <Items>
                                    <ext:TreePanel ID="MenuTree" runat="server" >
                                    <Tools>            
                                        <ext:Tool Type="Refresh" Handler="refreshTree(#{MenuTree});">
                                            <ToolTips>
                                                <ext:ToolTip ID="tooltipRefresh" runat="server" Html="Refresh" />
                                            </ToolTips>
                                        </ext:Tool>
                                    </Tools>
                                     <Listeners>
                                        <ItemClick Handler="if (record.data.href) {e.stopEvent();loadPage(#{tabs}, record);}" />
                                    </Listeners>
                                    </ext:TreePanel>
                                </Items>
                            </ext:Panel>                        
                        </Items>
                    </ext:Panel>
                    <ext:TabPanel ID="tabs"  Region="Center" runat="server">
                       
                     </ext:TabPanel>  
                </Items>
            </ext:Viewport>
        </form>
    </body>
    </html>
    I've tried adding custom atributes to nodes like this:

    Code:
    ConfigItem con = new ConfigItem("tabname", pro.Name + "/Variables",ParameterMode.Value);
    nodoVariable.CustomConfig.Add(con);
    But when i want to use this custom config 'tabname' in javascript i can't get the value. I tried modifying my javascript like this:

    Code:
    var loadPage = function (tabPanel, record) {
                var tab = tabPanel.getComponent(record.getId());
                            if (!tab) {
                    tab = tabPanel.add({
                        id: record.getId(),
                        title: record.tabname,
                        closable: true,
                        loader: {
                            url      : record.data.href,                        
                            renderer: "frame",
                            loadMask: {
                                showMask: true,
                                msg:  record.data.href 
                            }
                        },
                        autoScroll: true
                    });
                }
    
                tabPanel.setActiveTab(tab);
            };
    Last edited by Daniil; Jan 23, 2013 at 11:24 AM. Reason: [CLOSED]

  2. #2
    Ext.NET - Dev Team Vladimir's Avatar
    Join Date
    Mar 2008
    Location
    Russia
    Posts
    15,325
    Hi,

    Any custom attributes (CustomConfig also) must be defined inside Fields collection of TreePanel or inside Fields of Model (if you use Store for TreePanel), see
    http://examples.ext.net/#/TreePanel/Advanced/TreeGrid/

    To retrieve attribute you have to use 'record.data.tabname' instead 'record.tabname'
    Vladimir Shcheglov
    Ext.NET, Inc.
    Development Team

    Ext.NET Examples | Ext.NET API Docs | ExtJS API Docs | Twitter | Jobs

  3. #3
    Member
    Join Date
    Jan 2013
    Posts
    40

    Solved

    Thanks, I made it to work!
    Last edited by profitsistemas; Jan 23, 2013 at 12:11 PM.

Similar Threads

  1. Replies: 18
    Last Post: Jan 23, 2013, 3:20 PM
  2. Replies: 2
    Last Post: Nov 26, 2012, 7:14 AM
  3. [CLOSED] TreePanel itemClick DirectEvent
    By cwolcott in forum 2.x Premium Help
    Replies: 6
    Last Post: Oct 26, 2012, 4:53 AM
  4. Custom TreeGrid nodes ?
    By Mohammad in forum 1.x Help
    Replies: 18
    Last Post: Aug 22, 2012, 9:49 AM
  5. [FIXED] [V0.8.0] TreeLoader base atributes
    By Justin_Wignall in forum Bugs
    Replies: 2
    Last Post: Feb 11, 2009, 9:44 AM

Tags for this Thread

Posting Permissions