Hi all,
When i click on panel_2, title and dataItems should get updated.
My viewport looks like..
Basically content of items field is form, so i want to reflect defferent forms according to click.
my listener looks like...
I checked in debuger, variable panelHeader and dataItems is updated on click but it is not getting reflected in panel.
Please help...
Update items of extjs Panel.
I have three Extjs panels(panel_1, panel_2, panel_3) and i used viewport to view in my app. I need to do when i click on button or graph in panel_2 then cintent of panel_3 should update automatically like items of panel, title of panel etc.
My sample code looks like...
Code:
var panelHeader = '';
var dataItems = '';
var panel_1 = new Ext.TabPanel({
id : 'panel_1',
region : 'center',
activeTab : 0,
items : [ panelItems ]
});
var panel_2 = new Ext.Panel({
id : 'panel_2',
layout : 'fit',
split : true,
height : 100,
region : 'south'
});
var panel_3 = new Ext.Panel({
title: panelHeader,
id : 'panel_3',
collapsible : true,
width : 280,
layout: {
type : 'form',
},
region : 'east',
autoScroll : true,
items: [ dataItems ]
});
When i click on panel_2, title and dataItems should get updated.
My viewport looks like..
Code:
var viewport = new Ext.Viewport({
layout : 'border',
items : [ {
xtype : 'panel',
margins : '5 5 5 5',
region : 'center',
layout : 'border',
border : false,
items : [ new Ext.Panel({
region : 'west',
layout : 'border',
split : true,
width : 180,
border : false,
items : [ panel_1]
}), panel_2, panel_3 ]
}]
});
Basically content of items field is form, so i want to reflect defferent forms according to click.
my listener looks like...
Code:
graph.getSelectionModel().addListener(mxEvent.CHANGE, function(sender, evt)
{
var e = evt.getProperty('event'); // mouse event
var cell = evt.getProperty('cell'); // cell may be null
//if (cell != null && !e.isConsumed())
{
if(graph.getSelectionCell() != null && graph.getSelectionCount() == 1)
{
var selectedCell = graph.getSelectionCell();
if(selectedCell.value.nodeName === 'step_1')
{
panelHeader = 'step_1';
dataItems = {
xtype: 'fieldset',
items: [
{
xtype: 'radiogroup',
fieldLabel: 'Select a method for step_1',
labelStyle: 'font-weight:bold;',
columns: 1,
vertical: true,
items: [{
boxLabel: 'button_1',
name: 'rb',
inputValue: '1'
}, {
boxLabel: 'button_2',
name: 'rb',
inputValue: '2',
checked: true
}]
},
{
xtype: 'textfield',
name : 'name',
fieldLabel: 'Your name',
labelStyle: 'font-weight:bold;'
},
{
xtype: 'button',
buttonAlign: 'center',
text: 'Save',
handler: function() {
}
}
]
};
}
else if(selectedCell.value.nodeName === 'step_2')
{
panelHeader = 'step_2';
dataItems = {
xtype: 'fieldset',
items: [
{
xtype: 'radiogroup',
fieldLabel: 'Select method for step_2,
labelStyle: 'font-weight:bold;',
columns: 1,
vertical: true,
items: [{
boxLabel: 'method_1',
name: 'rb',
inputValue: '1'
}, {
boxLabel: 'method_2',
name: 'rb',
inputValue: '2',
checked: true
}]
},
{
xtype: 'textfield',
name : 'name',
fieldLabel: 'Specify e-value',
labelStyle: 'font-weight:bold;'
},
{
xtype: 'button',
buttonAlign: 'center',
text: 'Save',
handler: function() {
}
}
]
};
}
}
var updpanl = pane_3l.items.first();
panel_3.items.remove(updpanl);
pane_3l.items.add(dataItems);
panel_3.items.doLayout();
/*propertyPanel.items.update(dataItems);
propertyPanel.doLayout();*/
evt.consume();
}
});
I checked in debuger, variable panelHeader and dataItems is updated on click but it is not getting reflected in panel.
Please help...
Thaks in advance
Update items of extjs Panel.
Aucun commentaire:
Enregistrer un commentaire