1. #1
    Ext User
    Join Date
    Jul 2010
    Posts
    8
    Vote Rating
    0
    odig is on a distinguished road

      0  

    Default Can't get TreePanel example to work; Rendering issue

    Can't get TreePanel example to work; Rendering issue


    Hi,

    I just started using ExtJS I am basically just copying the TreePanel checkbox example but it isn't rendering properly.
    This is the code:
    Code:
    <script type="text/javascript">
    
    	Ext.onReady(function(){
    		Ext.BLANK_IMAGE_URL = 'ext/resources/images/default/s.gif';				
    		
    		var tree = new Ext.tree.TreePanel({
            renderTo:'sidebar',
            title: 'Albums',
            height: 500,
            width: 300,
            useArrows:true,
            autoScroll:true,
            animate:true,
            enableDD:true,
            containerScroll: true,
            rootVisible: false,
            frame: true,
            root: {
                nodeType: 'async'
            },
            
            // auto create TreeLoader
            dataUrl: 'check-nodes.json',
            
            listeners: {
                'checkchange': function(node, checked){
                    if(checked){
                        node.getUI().addClass('complete');
                    }else{
                        node.getUI().removeClass('complete');
                    }
                }
            },
        });
    
        //tree.getRootNode().expand(true);
     
      }); //end onReady
    </script>
    This is the Json file:
    Code:
    [{
        text: 'Me', 
        cls: 'folder',
        children: [{
            id:'Bday 2009',
            text: 'Bday 2009',
            leaf: true,
            checked: false
        },{
            id:'Bday 2010',
            text: 'Bday 2010',
            leaf: true,
            checked: false
        },{
            id:'New Years',
            text: 'New Years',
            leaf: true,
            checked: false
        }]
    },{
        text: 'Friend 1',
        cls: 'folder',
        children: [{
            id:'Cuba trip',
            text: 'Cuba trip',
            leaf: true,
            checked: false
        },{
            id:'Hike',
            text: 'Hike',
            leaf: true,
            checked: false
        },{
            id:'Car ride 2007',
            text: 'Car ride 2007',
            leaf: true,
            checked: false
        }]
    },{
        text: 'Friend 2', 
        cls: 'folder',
        children: [{
            id:'Mountains',
            text: 'Mountains',
            leaf: true,
            checked: false
        }]
    }]
    But the tree is all screwed up (see attached screenshot). There are no errors in firebug. I can't figure out what is going wrong!
    Attached Images

  2. #2
    Ext User
    Join Date
    Jul 2010
    Posts
    8
    Vote Rating
    0
    odig is on a distinguished road

      0  

    Default ?

    ?


    No one has seen this before?? I was kinda hoping it was a newb mistake since it's such a basic example. I can't find anything else on it though. It almost looks like it might be css problem, any ideas??

  3. #3
    Sencha - Community Support Team jay@moduscreate.com's Avatar
    Join Date
    Mar 2007
    Location
    Frederick MD, NYC, DC
    Posts
    16,361
    Vote Rating
    81
    jay@moduscreate.com is a name known to all jay@moduscreate.com is a name known to all jay@moduscreate.com is a name known to all jay@moduscreate.com is a name known to all jay@moduscreate.com is a name known to all jay@moduscreate.com is a name known to all

      0  

    Default


    is the blank_image_url really ext/resources/images/default/s.gif ?

    does extjs resize in /ext of your site?

    That said, do you have any other css that might conflict?

  4. #4
    Ext User
    Join Date
    Jul 2010
    Posts
    8
    Vote Rating
    0
    odig is on a distinguished road

      0  

    Default


    Ahh, yes. Conflicting CSS was the problem. Thanks!!

Similar Threads

  1. treepanel rendering
    By joe123 in forum Ext 3.x: Help & Discussion
    Replies: 0
    Last Post: 7 Dec 2009, 9:37 AM
  2. toolbar rendering issue - adding a DOM or Field is not rendering in IE
    By mango in forum Ext 2.x: Help & Discussion
    Replies: 2
    Last Post: 1 Apr 2009, 6:59 AM
  3. rendering TreePanel using tables
    By BrainDrain in forum Ext 2.x: Help & Discussion
    Replies: 1
    Last Post: 23 Aug 2008, 12:13 PM
  4. Weird rendering issue when rendering more than 11 columns
    By devol in forum Ext 1.x: Help & Discussion
    Replies: 18
    Last Post: 13 Oct 2006, 9:37 PM

Thread Participants: 1