Results 1 to 8 of 8

Thread: problem in ie7

  1. #1
    Ext User
    Join Date
    Dec 2008
    Posts
    32
    Vote Rating
    0
      0  

    Question problem in ie7

    Hi,
    The width of west panel is not proper in IE7. I have written the following,
    Code:
    var viewport = new Ext.Viewport({
            layout:'border',    
            items: [
                        new Ext.BoxComponent({
                            region:'north',
                            el: 'North',
                            height:'10%',
                            autoHeight:true 
                         }),                                         
                        new Ext.Panel({  
                            id: 'westPanel',                      
                            el:'West',
                            region: 'west',
                            title:'Select',
                            layout: 'fit',
                            width: 427,                        
                            minSize: 427,
                            split: true,                        
                            collapsible: true,
                            items:[ tabs ]
                        }),
                         {
                             id:'center-panel',
                             region:'center',
                             collapsible: true,
                             layout:'fit',
                             items: [grid]             
                         },                
                        southPanel  
            ]
       }); 
    
    i have written the following code for tabs in west panel,
    
    
        var tabs = new Ext.ExtTabPanel({
            id:'tabs1',
            renderTo: 'WestTab',
            activeTab: activeTabPanel,        
            layoutOnTabChange:true,
            items:[ 
                new Ext.Panel({
                 ContentEl:'CenterTab1',
                 title:'Browse',
                 layout: 'fit',
                 items:[ treePanel ]
                }),  
                new Ext.Panel({
                    contentEl:'CenterTab2',
                    title:'Query',  
                    layout: 'fit',
                    buttonAlign: 'center',            
                    items: [accordionPanel]
               }),new Ext.Panel({
                        ContentEl:'CenterTab3',
                     title:'Import',
                     layout: 'fit',                 
                     frame: true,    
                     hideMode:'offsets',
                     items: [{
                         xtype: 'panel',
                         bodyCfg: {tag: 'center',  style:'{background:white;}'},                                          
                         items: [importPanel]
                     }]
               }),new Ext.Panel({
                 ContentEl:'CenterTab4',
                 title:'Export',
                 layout: 'absolute',             
                 border: false,
                 hideMode:'offsets',
                 items:[{
                     x: -20,
                    y: 10,
                    width: 350,               
                     ContentEl: 'ExportForm',
                     items:[fp1]
                 },
                 {
                     x: -160,
                    y: 60,
                     width: 360,
                     ContentEl: 'ExportDetails',
                     items: [formP1]
                 }]
                }),new Ext.Panel({
                    ContentEl: 'CenterTab5',
                    title: 'Save',
                    layout: 'absolute',
                    border: false,
                    hideMode:'offsets',
                    items: [{
                        x: -5,
                        y:10,
                        width: 350,
                        ContentEl: 'saveFields',
                        items: [saveFieldsPanel]
                    },{
                        x: -90,
                        y:60,                    
                        width: 360,
                        ContentEl: 'saveButtons',
                        items: [saveButtonsPanel]
                    }]
                })]
                       
        });
    Someone please help. I have tried for lot of time i could not get it. With Firefox there are no issues.
    Last edited by mystix; 24 Feb 2009 at 7:11 AM. Reason: moved to 2.x Help from Examples. post code in [code][/code] tags. see http://extjs.com/forum/misc.php?do=bbcode#code

  2. #2
    Sencha User jay@moduscreate.com's Avatar
    Join Date
    Mar 2007
    Location
    DC Area =)
    Posts
    16,364
    Vote Rating
    86
      0  

    Default

    you can't use percentages in height.

    remove el from that west panel

  3. #3
    Sencha User jay@moduscreate.com's Avatar
    Join Date
    Mar 2007
    Location
    DC Area =)
    Posts
    16,364
    Vote Rating
    86
      0  

    Default

    remove renderTo from your tab panel. Remove contentEL and ContentEl from every container that has items.

  4. #4
    Ext User
    Join Date
    Dec 2008
    Posts
    32
    Vote Rating
    0
      0  

    Question File upload display problem in ie7

    Thank you very much jgarcia for the reply.

    But there is a problem with file upload in ie7 itself. It shows up well in firefox. The way i have done is,

    Code:
        var fp = new Ext.FormPanel({        
            fileUpload: true,
            layoutOnTabChange: true,        
            labelAlign: 'right',
            layout: 'absolute',
            height: 50,
            width : 330, 
            border: false,
            defaults: {           
                allowBlank: false,
                msgTarget: 'qtip'
            },
            items: [{
                xtype: 'label',
                x: 25,
                y: 18,
                text: 'Import File :'
            },{
                xtype: 'fileuploadfield',
                id: 'formfile',  
                width: 225,  
                x: 88,
                y: 15,        
                emptyText: 'Select file to upload',            
                name: 'FilePath',
                buttonCfg: {
                    text: '',                
                    iconCls:'upload-icon'
                }
             }
            ]});
    
    var formP = new Ext.FormPanel({        
            fileUpload: false,        
            border: false,
            autoWidth: true,        
            labelAlign: 'right',        
            defaults: {
                anchor: '100%',
                allowBlank: false,
                msgTarget: 'qtip',
                border: false
            },
            items: [{
                xtype: 'fieldset',
                id: 'headingid',
                autoHeight: false,            
                height:40,            
                border: false,            
                defaultType: 'checkbox',
                items: [{
                    name: 'heading',
                    id: 'checkid',
                    labelSeparator: '',
                    checked: true,                
                    boxLabel: 'First Row contains Header'
                }]
            },{
                   xtype: 'panel',                                  
                   items: [{
                       xtype: 'progress',
                       id: 'pbar',
                       hidden: true,
                       text: 'Uploading...'
                   },{                    
                       xtype: 'panel',                   
                       layout: 'fit',
                       id: 'ImportGridPanel'                    
                   }]
            }]       
        });
    
    var importPanel = new Ext.Panel({                
                    layout:'table',
                    layoutConfig: {columns:2},         
                    items:[{                                             
                           width:320,                       
                           items: [fp]                                          
                    },{                  
                       width:83,
                       buttons: [{
                               buttonAlign: 'center',
                               text: 'Import'                           
                       }]
                    },{                   
                        width:410,
                        colspan:2,
                        items: [formP]                    
                    }]
            });
    Please help.

  5. #5
    Ext User
    Join Date
    Dec 2008
    Posts
    32
    Vote Rating
    0
      0  

    Question fileupload display problen in ie7

    Can some bail me out from this. Please...

  6. #6
    Sencha - Community Support Team Condor's Avatar
    Join Date
    Mar 2007
    Location
    The Netherlands
    Posts
    24,246
    Vote Rating
    119
      0  

    Default

    I see no difference in the file upload between IE7 and FF3.

    (the only difference is that empty panels have a height in IE7 and zero height in FF3)

  7. #7
    Ext User
    Join Date
    Dec 2008
    Posts
    32
    Vote Rating
    0
      0  

    Thumbs up solved. Issue with width

    Thanks very much Condor for the reply.
    As rightly mentioned by you there is no difference. It was with setting width incorrectly that i faced the issue.

    Thanks,
    Sai

  8. #8
    Sencha User
    Join Date
    Feb 2013
    Posts
    2
    Vote Rating
    0
      0  

    Default

    I am facing issue with IE7, panel table layout items.

    I am removing the items from the table panel by removeAll().
    But it looks like the panel show some default height in IE7. So next time, the items are laid out after some portion in the panel.
    Though I set the panel height to 0, by panel.setHeight(0); the issue still persists.

    Any help would be appreciated

    Thanks

Posting Permissions

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