Help with TreePanel using BufferedRenderer and CommandColumn

  1. #1

    Help with TreePanel using BufferedRenderer and CommandColumn

    I'm having a hard time getting my tree to render correctly when I'm using a BufferedRenderer, and have a CommandColumn set with OverOnly(true). Everything works correctly if the renderer isn't there, but the I take a performance hit. Incidentally, the renderer is fine if I don't use OverOnly, but for the purpose of this page, OverOnly is definitely preferred. Referring to the attached screenshot... If I expand the NONCONSOL node, all of the children work as expected... the command shows up when I hover over a row. As you can see, the children of the XTOTUPS node already have the command rendered. If I hover over any of those nodes, I get the error...

    "0x800a138f - JavaScript runtime error: Unable to get property 'addCls' of undefined or null reference"

    and the page crashes.
                                        Html.X().TreePanel()
                                            .ID("treeDrillDown")
                                            .Animate(false)
                                            .RootVisible(false)
                                            .Root(Html.X().Node().NodeID("0"))
                                            .DisplayField("text")
                                            .Height(415)
                                            .Width(685)
                                            .MarginSpec("10 0 0 0")
                                            .IDMode(IDMode.Static)
                                            .Store(
                                                Html.X().TreeStore()
                                                    .ID("storeDrillDown")
                                                    .AutoLoad(false)
                                            )
                                            .ColumnModel(
                                                Html.X().CommandColumn()
                                                    .Width(25)
                                                    .Commands(
                                                        Html.X().GridCommand()
                                                            .CommandName("EditGroup")
                                                            .Icon(Icon.Add)
                                                    )
                                                    .OverOnly(true)
                                                    .DirectEvents(de =>
                                                    {
                                                        de.Command.Url = Url.Action("_TempEntityRequest_EntiyGroupSelection", "Temp", new { area = "CARMA" });
                                                        de.Command.FormID = "frmSymbolSelection";
                                                        de.Command.ExtraParams.Add(new Parameter { Name = "entity", Value = "record.data.id", Mode = Ext.Net.ParameterMode.Raw });
                                                    }),
                                                Html.X().TreeColumn()
                                                    .Flex(1)
                                                    .DataIndex("text")
                                            )
                                            .Plugins(
                                                Html.X().BufferedRenderer()
                                            )
                                            .Listeners(l =>
                                            {
                                                l.BeforeLoad.Fn = "nodeLoad";
                                            })
    
        //-------------------------------------------------------------------------------------
        // Tree Loading (when a node is clicked)
        //-------------------------------------------------------------------------------------
        var nodeLoad = function (store, operation, options) {
            var node = operation.node;
    
            //added here to see if it speeds up.
            Ext.suspendLayouts();
            App.treeDrillDown.suspendEvents();
    
            if (node.hasChildNodes() == true) {
                node.removeAll();
            }
    
            applyLoadMask(App.tabEntityTrees, true, 'Loading...');
    
            Ext.net.DirectMethod.request({
                url: "/FRP/Temp/SymbolGroupRequest_GetChildren",
                cleanRequest: true,
                params: {
                    nodeID: node.getId(),
                    instance: App.cboInstance.getValue(),
                    root: App.cboRoot.getValue()
                },
                success: function (result) {
                    applyLoadMask(App.tabEntityTrees, false);
                    node.set('loading', false);
                    node.set('loaded', true);
                    node.appendChild(result);
                    node.expand();
                },
                failure: function (errorMsg) {
                    applyLoadMask(App.tabEntityTrees, false);
                    Ext.Msg.alert('Error', errorMsg);
                }
            });
    
            //added here to see if it speeds up.
            Ext.resumeLayouts(true);
            App.treeDrillDown.resumeEvents();
    
            return false;
        }
    Unfortunately, I can't post all of my code (and had to strip out some of the info from the screenshot), since this is for an internal application at a very large company. Hopefully I've provided enough info that someone can provide a suggestion as to how to get around this issue.

    NOTE: The code snippet has the CommandColumn moved to the left of the text at the request of the business owner. The screenshot was taken before that change.

    Much thanks to anyone that can provide any insight or workarounds.
    Attached Thumbnails Click image for larger version. 

Name:	Tree.png 
Views:	40 
Size:	29.1 KB 
ID:	9321  
    Last edited by craigthames; Apr 03, 2014 at 6:30 PM.
  2. #2
    Hi @craigthames,

    Please clarify what Ext.NET version are you using?
  3. #3
    Quote Originally Posted by Daniil View Post
    Hi @craigthames,

    Please clarify what Ext.NET version are you using?
    Daniil,
    Thanks for responding. We are currently using 2.5.0.31188 in Visual Studio 2012. The browser is IE10.
  4. #4
    Thanks. Could you, please, provide us with a standalone runnable test case to reproduce the problem?

Similar Threads

  1. [CLOSED] GridPanel with BufferedRenderer: ScrollTo an added row
    By HansWapenaar in forum 2.x Legacy Premium Help
    Replies: 3
    Last Post: Jan 28, 2014, 10:59 AM
  2. Replies: 4
    Last Post: Oct 28, 2013, 8:38 PM
  3. [CLOSED] GridPanel with BufferedRenderer Bug
    By elisa in forum 2.x Legacy Premium Help
    Replies: 12
    Last Post: Aug 23, 2013, 6:21 PM
  4. [CLOSED] bufferedrenderer in version 2.1
    By JCarlosF in forum 2.x Legacy Premium Help
    Replies: 1
    Last Post: Aug 13, 2013, 4:45 PM
  5. Replies: 13
    Last Post: Aug 06, 2013, 3:58 AM

Tags for this Thread

Posting Permissions