You found a bug! We've classified it as EXTJS-10320 . We encourage you to continue the discussion and to find an acceptable workaround while we work on a permanent fix.
  1. #1
    Sencha User
    Join Date
    Jun 2013
    Posts
    3
    Vote Rating
    0
    danj is on a distinguished road

      0  

    Default [4.2.1] Rowediting Update and Cancel buttons shown above row in IE7

    [4.2.1] Rowediting Update and Cancel buttons shown above row in IE7


    REQUIRED INFORMATION

    Ext version tested:
    • Ext 4.2.1
    Browser versions tested against:
    • IE7 - buttons above row
    • IE8 Compatibility Mode - buttons above row
    • IE8 - OK
    • Chrome v27 - OK
    Description:
    • Update and Cancel buttons shown above the row editor when the number of rows in the grid do not cause the scrollbar to appear. They are effectively hidden when inserting a new row at the top.
    Steps to reproduce the problem:
    The result that was expected:
    • Buttons should be visible and displayed below the editing row
    The result that occurs instead:
    • Buttons are hidden / displayed above the editing row
    Test Case:

    Replace 'data' function in row-editing.js:

    Code:
            // Generate mock employee data
            var data = (function () {
                var lasts = ['Jones', 'Smith', 'Lee', 'Wilson', 'Black', 'Williams', 'Lewis', 'Johnson', 'Foot', 'Little', 'Vee', 'Train', 'Hot', 'Mutt'],
                firsts = ['Fred', 'Julie', 'Bill', 'Ted', 'Jack', 'John', 'Mark', 'Mike', 'Chris', 'Bob', 'Travis', 'Kelly', 'Sara'],
                lastLen = lasts.length,
                firstLen = firsts.length,
                usedNames = {},
                data = [],
                s = new Date(2007, 0, 1),
                eDate = Ext.Date,
                now = new Date(),
                getRandomInt = Ext.Number.randomInt,
    
    
                generateName = function () {
                    var name = firsts[getRandomInt(0, firstLen - 1)] + ' ' + lasts[getRandomInt(0, lastLen - 1)];
                    if (usedNames[name]) {
                        return generateName();
                    }
                    usedNames[name] = true;
                    return name;
                };
    
    
                
                for (var i = 0; i < 10; i++) {
                    var name = generateName();
                    data.push({
                        start: eDate.add(eDate.clearTime(s, true), eDate.DAY, getRandomInt(0, 27)),
                        name: name,
                        email: name.toLowerCase().replace(' ', '.') + '@sencha-test.com',
                        active: getRandomInt(0, 1),
                        salary: Math.floor(getRandomInt(35000, 85000) / 1000) * 1000
                    });
                }
    
    
                return data;
            })();


    HELPFUL INFORMATION

    Screenshot or Video:
    • attached
    Debugging already done:
    • none
    Possible fix:
    • not provided
    Additional CSS used:
    • only default ext-all.css
    Operating System:
    • Windows 7
    • Windows Server 2003 R2
    *EDIT BY SLEMMON
    Issue observed in IE7 with 4.2.1. Tested OK in IE7 in 4.2.0
    Attached Images
    Last edited by slemmon; 20 Jun 2013 at 10:15 AM. Reason: additional test notes

  2. #2
    Sencha - Support Team slemmon's Avatar
    Join Date
    Mar 2009
    Location
    Boise, ID
    Posts
    5,978
    Vote Rating
    212
    slemmon has much to be proud of slemmon has much to be proud of slemmon has much to be proud of slemmon has much to be proud of slemmon has much to be proud of slemmon has much to be proud of slemmon has much to be proud of slemmon has much to be proud of

      0  

    Default


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

  3. #3
    Sencha User
    Join Date
    Jun 2013
    Posts
    3
    Vote Rating
    0
    danj is on a distinguished road

      0  

    Default


    Adding the following to the grid configuration appears to fix the problem of the hidden buttons when adding a new row, but inconsistently displays the buttons below and above when editing.

    Code:
    layout: {            type: 'anchor',
                reserveScrollbar: true
            },

  4. #4
    Sencha User
    Join Date
    Jun 2013
    Posts
    3
    Vote Rating
    0
    danj is on a distinguished road

      0  

    Default


    Hi,

    Has there been any update to this? It is still causing issues.

    Thanks

  5. #5
    Sencha User
    Join Date
    Dec 2012
    Posts
    12
    Vote Rating
    0
    afzal is on a distinguished road

      0  

    Default


    Try to give css for gird and overide the default property through css.

    here gridCls is the css for grid..(in grid configuration cls:gridCls)

    .gridCls .x-panel{
    overflow:visible !important;
    }

  6. #6
    Sencha User
    Join Date
    Feb 2013
    Posts
    2
    Vote Rating
    0
    jileen.chen@oocl.com is on a distinguished road

      0  

    Default


    Any update for this bug?

  7. #7
    Sencha User alecm's Avatar
    Join Date
    Jul 2009
    Location
    Bratsk, Russia
    Posts
    7
    Vote Rating
    0
    alecm is on a distinguished road

      0  

    Default


    I've got same bug in my project. But in my situation this is because of quirck mode in which works my page in the project. If I lounch my app with sencha web start just from project directory, then n IE8 everything works fine. So consider to check your doctypes on the page.

    I suspect this behaviour caused by box-sizing property http://stackoverflow.com/questions/1...er-box-for-ie8