fieldset going onto Toobar

[ramannachekuri]

My application has multiple views. Couple of view have 2 Toolbars and a fieldset. When a fieldset is big I have to scroll down to enter the data and I see it is overlaying second toolbar when I scroll down. We didnt see this problem with earlier versions. Here is the code we have
{
xtype: 'toolbar',
docked: 'top',
title:L.cc1Title,
id:'closecase-tertiarytoolbar',
style: 'font-size: small;',
ui:'tertiarytoolbar'



},
{
xtype: 'fieldset',
margin:0,
border: false,
id:'closecaseFieldset',
items: [
]
}



Is this known issue in 2.1 RC2?

[mitchellsimoens]

I tried this with 2.1.0 RC2 and all works as expected:

Ext.Viewport.add({
    xtype : 'formpanel',
    items : [
        {
            xtype  : 'toolbar',
            docked : 'top',
            title  : 'Top Toolbar'
        },
        {
            xtype       : 'fieldset',
            defaultType : 'textfield',
            items       : [
                {
                    label : 'One'
                },
                {
                    label : 'Two'
                },
                {
                    label : 'Three'
                },
                {
                    label : 'Four'
                },
                {
                    label : 'Five'
                },
                {
                    label : 'Six'
                },
                {
                    label : 'Seven'
                },
                {
                    label : 'Eight'
                },
                {
                    label : 'Nine'
                },
                {
                    label : 'Ten'
                }
            ]
        }
    ]
});

Can I get a fully runnable testcase to test?

[ramannachekuri]

Ext.define("ICEApp.view.CloseSubCase1", {
	extend : 'Ext.form.Panel',
	xtype : 'closesubcase1',
	config : {
		screenTitle:null,
		orderTypeStore:null,
		repairClassStore:null,
		delayCodeStore:null,
		travelZoneStore:null,
		subcaseCloseDataStore:null,
		scrollable: {
		    direction: 'vertical',
		    directionLock: true
		}			
	},
	initialize: function(){
		var me = this;		
	    me.setItems ( [
		{
		  		xtype: 'toolbar',
				docked: 'top',
				title: me.getScreenTitle(),
				id:'closecasetitlebar',				
				style: 'font-size: small;',
				ui:'secondarytoolbar',
				layout : {
					pack : 'center'
				},
				 
				items : [
					{
						text: 'Back',
						ui: 'back',
						id:'closecaseback'
					},
					{xtype:'spacer'},
                	{
						iconAlign: 'right',
						iconMask:true,
                    	text: 'Next',
						iconCls: 'action',
						id:'closecasenextbutton'
					}
		
				]							
		},
		{
			xtype: 'toolbar',
			docked: 'top',
			title:L.cc1Title,
			id:'closecase-tertiarytoolbar',
			style: 'font-size: small;',
			ui:'tertiarytoolbar'
				


		},				
		 {
            xtype: 'fieldset',            
			margin:0,
			border: false,
            id:'closecaseFieldset',            
         	items: [


				{
					xtype : 'textfield',
					name : 'tagProductNo',
					label : L.tagProductNo,
					labelCls:'fieldLabelClass',
					labelWidth:135,
					clearIcon:true
				}, 		
				{
					xtype : 'textfield',
					name : 'tagSerialNo',
					label : L.tagSerialNo,
					labelCls:'fieldLabelClass',
					labelWidth:135,
					clearIcon:true
					
				},


				{
					xtype: 'textfield',
					name: 'tagSysProductNo',
					label: L.tagSysProductNo,
					labelCls:'fieldLabelClass',
					labelWidth:135,
					clearIcon:true
				},
				{
					xtype: 'textfield',
					name: 'tagSysSerialNo',
					id:'tagSysSerialNo',
					label: L.tagSysSerialNo,
					labelCls:'fieldLabelClass',
					hideOnMaskTap:true,
					labelWidth:135,
					clearIcon:true
				},
				{
                    xtype: 'selectfield',
                    name : 'tagOrderType',
                    label: L.tagOrderType,
                    labelCls:'fieldLabelClass',
                    id:'tagOrderType',
                    labelWidth:135,
                    usePicker:false,
					store:me.getOrderTypeStore()
                },						
				{
					xtype: 'textfield',
					name: 'tagSeviceNoteNo',
					label: L.tagSeviceNoteNo,
					labelCls:'fieldLabelClass',
					hideOnMaskTap:true,
					labelWidth:135,
					clearIcon:true
				},


				{
					xtype: 'textfield',
					name: 'tagCTN',
					label: L.tagCTN,
					labelCls:'fieldLabelClass',
					hideOnMaskTap:true,
					labelWidth:135,
					clearIcon:true
				},




				{
                    xtype: 'selectfield',
                    name : 'tagRepairClass',
                    id : 'tagRepairClass',
                    label: L.tagRepairClass,
                    labelCls:'fieldLabelClass',
                    labelWidth:135,
                    usePicker:false,
					store:me.getRepairClassStore()
					
					
                },
				{
                    xtype: 'selectfield',
                    name : 'tagDelayCode',
                    id : 'tagDelayCode',
                    label: L.tagDelayCode,
                    labelCls:'fieldLabelClass',
                    labelWidth:135,
                    usePicker:false,
					store:me.getDelayCodeStore()
                },
				{
					xtype: 'textareafield',
					name: 'tagClosingSummary',
					id: 'tagClosingSummary',
					label: L.tagClosingSummary,
					labelCls:'fieldLabelClass',
					hideOnMaskTap:true,
					labelWidth:135,
					clearIcon:true							
				},                          
                //tag for arrival time
				{
       				xtype: 'datetimepickerfield',
       				name : 'tagArrivalTime',
					id:'tagArrivalTime',
        			label: L.tagArrivalTime,
        			labelCls:'fieldLabelClass',
        			labelWidth:135,
        			myPicker:gPicker,
        			format : gdateFormat5,
        			value: new Date()
    			},                        
                //tag for finished time
				{
       				xtype: 'datetimepickerfield',
       				name : 'tagFinishedTime',
					id:'tagFinishedTime',
        			label: L.tagFinishedTime,
        			labelCls:'fieldLabelClass',
        			labelWidth:135,
        			myPicker:gPicker,
        			format : gdateFormat5,
        			value: new Date()
    			},                         
                //tag for System Fixed Time
				{
       				xtype: 'datetimepickerfield',
       				name : 'tagSysFixedTime',
					id:'tagSysFixedTime',
        			label: L.tagSysFixedTime,
        			labelCls:'fieldLabelClass',
        			labelWidth:135,
        			myPicker:gPicker,
        			format : gdateFormat5,
        			value: new Date()
    			}, 
				{
     	        	//layout: 'hbox',
                    layout: {
                        type: 'hbox'
                    },     	        	
	 	           	items: [
     	        		{
							xtype: 'numberfield',
							minValue:0,
							maxValue:24,
							maxLength : 2,							
							name: 'tagDurationHr',
							id: 'tagDurationHr',
							label: L.tagDurationHr,
							labelCls:'fieldLabelClass',
							labelWidth:135,
							width : 140,
							//clearIcon:true,
     	        		},
						/*{
							xtype:'spacer',
							html:'Hrs',
							padding:5,
							flex : 1
							//width:10
						},*/
     	        		{
							xtype: 'numberfield',
							minValue:0,
							maxValue:59,
							maxLength : 2,
							name: 'tagDurationMn',
							id : 'tagDurationMn',
							width:145,
							//clearIcon:true,
							         	
		        		}
     	        	]
     	        
     	        },    
     	    
        	/*	{
					xtype: 'numberfield',
					minValue:0,
					maxValue:24,
					name: 'tagDurationHr',
					id: 'tagDurationHr',
					label: L.tagDurationHr,
					labelCls:'fieldLabelClass',
					labelWidth:135,
					width:155,
					clearIcon:true
        		},
        		{
					xtype: 'numberfield',
					minValue:0,
					maxValue:59,
					name: 'tagDurationMn',
					id : 'tagDurationMn',
					label: L.tagDurationHr,
					labelCls:'fieldLabelClass',
					labelWidth:135,
					width:155,
					clearIcon:true
					         	
        		},*/


				// tag for travel zone
				{
                    xtype: 'selectfield',
                    name : 'tagTravelZone',
                    id : 'tagTravelZone',
                    label: L.tagTravelZone , 
                    labelCls:'fieldLabelClass',                            
                    labelWidth:135,
                    usePicker:false,
					store:me.getTravelZoneStore()
                } 
				
				
			]},




			{
				xtype:'panel',
				name:'warningMsgPanel',
				id:'warningMsgPanel',
				hidden:true,
				layout:'vbox',
				width:'100%',
				//cls:'customMessagePanel',
				cls:'customMessagePanel',
				items:[
					{
						html:"<font color=red><b>WARNING!</b></font>",
						margin:10
					},
					{
						html:"Warning:sfsfsdfsdf<br> ",
						id:'warningMsg',
						//cls:'customMessagePanel',
						//class:'customMessagePanel',
						margin:10
					},
					{xtype:'spacer'},
					{
						xtype:'panel',
						id:'buttonPanel',
						layout:'hbox',
						items:[
							{xtype:'spacer'},
							{
								xtype:'button',
								ui:'confirm',
								id:'confirmButton',
								text:'YES'								
							},
							{xtype:'spacer'},
							{
								xtype:'button',
								ui:'decline',
								id:'declineButton',
								text:'NO'							
							},
							{xtype:'spacer'}
						]
						
					}
					
				]
				
			}


	
						




		]);
		
		this.callParent(arguments);
    }
	
});

caseclose.JPG

[mitchellsimoens]

There are missing variables there so I cannot run that test case.

Also, I wrapped your code in BBCode code tags.

[SButts]

I am experiencing the same issue. This does not happen when viewing the app in a browser, only once it is made into an app using PhoneGap.