Results 1 to 2 of 2

Thread: horizontal scroll in firefox 3.5.11

  1. #1
    Ext JS Premium Member
    Join Date
    Oct 2010
    Posts
    268

    Default horizontal scroll in firefox 3.5.11

    I want to get rid of horizontal grid in Firefox ver 3.5.11. there is no issue of horizontal scrollbar in IE 8.
    I tried adding

    Code:
     viewConfig: {
                         forceFit: true
                       },
    result is horizontal bar vanishes but in Internet explorer 8, element below the grid fieldset- vanishes.

    Code:
    // JScript File
    var fm = Ext.form;
    Application.Network = Ext.extend(Ext.form.FormPanel, {
        border: false,
        initComponent: function () {
            var myData_cache = [
                ["N1", "155.123.33.12", "jetset ALB", "Yes"],
                ["N2", "155.123.33.13", "jetset ALV", "Yes"],
                ["N3", "155.123.33.14", "jetset ALM", "Yes"]
            ];
            function genre_name2(val) {
                if (val == 0 || val == undefined) val = 1;
                return genres2.queryBy(function (rec1) {
                    return rec1.data.id == val;
                }).itemAt(0).data.genre2;
            };
            var ds_model = Ext.data.Record.create(['id', 'coverthumb', 'title', 'director', 'released', 'genre', 'tagline',
            {
                name: 'price',
                type: 'float'
            }, {
                name: 'available',
                type: 'bool'
            }]);
            var store = new Ext.data.Store({
                data: [
                    [1, "", "etho 0", "Test", 1, 2, "eht0=vmxnet", 19.95, true],
                    [2, "", "etho 1", "Live", 1, 2, "eht1=vmxnet", 20.12, true],
                    [3, "", "etho 2", "Prod", 1, 1, "eht2=vmxnet", 21.56, 1]
                ],
                reader: new Ext.data.ArrayReader({
                    id: 'id'
                }, ds_model)
            });
            var genre_edit2 = new Ext.form.ComboBox({
                typeAhead: true,
                triggerAction: 'all',
                mode: 'local',
                store: genres2,
                displayField: 'genre2',
                valueField: 'id',
                listeners: {
                    select: function (f, r, i) {
                        if (i === 0) {
                            Ext.Msg.prompt('New Genre', 'Name', Ext.emptyFn);
                        }
                    }
                }
            });
    
            var genres2 = new Ext.data.SimpleStore({
                fields: ['id', 'genre2'],
                data: [
                    ['0', ''],
                    ['1', '10'],
                    ['2', '100'],
                    ['3', '1000'],
                    ['4', 'Auto']
                ]
            });
            var ds12 = new Ext.data.Store({
                reader: new Ext.data.ArrayReader({}, [{
                    name: 'N1',
                    type: 'text'
                }, {
                    name: 'N2',
                    type: 'text'
                }, {
                    name: 'N3',
                    type: 'text'
                }, {
                    name: 'N4',
                    type: 'text'
                }
                ])
            });
            ds12.loadData(myData_cache);
            /////// config start
            var stDate = new Ext.data.SimpleStore({
                fields: ['id', 'Protocol1'],
                data: [
                    ['1', 'etho 1'],
                    ['2', 'etho 2']
                ]
            });
            var colModel_cache = new Ext.grid.ColumnModel([
            {
                header: "Destination",
                width: '20%',
                id: "Destination",
                autoScroll: true,
                css: "border:0 none;",
                sortable: true,
                dataIndex: 'N1',
                editor: new fm.TextField({
                    allowBlank: false
                })
            },
            {
                header: "Gateway",
                width: '20%',
                sortable: true,
                css: "border:0 none;",
                dataIndex: 'N2',
                editor: new fm.TextField({
                    allowBlank: false
                })
            }, {
                header: "Mask",
                width: '20%',
                css: "border:0 none;",
                dataIndex: 'genre2',
                renderer: genre_name2,
                editor: genre_edit2
            }, {
                header: "Adapter",
                width: '20%',
                sortable: true,
                css: "border:0 none;",
                dataIndex: 'N2',
                editor: new fm.TextField({
                    allowBlank: false
                })
            }, {
                header: "Active",
                css: "border:0 none;",
                width: '20%',
                sortable: true,
                dataIndex: 'N4',
                editor: new fm.TextField({
                    allowBlank: false
                })
            }
            ]);
            var config = {
                layout: 'form',
                autoScroll: true,
                height: 460,
                //frame:'true',
                url: '../Submit.htm<#SessionID>',
                width: '100%',
                bodyStyle: 'padding:25px',
                labelWidth: 70,
                propertyNames: {
                    borderWidth: 'Border Width'
                },
                defaultType: 'textfield',
                labelAlign: 'top',
                defaultType: 'textfield',
                items: [{
                    xtype: 'label',
                    // cls:'gradientV',
                    style: 'margin-left:0;margin-bottom:20;margin-top:-10;',
                    html: '<div class="gradientV"><font size="2" face="Arial"><b>Network </b></font></div>',
                    //html: '<font size="2" face="Arial"><b> Network </b></font>',
                    anchor: '98%'
                }, {
                    xtype: 'fieldset',
                    title: 'Default Route',
                    anchor: '98%',
                    items: [{
                        xtype: 'compositefield',
                        hideLabel: 'true',
                        anchor: '98%',
                        items: [{
                            xtype: 'displayfield',
                            value: 'Default Gateway:'
                        }, {
                            name: 'minutes',
                            xtype: 'numberfield',
                            width: 50,
                            allowBlank: false
                        }, {
                            xtype: 'combo',
                            name: 'genre',
                            displayField: 'Protocol1',
                            style: 'margin-left:5',
                            mode: 'local',
                            typeAhead: true,
                            triggerAction: 'all',
                            width: 250,
                            store: stDate
                        }, {
                            xtype: 'label',
                            style: 'width:5',
                            formBind: true
                        }, {
                            xtype: 'tbbutton',
                            text: 'Update',
                            icon: 'images/addition/update.png',
                            width: '60',
                            name: 'update_time'
                        }]
                    }]
                }, {
                    xtype: 'label',
                    html: '<br />',
                    width: '81%'
                },
                //---------------------------------------------
                {
                    xtype: 'fieldset',
                    title: 'Static Route',
                    anchor: '98%',
                    items: [{
                        xtype: 'button',
                        width: '60px',
                        icon: 'images/table_add.png',
                        style: 'margin-left:0;margin-bottom:0;',
                        text: 'Add Records'
                    }, {
                        xtype: 'button',
                        width: '60px',
                        icon: 'images/table_delete.png',
                        style: 'margin-left:100;margin-top:-22;',
                        text: 'Remove Records'
                    }, {
                        xtype: 'label',
                        html: '<br />',
                        width: '81%'
                    }, {
                        xtype: 'editorgrid',
                        ds: ds12,
                        cm: colModel_cache,
                        width: '98%',
                        id: 'dgrid',
                        stripeRows: true,
                        height: 115,
                        border: false
                    }, {
                        xtype: 'button',
                        text: 'Save',
                        icon: 'images/addition/save.png',
                        formBind: true,
                        scope: this,
                        cls: 'x-btn-left2',
                        style: 'margin-bottom:10;margin-top:-10;',
                        handler: this.submit
                    }]
                }, {
                    xtype: 'label',
                    html: '<br />',
                    width: '81%'
                },
                {
                    xtype: 'fieldset',
                    title: 'Details',
                    style: 'margin-bottom:42;',
                    anchor: '98%',
                    items: [{
                        xtype: 'compositefield',
                        msgTarget: 'side',
                        fieldLabel: '',
                        items: [{
                            xtype: 'textarea',
                            name: 'Server Too Busy',
                            height: '100',
                            style: 'margin-left:1%;',
                            width: '98%'
                        }
                        ]
                    }]
                }
    
                ]
            };
    
            Ext.apply(this, Ext.apply(this.initialConfig, config));
            // });
            Application.EmailEventsForm.superclass.initComponent.apply(this, arguments);
        } // eo function initComponent
        ,
        onRender: function () {
            // this.store.load();
            Application.EmailEventsForm.superclass.onRender.apply(this, arguments);
        } // eo function onRender
        ,
        submit: function () {
            this.getForm().submit({
                standardSubmit: true,
                //url     :'Default.aspx<#SessionID>',
                //url     :'Default.aspx',
                url: this.url,
                success: this.onSuccess,
                failure: this.onFailure
                //params:{cmd:'save'} 
            });
        }
        ,
        onSuccess: function (form, action) {
            Ext.MessageBox.alert("Success", "Form Submitted SuccessFully");
        }
        ,
        onFailure: function (form, action) {
            Ext.MessageBox.alert("Failure", "Form could not be Submitted.");
        }
    });
    Ext.reg('Network', Application.Network);

  2. #2
    Sencha User Condor's Avatar
    Join Date
    Mar 2007
    Location
    The Netherlands
    Posts
    24,245

    Default

    Do NOT use width:'percentage'!!!

    Use a layout:'column' with columnWidth or a layout:'hbox' with flex.

Similar Threads

  1. Replies: 0
    Last Post: 18 Oct 2010, 7:05 AM
  2. How to disable only vertical scroll and not horizontal scroll in tab
    By kukulor in forum Ext 3.x: Help & Discussion
    Replies: 1
    Last Post: 16 Sep 2010, 12:20 AM
  3. Replies: 6
    Last Post: 26 Feb 2010, 3:57 PM
  4. Vertical scroll bar brings horizontal scroll bar
    By smiletolead in forum Ext GWT: Discussion
    Replies: 4
    Last Post: 26 Nov 2009, 1:14 AM

Posting Permissions

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