Results 1 to 8 of 8

Thread: Ext.js 6.2.1 modern: Grid inside container doesn't display data

    Thank you for reporting this bug. We will make it our priority to review this report.
  1. #1
    Sencha Premium User
    Join Date
    Sep 2016
    Posts
    5

    Default Ext.js 6.2.1 modern: Grid inside container doesn't display data

    Whe you put a grid into a container (for example to combine it with another component), it doesn't show any data in the modern toolkit.

    Ext.js version: 6.2.1.167 modern
    Tested on: Firefox 51.0.1 (32 bit), Microsoft Edge 38.14393.0.0

    Fiddle: https://fiddle.sencha.com/#view/editor&fiddle/1rdk

    Click on the Grid panel to see the expected behaviour, then switch to the Container panel to see the bug.
    Last edited by engineer4; 5 Mar 2017 at 6:08 AM. Reason: typos

  2. #2
    Sencha Premium Member
    Join Date
    Jan 2013
    Location
    London
    Posts
    84

    Default

    Hi engineer4

    Been caught by this one myself ... the data's there, just the grid dimensions collapse. Adding a width & height reveals your data.

    https://fiddle.sencha.com/#view/editor&fiddle/1rnu

    Also fixable by adding something like
    Code:
    layout: 'fit'
    to the container

    There's also a small typo in there,
    Code:
    { name: 'data', type: 'text' }
    should be
    Code:
    { name: 'data', type: 'string' }
    Mark

  3. #3
    Sencha Premium User
    Join Date
    Oct 2016
    Posts
    26

    Default

    Same problem here:
    https://fiddle.sencha.com/#view/editor&fiddle/1qk7

    If we uncomment the row 194 the grid will apear, but we need a dinamic height that will show all the records .

    If we add layout: 'fit' (row 35) to the parent container, the grid will occupy all the space and will become scrollable ; but ,for our project, the container should be scrollable and not the grid.

  4. #4
    Sencha - Support Team
    Join Date
    Oct 2011
    Posts
    4,108

    Default

    This is not considered to be a bug.
    We recommend that you always add a layout to any container.
    The issue is that you are not giving the grid any sizing direction.
    It is necessary for the grid to display properly.
    That is why it works once you add a layout or height and width to the grid.
    Get more personalized support via a support subscription.

    Need more help with your app? Hire Sencha Services [email protected]

    When posting code, please use BBCode's CODE tags.

    Need to include a test case use:
    The official Sencha Fiddle

  5. #5
    Sencha Premium User
    Join Date
    Oct 2016
    Posts
    26

    Default

    Quote Originally Posted by fmoseley View Post
    This is not considered to be a bug.
    We recommend that you always add a layout to any container.
    The issue is that you are not giving the grid any sizing direction.
    It is necessary for the grid to display properly.
    That is why it works once you add a layout or height and width to the grid.
    So..according to your observation...let's suppose that i want the page to grow accordingly to grid's data (the grid should never scroll) . How is possible to achieve this with modern ? (with classic it's working)

    P.S: keep in mind that in a multi devices context (which should be what modern is made for) it's impossibile to define the size in pixel of an UI element at coding time. this kind of approach will result in a good result on some devices and an awful result in some other devices
    Last edited by mattia.pagliasso; 15 Mar 2017 at 7:42 AM. Reason: further details

  6. #6
    Sencha - Support Team
    Join Date
    Oct 2011
    Posts
    4,108

    Default

    We can address this issue on the ticket you opened.

    Quote Originally Posted by mattia.pagliasso View Post
    So..according to your observation...let's suppose that i want the page to grow accordingly to grid's data (the grid should never scroll) . How is possible to achieve this with modern ? (with classic it's working)

    P.S: keep in mind that in a multi devices context (which should be what modern is made for) it's impossibile to define the size in pixel of an UI element at coding time. this kind of approach will result in a good result on some devices and an awful result in some other devices
    Get more personalized support via a support subscription.

    Need more help with your app? Hire Sencha Services [email protected]

    When posting code, please use BBCode's CODE tags.

    Need to include a test case use:
    The official Sencha Fiddle

  7. #7
    Sencha MVP Team Member
    Join Date
    Sep 2016
    Location
    Kennewick, WA
    Posts
    153

    Default

    Quote Originally Posted by fmoseley View Post
    This is not considered to be a bug.
    We recommend that you always add a layout to any container.
    The issue is that you are not giving the grid any sizing direction.
    It is necessary for the grid to display properly.
    That is why it works once you add a layout or height and width to the grid.
    This "feature" as stated above still exists in Ext JS 6.6 Modern. It is NOT a feature based on several logical thoughts in development.

    1. Grid Panels are NOT layout panels. Ergo, not often will I ever have a grid panel displayed alone without presenting other/more detailed information to the end user.
    2. Panels are considered layout panels whereby I will be adding more items to it to display information to the end user. Ergo, I will be adding a "Grid Panel" to this panel... But not in Modern as data doesn't display.

    It would be my hope this is considered a MAJOR bug and would be addressed considering the toolkit roadmap confusion existing in with Sencha MVP's. It are these so deemed "features" being a primary reason I cannot use Sencha Architect as I continue hand coding to develop universal applications. Ones specifically designed for mobile and a browser experience. This is NOT acceptable in the browser world and from comments here this is NOT acceptable in a Modern toolkit.
    Andy Allord
    Sencha MVP/Software Engineer

  8. #8
    Sencha Premium User
    Join Date
    Jul 2011
    Location
    Czech Republic
    Posts
    3

    Default

    I try add layout: 'fit' in to container in this fiddle and it working.
    https://fiddle.sencha.com/#view/editor&fiddle/1rdk

    var mainView = Ext.create('Ext.tab.Panel', {
    activeItem: 0,
    items: [
    {
    title: 'Grid',
    xtype: 'grid',
    margin: 20,

    store: store,

    columns: [
    {text: 'ID', dataIndex: 'id'},
    {text: 'Data', dataIndex: 'data'}
    ]
    },
    {
    title: 'Container',
    xtype: 'container',
    margin: 20,
    layout: 'fit',

    items: [
    {
    title: 'Grid',
    xtype: 'grid',

    store: store,

    columns: [
    { text: 'ID', dataIndex: 'id' },
    { text: 'Data', dataIndex: 'data' }
    ]
    }
    ]
    }
    ]
    }).show();

Similar Threads

  1. JSON Grid Data from PHP doesn't display
    By reign99 in forum Ext: Discussion
    Replies: 1
    Last Post: 1 Apr 2014, 3:52 PM
  2. Display/hide content inside container
    By mirkotus in forum Ext: Q&A
    Replies: 1
    Last Post: 18 Dec 2013, 1:46 PM
  3. loading data mask of grid doesn't match with its container
    By jafarkhani.shabnam in forum Ext: Discussion
    Replies: 2
    Last Post: 27 Jan 2012, 9:03 PM
  4. Grid inside TabPanel doesn't show data
    By Silver Paladin in forum Ext 2.x: Help & Discussion
    Replies: 3
    Last Post: 29 Feb 2008, 11:06 AM

Tags for this Thread

Posting Permissions

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