PDA

View Full Version : [INFOREQ] fieldset going onto Toobar



ramannachekuri
6 Nov 2012, 6:22 AM
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
6 Nov 2012, 6:34 AM
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
6 Nov 2012, 8:58 AM
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);
}

});
39863

mitchellsimoens
6 Nov 2012, 9:16 AM
There are missing variables there so I cannot run that test case.

Also, I wrapped your code in BBCode code tags.

SButts
13 Dec 2012, 3:21 PM
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.