Looks like we can't reproduce the issue or there's a problem in the test case provided.
  1. #1
    Sencha Premium Member
    Join Date
    Aug 2012
    Posts
    78
    Vote Rating
    8
    jkyoutsey will become famous soon enough

      0  

    Default Grouped Grid with long group text doesn't style right when scrolled

    Here is a working code example. When you have a grouped grid where the text in the group header is longer than the width of the grid and you scroll to see the rest the rows in the grid are no longer styled. It looks terrible.
    Unscrolled:
    issue.png

    Scrolled:
    issue_scrolled.png

    Code:
    <html>
    <head>
       <script type="text/javascript" src="./extjs-4.2/ext-all-debug-w-comments.js"></script>
       <link rel="stylesheet" type="text/css" href="./extjs-4.2/resources/css/ext-all.css">
    <script>
    Ext.onReady(function () {
       var data = {
          "data" : [
             { "col1" : "lorem", "col2":"Some Really Long Text That Is Longer Than The Width Of The Window Creates This Issue." },
             { "col1" : "ipsum", "col2":"Some Really Long Text That Is Longer Than The Width Of The Window Creates This Issue." },
             { "col1" : "dolor", "col2":"Some Really Long Text That Is Longer Than The Width Of The Window Creates This Issue." },
             { "col1" : "ipsum", "col2":"b" },
             { "col1" : "lorem", "col2":"b" },
             { "col1" : "dolor", "col2":"b" }
          ]
       };
       
       var store = Ext.create('Ext.data.JsonStore', {
             storeId: 'theStore',
             autoLoad : true,
             data : data,
             root : 'data',
             fields : ['col1', 'col2'],
             groupField : 'col2',
             proxy : {
                type : 'memory',
                reader : {
                   type : 'json',
                   root : 'data'
                }
             }
          });
       
       Ext.create('Ext.Window', {
          modal : true,
          layout : 'fit',
          width : 400,
          height : 400,
          closable : false,
          title : 'title',
          buttons : [{
                id : 'saveButton',
                text : 'save'
             }, {
                text : 'close'
             }],
          layout : {
             type : 'vbox',
             align : 'stretch'
          },
          items : [{
                xtype : 'grid',
                store : store,
                flex : 1,
                margin : '5, 10, 10, 10',
                features : [{ftype : 'grouping'}],
                columns : [{
                      header : 'col1',
                      dataIndex : 'col1',
                      flex : 1
                   }]
             }]
       }).show();
    });
    </script>
    </head>
    <body>
    </body>
    </html>

  2. #2
    Sencha - Support Team
    Join Date
    Feb 2013
    Location
    California
    Posts
    9,268
    Vote Rating
    252
    Gary Schlosberg has much to be proud of Gary Schlosberg has much to be proud of Gary Schlosberg has much to be proud of Gary Schlosberg has much to be proud of Gary Schlosberg has much to be proud of Gary Schlosberg has much to be proud of Gary Schlosberg has much to be proud of Gary Schlosberg has much to be proud of Gary Schlosberg has much to be proud of

      0  

    Default

    Thanks for the report! I have opened a bug in our bug tracker.

Thread Participants: 1

Tags for this Thread