Results 1 to 7 of 7

Thread: Grid doesn't render at all when inside a hidden div

Hybrid View

Previous Post Previous Post   Next Post Next Post
  1. #1
    Sencha User
    Join Date
    Mar 2012
    Location
    Cary, NC
    Posts
    7
    Vote Rating
    1
      1  

    Default Grid doesn't render at all when inside a hidden div

    I have a Grid that is rendered inside a div that is initially hidden. When the hidden div is set visible, the Grid does not render. Is there a property to set on the Grid that will allow it to render once it's in a visible container?

    Note: The hidden div is not controlled by ExtJS code. It is just plain html.

  2. #2
    Sencha - Sr Software Engineer mitchellsimoens's Avatar
    Join Date
    Mar 2007
    Location
    Gainesville, FL
    Posts
    39,556
    Vote Rating
    1272
      1  

    Default

    Did you inspect the DOM, did it render and just have a height of zero?
    Mitchell Simoens @LikelyMitch
    Sencha Inc, Senior Software Engineer
    ________________
    Learn BBCode and use it! Checkout the CODE tag!

    Check out my GitHub, lots of nice things for Ext JS and Sencha Touch
    https://github.com/mitchellsimoens

  3. #3
    Sencha Premium Member
    Join Date
    Feb 2012
    Location
    Pittsburgh, PA
    Posts
    7
    Vote Rating
    0
      0  

    Default

    I know this is an old thread but I am new to ExtJs and I am seeing this same behavior. I inspected it but am not sure which element you are referring to. There are so many extra "div's"

    Thanks

  4. #4
    Sencha User
    Join Date
    Mar 2012
    Location
    Cary, NC
    Posts
    7
    Vote Rating
    1
      0  

    Default

    Wish I could help, but we never got a chance to resolve this. We were evaluating ExtJS but couldn't work out licensing issues.

  5. #5
    Sencha Premium Member
    Join Date
    Feb 2012
    Location
    Pittsburgh, PA
    Posts
    7
    Vote Rating
    0
      0  

    Default

    The problem lies in the fact that my application is a combination of MVC, jQuery and ExtJs. I resolved my issue by changing out some of the jQuery code for ExtJs code and the data now displays in the grid.

    Thanks

  6. #6
    Sencha Premium Member
    Join Date
    Apr 2010
    Posts
    195
    Vote Rating
    25
      0  

    Default

    I had the same problem when rendering a grid panel in an inactive tab. The DOM is rendered, but some div have width and height being 0. Is there any way to solve this problem?

    Thanks,
    Elgs

  7. #7
    Sencha User
    Join Date
    Sep 2010
    Posts
    2
    Vote Rating
    0
      0  

    Default

    This is a little late, but have you tried grid.getView().refresh()?
    I execute this in a handler for the "tabchange" event of the tab panel and it seems to cause the grid to render.

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •