[CLOSED] After I added the SelectionModel to the TreePanel, the deselect does NOT work anymore...

  1. #1

    [CLOSED] After I added the SelectionModel to the TreePanel, the deselect does NOT work anymore...

    In the TreePanel, I set up the property AllowDeselect="true" and when I added to code below, it does not work anymore...

            <SelectionModel>
                <ext:TreeSelectionModel runat="server" />
            </SelectionModel>
    <%@ Page Language="C#" %>
    
    <%@ Register Assembly="Ext.Net" Namespace="Ext.Net" TagPrefix="ext" %>
    <script runat="server">
    
        protected void Page_Load(object sender, EventArgs e)
        {
            var root = new Node
            {
                Text = "Downtime",
                Icon = Icon.TimeRed,
                Expanded = true
            };
            TreePanel1.Root.Add(root);
    
            var downtimes = GetData();
    
            foreach (var downtime in downtimes)
            {
                var downtimeNode = new Node()
                {
                    Text = downtime.Type.ToString(),
                    Icon = Icon.WrenchOrange
                };
                root.Children.Add(downtimeNode);
    
                foreach (var reason in downtime.Reason)
                {
                    var reasonNode = new Node()
                    {
                        NodeID = @"_" + reason.ReasonId,
                        Text = reason.Description,
                        Icon = Icon.Wrench,
                        Leaf = true
                    };
                    downtimeNode.Children.Add(reasonNode);
                }
            }
    
            // NOTE: Need help here... (If I need to select the node 'Insufficient Workers' ReasonId = 6, how would I do it)
            //TreePanel1.GetSelectionModel().Select(id, index, node);
        }
    
    
        public List<DownTime> GetData()
        {
            var mechanical = new DownTime(DowntimeType.Mechanical);
            var scheduled = new DownTime(DowntimeType.Scheduled);
            var production = new DownTime(DowntimeType.Production);
            var electrical = new DownTime(DowntimeType.Electrical);
            var labor = new DownTime(DowntimeType.Labor);
    
            mechanical.Reason.AddRange(new List<Reason>
                                           {
                                               new Reason
                                                   {
                                                       Description = "Line Failure",
                                                       ReasonId = Convert.ToString(1)
                                                   },
                                               new Reason
                                                   {
                                                       Description = "Maintenance",
                                                       ReasonId = Convert.ToString(2)
                                                   }
                                           });
    
    
            scheduled.Reason.AddRange(new List<Reason>
                                          {
                                              new Reason
                                                  {
                                                      Description = "Meeting",
                                                      ReasonId = Convert.ToString(3)
                                                  }
                                          });
    
            production.Reason.AddRange(new List<Reason>
                                           {
                                               new Reason
                                                   {
                                                       Description = "Order Change",
                                                       ReasonId = Convert.ToString(4)
                                                   }
                                           });
    
            electrical.Reason.AddRange(new List<Reason>
                                           {
                                               new Reason
                                                   {
                                                       Description = "Power Outage",
                                                       ReasonId = Convert.ToString(5)
                                                   }
                                           });
    
            labor.Reason.AddRange(new List<Reason>
                                      {
                                          new Reason
                                              {
                                                  Description = "Insufficient Workers",
                                                  ReasonId = Convert.ToString(6)
                                              }
                                      });
    
    
            return new List<DownTime> { electrical, labor, mechanical, production, scheduled };
        }
    
    
        public class DownTime
        {
            public DownTime() { }
    
            public DownTime(DowntimeType type)
            {
                this.Type = type;
            }
    
            public DowntimeType Type { get; set; }
    
            private List<Reason> reason;
            public List<Reason> Reason
            {
                get
                {
                    if (this.reason == null)
                    {
                        this.reason = new List<Reason>();
                    }
                    return this.reason;
                }
            }
        }
    
        public class Reason
        {
            public Reason() { }
    
            public Reason(string description, string reasonId)
            {
                this.Description = description;
                this.ReasonId = reasonId;
            }
    
            public string Description { get; set; }
            public string ReasonId { get; set; }
        }
    
        public enum DowntimeType
        {
            Mechanical,
            Scheduled,
            Production,
            Electrical,
            Labor
        }
        
    </script>
    <!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 id="Head1" runat="server">
        <title>Multi Node TreePanel built using markup & Code Behind - Ext.NET Examples</title>
    </head>
    <body>
        <form id="Form1" runat="server">
        <ext:ResourceManager ID="ResourceManager1" runat="server" />
        <h1>
            Multi Node TreePanel built using markup & Code Behind</h1>
        <br />
        <ext:TreePanel ID="TreePanel1" runat="server" Width="300" Height="450" Icon="Lorry"
            AllowDeselect="true" Title="Downtimes" AutoScroll="true" Animate="true" AnimCollapse="true"
            TabIndex="1">
            <TopBar>
                <ext:Toolbar ID="Toolbar1" runat="server">
                    <Items>
                        <ext:Button ID="Button1" runat="server" Text="Expand All">
                            <Listeners>
                                <Click Handler="#{TreePanel1}.expandAll();" />
                            </Listeners>
                        </ext:Button>
                        <ext:Button ID="Button2" runat="server" Text="Collapse All">
                            <Listeners>
                                <Click Handler="#{TreePanel1}.collapseAll();" />
                            </Listeners>
                        </ext:Button>
                    </Items>
                </ext:Toolbar>
            </TopBar>
            <BottomBar>
                <ext:StatusBar ID="StatusBar1" runat="server" AutoClear="1500" />
            </BottomBar>
            <Listeners>
                <ItemClick Handler="if(record.isLeaf()){#{StatusBar1}.setStatus({text: 'Downtime Selected: <b>' + record.data.text + '</b>', clear: false})};" />
                <BeforeSelect Handler="return record.isLeaf();" />
                <AfterRender Handler="#{TreePanel1}.expandAll();" />
            </Listeners>
            <SelectionModel>
                <ext:TreeSelectionModel runat="server" />
            </SelectionModel>
        </ext:TreePanel>
        </form>
    </body>
    </html>
    Last edited by Daniil; Aug 07, 2012 at 5:07 AM. Reason: [CLOSED]
  2. #2
    Hi,

    In that case you should define AllowDeselect for the TreeSelectionModel.
    <ext:TreeSelectionModel runat="server" AllowDeselect="true" />
  3. #3
    I added the code below so when the user Select & Deselect it update the Status Bar, it works for this part, I have to add a 'Delay="500" ' to get it to work
              <Deselect Handler="if(record.isLeaf()){#{StatusBar1}.setStatus({text: 'Downtime Selected: <b>NONE</b>', clear: false})};" Delay="500" />
    But if the user selects another item in the List while ONE is checked, it displays 'NONE' in my Status Bar.
    How can I get this to behave correctly??

    I there a method name, "record.isDeselect" or something like that I can you?

    Any ideas??


    <%@ Page Language="C#" %>
    
    <%@ Register Assembly="Ext.Net" Namespace="Ext.Net" TagPrefix="ext" %>
    <script runat="server">
    
        protected void Page_Load(object sender, EventArgs e)
        {
            var root = new Node
            {
                Text = "Downtime",
                Icon = Icon.TimeRed,
                Expanded = true
            };
            TreePanel1.Root.Add(root);
    
            var downtimes = GetData();
    
            foreach (var downtime in downtimes)
            {
                var downtimeNode = new Node()
                {
                    Text = downtime.Type.ToString(),
                    Icon = Icon.WrenchOrange
                };
                root.Children.Add(downtimeNode);
    
                foreach (var reason in downtime.Reason)
                {
                    var reasonNode = new Node()
                    {
                        NodeID = @"_" + reason.ReasonId,
                        Text = reason.Description,
                        Icon = Icon.Wrench,
                        Leaf = true
                    };
                    downtimeNode.Children.Add(reasonNode);
                }
            }
    
            // NOTE: Need help here... (If I need to select the node 'Insufficient Workers' ReasonId = 6, how would I do it)
            //TreePanel1.GetSelectionModel().Select(id, index, node);
        }
    
    
        public List<DownTime> GetData()
        {
            var mechanical = new DownTime(DowntimeType.Mechanical);
            var scheduled = new DownTime(DowntimeType.Scheduled);
            var production = new DownTime(DowntimeType.Production);
            var electrical = new DownTime(DowntimeType.Electrical);
            var labor = new DownTime(DowntimeType.Labor);
    
            mechanical.Reason.AddRange(new List<Reason>
                                           {
                                               new Reason
                                                   {
                                                       Description = "Line Failure",
                                                       ReasonId = Convert.ToString(1)
                                                   },
                                               new Reason
                                                   {
                                                       Description = "Maintenance",
                                                       ReasonId = Convert.ToString(2)
                                                   }
                                           });
    
    
            scheduled.Reason.AddRange(new List<Reason>
                                          {
                                              new Reason
                                                  {
                                                      Description = "Meeting",
                                                      ReasonId = Convert.ToString(3)
                                                  }
                                          });
    
            production.Reason.AddRange(new List<Reason>
                                           {
                                               new Reason
                                                   {
                                                       Description = "Order Change",
                                                       ReasonId = Convert.ToString(4)
                                                   }
                                           });
    
            electrical.Reason.AddRange(new List<Reason>
                                           {
                                               new Reason
                                                   {
                                                       Description = "Power Outage",
                                                       ReasonId = Convert.ToString(5)
                                                   }
                                           });
    
            labor.Reason.AddRange(new List<Reason>
                                      {
                                          new Reason
                                              {
                                                  Description = "Insufficient Workers",
                                                  ReasonId = Convert.ToString(6)
                                              }
                                      });
    
    
            return new List<DownTime> { electrical, labor, mechanical, production, scheduled };
        }
    
    
        public class DownTime
        {
            public DownTime() { }
    
            public DownTime(DowntimeType type)
            {
                this.Type = type;
            }
    
            public DowntimeType Type { get; set; }
    
            private List<Reason> reason;
            public List<Reason> Reason
            {
                get
                {
                    if (this.reason == null)
                    {
                        this.reason = new List<Reason>();
                    }
                    return this.reason;
                }
            }
        }
    
        public class Reason
        {
            public Reason() { }
    
            public Reason(string description, string reasonId)
            {
                this.Description = description;
                this.ReasonId = reasonId;
            }
    
            public string Description { get; set; }
            public string ReasonId { get; set; }
        }
    
        public enum DowntimeType
        {
            Mechanical,
            Scheduled,
            Production,
            Electrical,
            Labor
        }
        
    </script>
    <!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 id="Head1" runat="server">
        <title>Multi Node TreePanel built using markup & Code Behind - Ext.NET Examples</title>
    </head>
    <body>
        <form id="Form1" runat="server">
        <ext:ResourceManager ID="ResourceManager1" runat="server" />
        <h1>
            Multi Node TreePanel built using markup & Code Behind</h1>
        <br />
        <ext:TreePanel ID="TreePanel1" runat="server" Width="300" Height="450" Icon="Lorry"
            Title="Downtimes" AutoScroll="true" Animate="true" AnimCollapse="true" TabIndex="1">
            <TopBar>
                <ext:Toolbar ID="Toolbar1" runat="server">
                    <Items>
                        <ext:Button ID="Button1" runat="server" Text="Expand All">
                            <Listeners>
                                <Click Handler="#{TreePanel1}.expandAll();" />
                            </Listeners>
                        </ext:Button>
                        <ext:Button ID="Button2" runat="server" Text="Collapse All">
                            <Listeners>
                                <Click Handler="#{TreePanel1}.collapseAll();" />
                            </Listeners>
                        </ext:Button>
                    </Items>
                </ext:Toolbar>
            </TopBar>
            <BottomBar>
                <ext:StatusBar ID="StatusBar1" runat="server" Height="20" AutoClear="1500" />
            </BottomBar>
            <Listeners>
                <ItemClick Handler="if(record.isLeaf()){#{StatusBar1}.setStatus({text: 'Downtime Selected: <b>' + record.data.text + '</b>', clear: false})};" />
                <BeforeSelect Handler="return record.isLeaf();" />
                <AfterRender Handler="#{TreePanel1}.expandAll();" />
                <Deselect Handler="if(record.isLeaf()){#{StatusBar1}.setStatus({text: 'Downtime Selected: <b>NONE</b>', clear: false})};" Delay="500" />        
            </Listeners>
            <SelectionModel>
                <ext:TreeSelectionModel runat="server" AllowDeselect="true" />
            </SelectionModel>
        </ext:TreePanel>
        </form>
    </body>
    </html>
    Quote Originally Posted by Daniil View Post
    Hi,

    In that case you should define AllowDeselect for the TreeSelectionModel.
    <ext:TreeSelectionModel runat="server" AllowDeselect="true" />
  4. #4
    I would implement it this way.

    Example
    <Listeners>
        <AfterRender Handler="#{TreePanel1}.expandAll();" />
        <BeforeSelect Handler="return record.isLeaf();" />
        <SelectionChange Handler="var tpl = 'Downtime Selected: <b>{0}</b>',
                                      msg = 'NONE';
    
                                  if (selected.length > 0) {
                                      msg = selected[0].get('text')
                                  }
                                  #{StatusBar1}.setStatus(Ext.String.format(tpl, msg));" />
    </Listeners>
  5. #5
    Thanks, it works great.

    I would have never figure out that I can do it this way...

    Quote Originally Posted by Daniil View Post
    I would implement it this way.
    Example
    <Listeners>
        <AfterRender Handler="#{TreePanel1}.expandAll();" />
        <BeforeSelect Handler="return record.isLeaf();" />
        <SelectionChange Handler="var tpl = 'Downtime Selected: <b>{0}</b>',
                                      msg = 'NONE';
    
                                  if (selected.length > 0) {
                                      msg = selected[0].get('text')
                                  }
                                  #{StatusBar1}.setStatus(Ext.String.format(tpl, msg));" />
    </Listeners>

Similar Threads

  1. [CLOSED] PartialViewResult doesn't work with ASP.NET MVC 3.0 anymore
    By SandorD in forum 1.x Legacy Premium Help
    Replies: 3
    Last Post: Mar 11, 2011, 1:09 PM
  2. Replies: 0
    Last Post: Feb 14, 2011, 10:25 AM
  3. AutoScroll doesn't work anymore
    By tenkyu in forum 1.x Help
    Replies: 6
    Last Post: Nov 05, 2010, 2:26 PM

Tags for this Thread

Posting Permissions