1. #1
    Ext User
    Join Date
    Mar 2008
    Posts
    57
    Vote Rating
    0
    aleczapka is on a distinguished road

      0  

    Default How to make tab scrollable?!

    How to make tab scrollable?!


    I am really loosing patience.. searching googling.. checking some code.. nothing works for me... how the hell do I simply make a tab content scrollable???????

    It's a window, which contains a formpanel, which contains tabs.
    The tab I want to make scrollable is: partnerPermissionsTab - the one with checkboxes.

    I've tried adding autoScroll: true and enableTabScroll:true everywhere I thought it made sense but no luck... Any help would be really appreciated...

    Thank you

    Code:
    // reference local blank image
    Ext.BLANK_IMAGE_URL = 'images/default/s.gif';
     
    // create namespace
    Ext.namespace('ibePartner');
     
    // create application
    ibePartner.app = function()
    {
        // do NOT access DOM from here; elements don't exist yet
     
        // PRIVATE VARIABLES
        var partnerWindowCount = 1;
        
        // PRIVATE FUNCTIONS
            //==========================================================================
            // FORM
            //==========================================================================
            var createPartnerForm = function(id) {
                     // turn on validation errors beside the field globally
                    Ext.form.Field.prototype.msgTarget = 'side';
                    
                    var partnerRequestsTypesDef = new Array(
                            {"key":"AddPartner","value":55},
                            {"key":"AddUser","value":50},
                            {"key":"BookFlight","value":5},
                            {"key":"BookHotel","value":10},
                            {"key":"CancelBookingItem","value":101},
                            {"key":"ConfirmBookingItemPayment","value":104},
                            {"key":"DeactivatePartner","value":56},
                            {"key":"DeactivateUser","value":51},
                            {"key":"GetBookings","value":100},
                            {"key":"GetDictionary","value":11},
                            {"key":"GetFareInfo","value":3},
                            {"key":"GetFlightInfo","value":2},
                            {"key":"GetHotelConditions","value":8},
                            {"key":"GetHotelInfo","value":7},
                            {"key":"GetPartner","value":58},
                            {"key":"GetPartners","value":59},
                            {"key":"GetUser","value":53},
                            {"key":"GetUsers","value":54},
                            {"key":"ModifyFlightBookingItem","value":102},
                            {"key":"ModifyHotelBookingItem","value":103},
                            {"key":"PriceFlight","value":4},
                            {"key":"PriceHotel","value":9},
                            {"key":"SearchFlights","value":1},
                            {"key":"SearchHotels","value":6},
                            {"key":"UpdatePartner","value":57},
                            {"key":"UpdateUser","value":52}
                    )
                    
                    var partnerRequestsTypes = new Array();
                    for (var a=0; a<partnerRequestsTypesDef.length; a++)
                    {
                            var bla = new Ext.form.Checkbox({
                            boxLabel:"&nbsp;",
                            name: partnerRequestsTypesDef[a].key,
                            value: partnerRequestsTypesDef[a].value,
                            inputValue: partnerRequestsTypesDef[a].value,
                            fieldLabel: partnerRequestsTypesDef[a].key,
                            xtype: "checkbox"
                });
                            partnerRequestsTypes.push(bla);
                    }
                    
                    var formPartner = new Ext.FormPanel({
                            id: 'partnerForm',
                    border:false,
                            labelAlign: 'right',
                            labelWidth: 180,
                            width:540,
                        loadingText:'Loading. asfasdfasd..',
                        savingText:'Saving..asdfasdfa.',                    
                            errorReader: new Ext.form.XmlErrorReader(),
                            // configure how to read the XML Data
                            reader: new Ext.data.XmlReader({
                                    record : 'GetPartner',
                                    success: '@success'
                            }, [
                                    {name: 'PartnerCode'},
                                    {name: 'PartnerName'},
                                    {name: 'Street'},
                                    {name: 'HouseNumber'}, 
                                    {name: 'RoomNumber'},
                                    {name: 'ZipCode'},
                                    {name: 'CityName'},
                                    {name: 'CountryName'},
                                    {name: 'NIP'},
                                    {name: 'Email'},
                                    {name: 'RequestUserId'},
                                    {name: 'RequestUserPassword'},
                                    {name: 'ToolkitUserId'},
                                    {name: 'ToolkitUserPassword'},
                                    {name: 'PartnerLocations'}
                            ]),
                    items: {
                            id: 'partnerTabs',
                        xtype:'tabpanel',
                        activeTab: 0,
                        defaults:{autoHeight:true, bodyStyle:'padding:10px', height: '500'},
                        autoScroll: true,
                        deferredRender:false,
                                    enableTabScroll:true,
                        items:[{
                            title:'Detale',
                            layout:'form',
                            defaults: {width: 500},
                            defaultType: 'textfield',
                            items: [{
                                                xtype:"hidden",
                                                name:"PartnerCodeId"
                            },{
                                    fieldLabel: 'Code',
                                                name:"PartnerCode",
                                                width: 190,
                                                disabled: true                              
                            },{
                                                    fieldLabel: 'Name',
                                                    name: 'PartnerName',
                                                    width:190
                                            }, {
                                                    fieldLabel: 'Street',
                                                    name: 'Street',
                                                    width:190
                                            }, {
                                                    fieldLabel: 'HouseNumber',
                                                    name: 'HouseNumber',
                                                    width:80
                                            }, {
                                                    fieldLabel: 'RoomNumber',
                                                    name: 'RoomNumber',
                                                    width:80
                                            }, {
                                                    fieldLabel: 'ZipCode',
                                                    name: 'ZipCode',
                                                    width:80
                                            }, {
                                                    fieldLabel: 'CityName',
                                                    name: 'CityName',
                                                    width:190
                                            }, {
                                                    fieldLabel: 'CountryName',
                                                    name: 'CountryName',
                                                    width:190
                                            }, {
                                                    fieldLabel: 'NIP',
                                                    name: 'NIP',
                                                    width:190
                                            }, {
                                                    fieldLabel: 'Email',
                                                    name: 'Email',
                                                    vtype: 'email',
                                                    width:190
                                            }, {
                                                    fieldLabel: 'RequestUserId',
                                                    name: 'RequestUserId',
                                                    width:190
                                            }, {
                                                    fieldLabel: 'RequestUserPassword',
                                                    name: 'RequestUserPassword',
                                                    width:190
                                            }, {
                                                    fieldLabel: 'ToolkitUserId',
                                                    name: 'ToolkitUserId',
                                                    width:190
                                            },{
                                                    fieldLabel: 'ToolkitUserPassword',
                                                    name: 'ToolkitUserPassword',
                                                    width:190
                                            }]
                        },{
                            id: 'partnerPermissionsTab',
                            title:'Uprawnienia',
                            listeners: {activate: handleActivateTab},
                            layout:'form',                          
                                            defaultType: 'checkbox',
                            items: partnerRequestsTypes
                        },{
                            id: 'partnerLocationsTab',
                            title:'Lokalizacje',
                            layout:'form',
                            defaults: {width: 190},
                                            defaultType: 'textfield',
                            items: [{
                                                            fieldLabel: 'LocationCode',
                                                            name: 'LocationCode1',
                                                            width:190
                                                    }, {
                                                            fieldLabel: 'LocationName',
                                                            name: 'LocationName1',
                                                            width:190
                                                    },{
                                                            fieldLabel: 'IP',
                                                            name: 'IP1',
                                                            width:190
                                                    }, {
                                                            fieldLabel: 'LocationCode',
                                                            name: 'LocationCode2',
                                                            width:190
                                                    }, {
                                                            fieldLabel: 'LocationName',
                                                            name: 'LocationName2',
                                                            width:190
                                                    }, {
                                                            fieldLabel: 'IP',
                                                            name: 'IP2',
                                                            width:190
                                                    }, {
                                                            fieldLabel: 'LocationCode',
                                                            name: 'LocationCode3',
                                                            width:190
                                                    }, {
                                                            fieldLabel: 'LocationName',
                                                            name: 'LocationName3',
                                                            width:190
                                                    }, {
                                                            fieldLabel: 'IP',
                                                            name: 'IP3',
                                                            width:190
                                                    }, {
                                                            fieldLabel: 'LocationCode',
                                                            name: 'LocationCode4',
                                                            width:190
                                                    }, {
                                                            fieldLabel: 'LocationName',
                                                            name: 'LocationName4',
                                                            width:190
                                                    }, {
                                                            fieldLabel: 'IP',
                                                            name: 'IP4',
                                                            width:190
                                                    }]
                        },{
                            title:'PartnerConnectionStrings',
                            layout:'form',
                            defaults: {width: 190},
                                            defaultType: 'textfield',
                            items: [{
                                                            fieldLabel: 'ProviderCode',
                                                            name: 'ProviderCode1',
                                                            width:190
                                                    }, {
                                                            fieldLabel: 'ConnectionString',
                                                            name: 'ConnectionString1',
                                                            width:190
                                                    },{
                                                            fieldLabel: 'ProviderCode',
                                                            name: 'ProviderCode2',
                                                            width:190
                                                    }, {
                                                            fieldLabel: 'ConnectionString',
                                                            name: 'ConnectionString2',
                                                            width:190
                                                    }, {
                                                            fieldLabel: 'ProviderCode',
                                                            name: 'ProviderCode3',
                                                            width:190
                                                    }, {
                                                            fieldLabel: 'ConnectionString',
                                                            name: 'ConnectionString3',
                                                            width:190
                                                    }, {
                                                            fieldLabel: 'ProviderCode',
                                                            name: 'ProviderCode4',
                                                            width:190
                                                    }, {
                                                            fieldLabel: 'ConnectionString',
                                                            name: 'ConnectionString4',
                                                            width:190
                                                    }, {
                                                            fieldLabel: 'ProviderCode',
                                                            name: 'ProviderCode5',
                                                            width:190
                                                    }, {
                                                            fieldLabel: 'ConnectionString',
                                                            name: 'ConnectionString5',
                                                            width:190
                                                    }, {
                                                            fieldLabel: 'ProviderCode',
                                                            name: 'ProviderCode6',
                                                            width:190
                                                    }, {
                                                            fieldLabel: 'ConnectionString',
                                                            name: 'ConnectionString6',
                                                            width:190
                                                    }]
                        }]
                    }
                    }); //end of form partner
    
                    formPartner.on({
                            actioncomplete: function(form, action){
                                    if(action.type == 'load'){
    
                                            //lame but works, need to activate permissions tab or the checkboxes won't get submitted if this tab will never be activated
                                            var t = Ext.getCmp("partnerTabs");
                                            t.hide();
                                            t.activate(0);
                                            t.activate(1);
                                            t.activate(2);
                                            t.activate(3);
                                            t.show();
                                            t.activate(0);                                  
    
                                            form.setValues([{id: "PartnerCodeId", value: form.findField("PartnerCode").value}]);                                    
                                            var n = partnerWindowCount;
                                            var wname = 'partnerWnd' + (n-1);
                                            Ext.getCmp(wname).buttons[0].enable();
                                    }
                            }
                    });     
                    
                    function handleActivateTab(tab)
                    {
                            //alert(tab.title + ' was activated.');
                    }
                    
                    return formPartner;
            }
    
        var showPartnerFormHandler = function(id) {
                    var form = createPartnerForm();
                    var adding = (!id || id == "");
    
                    
                    var wname = 'partnerWnd' + partnerWindowCount;
                var partnerWindow = new Ext.Window({
                    id: wname,
                    title: 'Partner',
                    width: 500,
                    height: 490,
                    minWidth: 500,
                    minHeight: 490,
                    layout: 'fit',
                    plain:false,
                    resizable: true,
                    bodyStyle:'padding:5px;',
                    buttonAlign:'center',
                    items: [form],
                    buttons: [
                            new Ext.Button({
                                            text: 'Zapisz',
                                            type: 'submit',
                                            disabled: true,
                                            handler: function(){
                                                    if (!adding)
                                                            form.getForm().submit({url:'Partner/json/exec/updatepartner/', waitMsg:'Zapisywanie Partnera...', success: submitOK, failure: submitError});
                                                    else
                                                            form.getForm().submit({url:'Partner/json/exec/addpartner/', waitMsg:'Dodawanie Partnera...', success: submitOK, failure: submitError});
                                            }
                                    }),
                            new Ext.Button({
                                            text: 'Anuluj',
                                            disabled:false,
                                            handler: function(){
                                                    partnerWindowCount--;
                                                    var wname = 'partnerWnd' + partnerWindowCount;
                                                    Ext.getCmp(wname).hide();
                                            }
                                    })
                    ]
                });
                
                
                
                    partnerWindow.show();
                    
                    if (!adding) //we are editing
                    {
                            form.getForm().load({url:'Partner/json/exec/getpartner/id/' + id, waitMsg:'Ładowanie...', success: wtf});
                    }
                    else //adding
                    {
                            var wname = 'partnerWnd' + partnerWindowCount;
                            Ext.getCmp(wname).buttons[0].enable();
                            form.getForm().findField("PartnerCode").enable();
                    }
                    
                    partnerWindowCount++;
                    
                    function submitOK(o)
                    {
                            Ext.MessageBox.alert('Partnerzy', o.errorReader.xmlData.firstChild.attributes[1].nodeValue);
                            partnerWindow.hide();
                            Ext.getCmp("partnerGrid").store.load({params:{start:0, limit:25}});
                    }               
                    
                    function submitError(o)
                    {
                            var error = o.errorReader.xmlData.firstChild.attributes[1].nodeValue;
                            if (error != "")
                                    error = ": " + error;
                            else 
                                    error = " " + error;
                            
                            
                            Ext.MessageBox.alert('Partnerzy', "Wystąpił Błąd" + error);
                    }               
                    
                    function wtf(o)
                    {
                            var partnerRTset = false;
                            var partnerCSset = false;
                            var partnerLocset = false;                      
                            var elements = form.getForm().items.items;
                                    
                            for (var a=0; a<o.reader.xmlData.firstChild.childNodes[0].childNodes.length; a++)
                            {
                                    var item = o.reader.xmlData.firstChild.childNodes[0].childNodes[a];
                                    
                                    if (item.nodeName == 'PartnerRequestTypes')
                                    {
                                            partnerRTset = true;
                                            for (var x=0; x<item.childNodes.length; x++)
                                            {
                                                    var i = item.childNodes[x];
                                                    for (var e=0; e<elements.length; e++)
                                                    {
                                                            if (elements[e].xtype == "checkbox" && elements[e].value == i.firstChild.nodeValue)
                                                            {
                                                                    elements[e].checked = true;
                                                                    break;
                                                            }
                                                    }
                                            }
                                    }
                                    
                                    if (item.nodeName == 'PartnerLocations')
                                    {
                                            var lc_step = 1;
                                            var ln_step = 1;
                                            var ip_step = 1;
                                            partnerLocset = true;
                                            
                                            for (var x=0; x<item.childNodes.length; x++)
                                            {
                                                    var items_cs = item.childNodes[x].childNodes;
                                                    for (var z=0; z<items_cs.length; z++)
                                                    {
                                                            var lc_name = "LocationCode" + lc_step;
                                                            var ln_name = "LocationName" + ln_step;
                                                            var ip_name = "IP" + ip_step;
                                                            
                                                            var i = items_cs[z];
                                                            if (i.nodeName == "LocationCode")
                                                            {
                                                                    for (var e=0; e<elements.length; e++)
                                                                    {
                                                                            if (elements[e].name == lc_name)
                                                                            {
                                                                                    if (i.firstChild != null)
                                                                                            elements[e].value = i.firstChild.nodeValue;
                                                                                    break;
                                                                            }
                                                                    }
                                                            }
                                                            
                                                            if (i.nodeName == "LocationName")
                                                            {
                                                                    for (var e=0; e<elements.length; e++)
                                                                    {
                                                                            if (elements[e].name == ln_name)
                                                                            {
                                                                                    if (i.firstChild != null)
                                                                                            elements[e].value = i.firstChild.nodeValue;
                                                                                    break;
                                                                            }
                                                                    }
                                                            }
                                                            
                                                            if (i.nodeName == "IP")
                                                            {
                                                                    for (var e=0; e<elements.length; e++)
                                                                    {
                                                                            if (elements[e].name == ip_name)
                                                                            {
                                                                                    if (i.firstChild != null)
                                                                                            elements[e].value = i.firstChild.nodeValue;
                                                                                    break;
                                                                            }
                                                                    }
                                                            }
                                                    }
                                                    lc_step++;
                                                    ln_step++;                                              
                                                    ip_step++;                                              
                                            }
                                    }
                                    
                                    if (item.nodeName == 'PartnerConnectionStrings')
                                    {
                                            var pc_step = 1;
                                            var cs_step = 1;
                                            partnerCSset = true;
                                            
                                            for (var x=0; x<item.childNodes.length; x++)
                                            {
                                                    var items_cs = item.childNodes[x].childNodes;
                                                    for (var z=0; z<items_cs.length; z++)
                                                    {
                                                            var pc_name = "ProviderCode" + pc_step;
                                                            var cs_name = "ConnectionString" + cs_step;
                                                            
                                                            var i = items_cs[z];
                                                            if (i.nodeName == "ProviderCode")
                                                            {
                                                                    for (var e=0; e<elements.length; e++)
                                                                    {
                                                                            if (elements[e].name == pc_name)
                                                                            {
                                                                                    if (i.firstChild != null)
                                                                                            elements[e].value = i.firstChild.nodeValue;
                                                                                    break;
                                                                            }
                                                                    }
                                                            }
                                                            
                                                            if (i.nodeName == "ConnectionString")
                                                            {
                                                                    for (var e=0; e<elements.length; e++)
                                                                    {
                                                                            if (elements[e].name == cs_name)
                                                                            {
                                                                                    if (i.firstChild != null)
                                                                                            elements[e].value = i.firstChild.nodeValue;
                                                                                    break;
                                                                            }
                                                                    }
                                                            }
                                                    }
                                                    pc_step++;
                                                    cs_step++                                               
                                            }
                                    }
                                    
                                    if (partnerRTset && partnerLocset && partnerCSset) break;
                            }
                    }       
        };
        
    
    
            //==============================================================================
            // GRID
            //==============================================================================
            var createPartnerGrid = function() {
                    var xg = Ext.grid;
                    var sm = new xg.CheckboxSelectionModel();
    
                    // create the Data Store
                    var store = new Ext.data.Store({
                            // load using script tags for cross domain, if the data in on the same domain as
                            // this page, an HttpProxy would be better
                            proxy: new Ext.data.HttpProxy({
                                    url: 'Partner/json/exec/getpartner/'
                            }),
    
                            // create reader that reads the Topic records
                            reader: new Ext.data.JsonReader({
                                    root: 'partners',
                                    totalProperty: 'totalCount',
                                    id: 'PartnerCode',
                                    fields: [
                                            'PartnerName', 
                                            'Street', 
                                            'HouseNumber', 
                                            'RoomNumber', 
                                            'ZipCode', 
                                            'CityName', 
                                            'CountryName', 
                                            'NIP', 
                                            'Email', 
                                            'RequestUserId', 
                                            'RequestUserPassword', 
                                            'ToolkitUserId', 
                                            'ToolkitUserPassword',
                                            'PartnerLocations',
                                            'PartnerConnectionStrings'
                                    ]
                            }),
    
                            // turn on remote sorting
                            remoteSort: true
                    });
                    store.setDefaultSort('PartnerName', 'desc');
                    
                    // the column model has information about grid columns
                    // dataIndex maps the column to the specific data field in
                    // the data store
                    var cm = new xg.ColumnModel([
                            sm,
                            {
                               id: 'PartnerCode', // id assigned so we can apply custom css (e.g. .x-grid-col-topic b { color:#333 })
                               header: "PartnerName",
                               dataIndex: 'PartnerName'
                            },
                            {
                               header: "Street",
                               dataIndex: 'Street'
                            },
                            {
                               header: "HouseNumber",
                               dataIndex: 'HouseNumber'
                            },
                            {
                               header: "RoomNumber",
                               dataIndex: 'RoomNumber'
                            },
                            {
                               header: "ZipCode",
                               dataIndex: 'ZipCode'
                            },
                            {
                               header: "CountryName",
                               dataIndex: 'CountryName'
                            },
                            {
                               header: "NIP",
                               dataIndex: 'NIP'
                            },
                            {
                               header: "Email",
                               dataIndex: 'Email'
                            },
                            {
                               header: "RequestUserId",
                               dataIndex: 'RequestUserId'
                            },
                            {
                               header: "RequestUserPassword",
                               dataIndex: 'RequestUserPassword'
                            },
                            {
                               header: "ToolkitUserId",
                               dataIndex: 'ToolkitUserId'
                            },
                            {
                               header: "ToolkitUserPassword",
                               dataIndex: 'ToolkitUserPassword'
                            },
                            {
                               header: "PartnerLocations",
                               dataIndex: 'PartnerLocations'
                            },
                            {
                               header: "PartnerConnectionStrings",
                               dataIndex: 'PartnerConnectionStrings'
                            }
                            ]);
    
                    // by default columns are sortable
                    cm.defaultSortable = true;
    
                    var grid = new xg.GridPanel({
                            id: 'partnerGrid',
                            el:'partner_body',
                            width:700,
                            height:500,
                            title:'Partnerzy',
                            store: store,
                            cm: cm,
                            trackMouseOver: true,
                            /*sm: new xg.RowSelectionModel({selectRow:Ext.emptyFn}),*/
                            sm: sm,
                            viewConfig: {
                                    forceFit:false
                            },
                            bbar: new Ext.PagingToolbar({
                                    pageSize: 3,
                                    store: store,
                                    displayInfo: true,
                                    displayMsg: 'Displaying topics {0} - {1} of {2}',
                                    emptyMsg: "No topics to display"
                            }),
                            // inline toolbars
                            tbar:[{
                                    text:'Dodaj Partnera',
                                    tooltip:'Dodaj nowy element',
                                    iconCls:'add',
                                    handler: partnerAdd
                            },
                            {
                                    text:'Edytuj Partnera',
                                    tooltip:'Edytuj wybrany element',
                                    iconCls:'edit',
                                    handler: partnerEdit
                            },        
                            {
                                    text:'Odśwież',
                                    tooltip:'Odśwież Liste',
                                    iconCls:'edit',
                                    handler: partnerReload
                            },        
                            '-',
                            {
                                    text:'Usuń Partnera',
                                    tooltip:'Usuń wybrany element',
                                    iconCls:'remove',
                                    handler: partnerDelete
                            }]          
                    });
    
                    // render it
                    grid.render();
    
                    // trigger the data store load
                    store.load({params:{start:0, limit:25}});
                    
                    function partnerReload()
                    {
                            store.load({params:{start:0, limit:25}});
                    }
    
                    
                    function partnerAdd()
                    {
                            showPartnerFormHandler(false);  
                    }
                    
                    function partnerEdit()
                    {
                            var record = sm.getSelected();
                            if ('undefined' == typeof record)
                            {
                                    Ext.MessageBox.alert("Błąd","Należy najpierw zaznaczyć Partnera na liście");
                                    return;
                            }  
                            showPartnerFormHandler(record.id);
                    }
                            
                    function partnerDelete()
                    {
                            var record = sm.getSelected();
                            if ('undefined' == typeof record)
                            {
                                    Ext.MessageBox.alert("Błąd","Należy najpierw zaznaczyć Partnera na liście");
                                    return
                            }                       
                            Ext.MessageBox.confirm('Potwierdź', 'Napewno usunąć Partnera: ' + record.id, partnerDeleteExec);
                    }
                    
                    function partnerDeleteExec(btn)
                    {
                            if (btn == "no") return;
                            var record = sm.getSelected();
                            
                            function partnerDeleteOk(o)
                            {
                                    Ext.MessageBox.alert('Partnerzy', o.responseXML.firstChild.attributes[1].nodeValue);
                                    store.load({params:{start:0, limit:25}});
                            }
                            
                            function partnerDeleteFailure()
                            {
                                    Ext.MessageBox.alert('Partnerzy', o.responseXML.firstChild.attributes[1].nodeValue);
                                    Ext.MessageBox.alert('Błąd', 'Error while deleting')
                            }
                            
                            Ext.Ajax.request({
                               url: 'Partner/json/exec/deletepartner/',
                               success: partnerDeleteOk,
                               failure: partnerDeleteFailure,
                               headers: {
                                   'my-header': 'foo'
                               },
                               params: { PartnerCode:  record.id}
                            });                     
                            
                            //Ext.getCmp("partnerForm").getForm().submit({url:'partner/json/exec/deletepartner/', waitMsg:'Usuwanie Partnera...', success: submitOK, failure: submitError});
                    }
                    
                    
                    return xg;
            }
            
        // PUBLIC SPACE
        return {
            // public properties, e.g. strings to translate
                    PageTitle: "partnerzy",
                    pGrid: false,
                    
            // public methods
            init: function()
            {
                            
            },
            addPartner: function ()
            {
                    if (!this.pGrid);
                            this.init();
                            
                    showPartnerFormHandler(false);  
            },
            exec: function ()
            {
                    setPageTitle(this.PageTitle);
                    setRenderBlock("partner_body");
                            this.pGrid = createPartnerGrid();
            }
        };
    }(); // end of app
    
    
    // A reusable error reader class for XML forms
    Ext.form.XmlErrorReader = function(){
        Ext.form.XmlErrorReader.superclass.constructor.call(this, {
                record : 'field',
                success: '@success'
            }, [
                'id', 'msg'
            ]
        );
    };
    Ext.extend(Ext.form.XmlErrorReader, Ext.data.XmlReader);
    
    
    
    Ext.onReady(ibePartner.app.init, ibePartner.app);

  2. #2
    Ext User
    Join Date
    Mar 2008
    Posts
    57
    Vote Rating
    0
    aleczapka is on a distinguished road

      0  

    Default


    Well, I somehow managed to fix it..

    Code:
    	        items: {
    	        	id: 'partnerTabs',
    	            xtype:'tabpanel',
    	            activeTab: 0,
    	            defaults:{autoHeight:false, bodyStyle:'padding:10px', height: 340, autoScroll:true, enableTabScroll:true, border: false},
    But.. everytime I activate tab 2 - the one which gets the scrollbar - the scrollbar gets bigger and bigger.. wtf is that?

  3. #3
    Sencha - Ext JS Dev Team Animal's Avatar
    Join Date
    Mar 2007
    Location
    Notts/Redwood City
    Posts
    30,502
    Vote Rating
    47
    Animal has a spectacular aura about Animal has a spectacular aura about

      0  

    Default


    Do not use the height config in the defaultt. Height and width of tab items are managed by the TabPanel's CardLayout layout manager which sizes them to fix exactly into the TabPanel's content area.

    The setting you need is autoScroll:true on any Panel you wish to allow scrollbars when its content overflows.

  4. #4
    Ext User
    Join Date
    Mar 2008
    Posts
    57
    Vote Rating
    0
    aleczapka is on a distinguished road

      0  

    Default


    Thx! Much appriciated, it helped!

    I've managed to fix it, however the scrollbar won't show up in IE - I can still scroll using wheel mouse tho...

    the code I've changed:

    Parent container (panel)
    Code:
    defaults:{height: 410, width: 500, autoScroll:false},

    Tabs
    Code:
    defaults:{bodyStyle:'padding:10px', autoScroll:true, border: false, enableTabScroll:true},

    Is there some option I should set layout to?

    Panel has layout: fit - as it's nested inside the window, tabs have no layout defined...

  5. #5
    Sencha - Ext JS Dev Team Animal's Avatar
    Join Date
    Mar 2007
    Location
    Notts/Redwood City
    Posts
    30,502
    Vote Rating
    47
    Animal has a spectacular aura about Animal has a spectacular aura about

      0  

    Default


    Now you've lost me. (Not difficult)

    The principle is simple. autoScroll:true on Panels you want to scroll their contents.

  6. #6
    Ext User
    Join Date
    Mar 2008
    Posts
    57
    Vote Rating
    0
    aleczapka is on a distinguished road

      0  

    Default


    All works now, thanks again! Setting layout to 'form' and correct width apparently did the trick - the scrollbar shows in IE now.

    Thank you Mr. Animal

Thread Participants: 1