0
votes

I have a tab view in my app which is docked bottom. In the top there is one top bar with log. And middle of the screen i have buttons and field set. As the device height is less, i want to scroll the field set, so user can enter the text and press the submit button. But the field set is not scrolling. Here is my code part::

    {            xtype : 'container',
            styleHtmlContent : true,
            scrollable: true,
            layout : {
                type : 'card'
            },
            title : 'Home',
            iconCls : 'home',
            items : [ {
                xtype : 'image',
                docked : 'left',
                height : 92,
                id : 'Logoimage',
                ui : '',
                width : 120,
                src : 'app/images/small_logo.png'
            }, {
                xtype : 'titlebar',
                cls : 'mytitlebar',
                docked : 'top',
                height : 80,
                ui : 'blue',
                items : [ {
                    xtype : 'label',
                    height : 36,
                    html : 'Consumer signup',
                    id : 'title',
                    margin : 20,
                    style : 'font: normal Bold 20px droid sans; color:#AB3951',
                } ]
            },  {
                xtype : 'container',
                docked : 'top',
                id : 'dashboardiconcontainer',
                scroll: 'vertical',
                layout : {
                    type : 'fit',
                    pack  : 'center',
                    align : 'middle'
                },


                items : [ {
                    xtype : 'label',
                    docked : 'top',
                    margin : '20 0 0 0',
                    html : 'Signup your customers to Teritree Portal',
                    id : 'signuplabel',
                    style : 'font: normal 24px droid sans'
                }, {
                    xtype : 'fieldset',
                    docked : 'top',
                    margin : '20 0 0 0',
                    width : 600,
                    height : 200,

                    items : [ {
                        xtype : 'textfield',
                        id : 'consumername',
                        style : 'font: Droid Sans',
                        label : 'Consumer Name',
                        labelWidth : '30%'
                    }, {
                        xtype : 'numberfield',
                        id : 'Mobilenum',
                        style : 'font: Droid Sans',
                        label : 'Mobile',
                        labelWidth : '30%'
                    }, {
                        xtype : 'emailfield',
                        id : 'email',
                        label : 'Customer Email id',
                        labelWidth : '30%',
                        placeHolder : '[email protected]'
                    }, {
                        xtype : 'textareafield',
                        id : 'adressfield',
                        style : 'font: Droid Sans',
                        label : 'Address',
                        labelWidth : '30%'
                    }, {
                        xtype : 'textfield',
                        id : 'areafield',
                        style : 'font: Droid Sans',
                        label : 'Area/Location',
                        labelWidth : '30%'
                    }, {
                        xtype : 'selectfield',
                        label : 'City',
                        labelWidth : '30%',
                        options : [ {
                            text : 'Bangalore',
                            value : 'first'
                        }, {
                            text : 'Delhi',
                            value : 'second'
                        }, {
                            text : 'Mumbai',
                            value : 'third'
                        } ]
                    }, {
                        xtype : 'numberfield',
                        id : 'pinfield',
                        style : 'font: Droid Sans',
                        label : 'Pincode*',
                        labelWidth : '30%'
                    }, ]
                }, {
                    xtype : 'button',
                    height : 40,
                    id : 'submitbtn',
//                    margin : '30 0 0 500',
                    ui : 'orange',
                    width : 220,
                    text : 'Submit'
                } ]
            }
            ]
        }

The above code is for only tab. So how can i make that field set scroll-able??

Thanks in advance.

1
Did you try to set your fieldset scrollable width scrollable: {direction:'vertical'} ?Titouan de Bailleul

1 Answers

0
votes

I able to resolve it by making the field set as scrollable: true