PDA

View Full Version : remove border



ing.amdangelo
14 Jun 2012, 12:16 AM
How remove the border of frame panel inside form panel :

var panelEvento = Ext.create('Ext.form.Panel', {
style: 'margin-top: 10px',
labelAlign: 'left',
items: [
{
xtype: 'panel',
layout:'column',
frame: true,
items: [
{
id: 'dataEvento',
name: 'data',
xtype: 'datefield',
cancelText: 'Annulla',
style: "margin-left: 5px;",
dayNames: arrGiorni,
nextText: 'Mese successivo (CTRL + destra)',
prevText: 'Mese precedente (CTRL + sinistra)',
showToday: false,
startDay: 1,
format: 'd/m/Y',
disabledDatesText: "Festivo",
disabledDates: ["25/12", "08/12", "01/01", "01/11"],
allowBlank: false,
editable: true,
blankTest: 'Selezionare una Data',
regex: /^[0-9]{2}\/[0-9]{2}\/[0-9]{4}$/,
regexText: 'Formato non valido, la data deve essere nel formato dd/MM/YYYY',
fieldLabel: 'Data'
}
]
}
]
});36228

sword-it
14 Jun 2012, 1:09 AM
Hi ing.amdangelo,

If you want remove border from panel, simply give style config into panel like



xtype: 'panel',
frame: true,
style: {
border : 0
}

ing.amdangelo
14 Jun 2012, 1:13 AM
The bord is very thin ma exist

scottmartin
14 Jun 2012, 10:18 AM
Can you use a container instead of a panel? A panel is rather heavy for holding fields in place.

Scott.

friend
14 Jun 2012, 11:03 AM
This gives the desired effect:



var panelEvento = Ext.create('Ext.form.Panel', {
style: {
marginTop: '10px',
border: '0px'
},
frame: true,
labelAlign: 'left',
items: [{
xtype: 'container',
frame: true,
layout:'column',
items: [{
id: 'dataEvento',
name: 'data',
xtype: 'datefield',
cancelText: 'Annulla',
style: "margin-left: 5px;",
nextText: 'Mese successivo (CTRL + destra)',
prevText: 'Mese precedente (CTRL + sinistra)',
showToday: false,
startDay: 1,
format: 'd/m/Y',
disabledDatesText: "Festivo",
disabledDates: ["25/12", "08/12", "01/01", "01/11"],
allowBlank: false,
editable: true,
blankTest: 'Selezionare una Data',
regex: /^[0-9]{2}\/[0-9]{2}\/[0-9]{4}$/,
regexText: 'Formato non valido, la data deve essere nel formato dd/MM/YYYY',
fieldLabel: 'Data'
}]
}]
});

var xx = Ext.create('Ext.window.Window', {
height: 200,
width: 500,
items: [panelEvento]
}).show();

ing.amdangelo
22 Jun 2012, 6:00 AM
I modify the cls class

.x-panel-default-framed
{
border: none !important;
}

I don't find other solution