Results 1 to 2 of 2

Thread: Nonscrolling grid in a scrollable panel

  1. #1
    Sencha User
    Join Date
    Aug 2008
    Posts
    5
    Vote Rating
    0
      0  

    Default Nonscrolling grid in a scrollable panel

    I want to have a nonscrolling grid displaying all content within a scrolling panel that contains other components/panels as well. Problem is that I don't want to give a static height to the grid (since then it scrolls as soon as the content is too large). But if I don't set the height, the table-content isn't displayed.
    In other words: I don't want a scrolling grid within a scrolling panel -therefore the grid should be displayed completely.
    Below the code which includes collapsible panels - the "height: 400" is what I want to get rid off. Nut without it, the grid-height becomes 0 instead of expanding to the necessary size.

    Any ideas?

    Code:
    Ext.define('test.view.main.Main', {
        extend: 'Ext.Panel',
        xtype: 'Testpanel',
        viewModel: 'main',
        requires: [
            'Ext.panel.Collapser'
        ],
     layout: 'vbox',
     scrollable: 'vertical',
        html: 'Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet.',
     title: 'Test',
    
        items: [{
      xtype: 'panel',
            
            title: 'Collapsible Panel',
            collapsible: {
                collapsed: true,
                direction: 'top',
       animation: false
            },
      html: 'Blabla Blabla Blabla Blabla Blabla Blabla Blabla Blabla Blabla Blabla Blabla Blabla Blabla Blabla Blabla Blabla Blabla Blabla Blabla Blabla Blabla Blabla Bla Blabla Blabla Blabla Blabla Blabla Blabla Blabla Blabla Blabla Blabla Blabla Blabla Blabla Blabla Blabla Blabla Blabla Blabla Blabla Blabla Blabla Blabla Blabla Blabla Blabla Blabla Blabla Blabla Blabla Blabla Blabla Blabla Blabla Blabla Blabla Bla Blabla Blabla Blabla Blabla Blabla Blabla Blabla Blabla Blabla Blabla Blabla Blabla Blabla Blabla Blabla Blabla Blabla Blabla Blabla Blabla Blabla Blabla Blabla Blabla Blabla Blabla Blabla Blabla Blabla Blabla Blabla Blabla Blabla Blabla Blabla Blabla Blabla Blabla Blabla Blabla Blabla Blabla'
        },
     {
      xtype: 'panel',
            title: 'Collapsible Panel2',
            collapsible: {
                collapsed: true,
                direction: 'top',
       animation: false
            },
    
      items: [
         {
          id: 'userGrid',
          xtype: 'grid',
          hideHeaders: true,
          height:400, // <= As soon as I remove this, the grid content isn't displayed anymore
          bind:{
           store:'{userStore}',
          },
          columns: [
           { 
            text: 'id',
            dataIndex: 'id',
           },
           { 
            text: 'Name',
            dataIndex: 'name',
           }      
          ]
         }
        ]
      
        }
     ]
    });

  2. #2
    Sencha User
    Join Date
    Jun 2018
    Posts
    9
    Vote Rating
    0
      0  

    Default

    the Panel's height than u're not set

Similar Threads

  1. Replies: 3
    Last Post: 7 Jan 2016, 9:57 AM
  2. [OPEN] Grid Panel Scrollable Config X/Y Settings Issue
    By KevH in forum Ext 5: Bugs
    Replies: 1
    Last Post: 2 Dec 2015, 10:32 AM
  3. Scrollable panel
    By gatakka in forum Ext 3.x: Help & Discussion
    Replies: 8
    Last Post: 18 Aug 2009, 3:40 AM
  4. Scrollable Panel
    By emmanuel_adenitire in forum Ext 2.x: Help & Discussion
    Replies: 5
    Last Post: 28 Nov 2008, 8:58 AM

Posting Permissions

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