PDA

View Full Version : Ext.menu.Adapter



knt
30 Oct 2009, 10:01 AM
Hi,

I need to add a grid to a menu. I can't open document for 'Ext.menu.Adapter'. Please help me find the right link to it.

Thanks,
knt

Animal
30 Oct 2009, 10:38 AM
You don't need it. It's removed in Ext 3. Menu is a Container. It can contain Components.

knt
30 Oct 2009, 10:42 AM
You're right. I should read the doc before asking. Thanks.

knt
2 Nov 2009, 10:49 AM
Hi Again,

I'm not able to see my grid after I add to menu item. I try adding other component like button/panel and it is okay. I put some log messages and I can see them but my grid doesn't render at all. I even try to load the ext grid sample (not my grid version) but it is not displayed too. What could be wrong here? The problem is I'm not getting any error so I have no clue.

Thanks

Animal
2 Nov 2009, 11:01 AM
Show some code. Or create a little testcase with a 1 row, 1 column grid in a menu which we can look at.

knt
2 Nov 2009, 11:22 AM
Here it is. I can see the panel but no grid inside.

var myData = [
['3m Co',71.72,0.02,0.03,'9/1 12:00am']
]

// create the data store
var store = new Ext.data.ArrayStore({
fields: [
{name: 'company'}
]
});

// manually load local data
store.loadData(myData);

// create the Grid
var testgrid = new Ext.grid.GridPanel({
store: store,
columns: [
{id:'company',header: 'Company', width: 160, sortable: true, dataIndex: 'company'}
],
height: 100,
width: 200,
title: 'Array Grid'
});


secObj._srmenu = new Ext.menu.Menu({
id:'srmenu',
items: [
new Ext.Panel({
width:300,
height:260,
items:[testgrid]
})]
});

secObj._srmenu.show(Ext.fly(obj), 'bl');

Animal
2 Nov 2009, 12:02 PM
Why wrap the GridPanel with another unsized, no layout Panel????

knt
2 Nov 2009, 2:08 PM
Sorry I remove the panel as part of my testing so it will have only the grid. I add layout:'fit' to the menu container still no grid.

secObj._srmenu = new Ext.menu.Menu({
id:'srmenu',
layout:'fit',
items: [
testgrid
]
});

knt
3 Nov 2009, 11:00 AM
I finally figure it out it's not the menu problem. The menu and grid are created but they're hidden. It has to do with the way I show the menu. Thanks.

Animal
3 Nov 2009, 11:53 AM
This works for me:



var myData = [
['3m Co',71.72,0.02,0.03,'9/1 12:00am']
]

// create the data store
var store = new Ext.data.ArrayStore({
fields: [
{name: 'company'}
]
});

// manually load local data
store.loadData(myData);

// create the Grid
var testgrid = new Ext.grid.GridPanel({
store: store,
columns: [
{id:'company',header: 'Company', width: 160, sortable: true, dataIndex: 'company'}
],
height: 100,
width: 200,
title: 'Array Grid'
});


var myMenu = new Ext.menu.Menu({
id: 'srmenu',
items: testgrid
});

myMenu.showAt([0,0]);


http://i131.photobucket.com/albums/p286/TimeTrialAnimal/menuingridworks.jpg

knt
3 Nov 2009, 5:35 PM
Thanks Animal. It works for me now. But when I test with IE (it works fine with FF), I get exception in ext-all-debug.js.

Line:50601
Error:Object doesn't support this property or method.

showAt : function(xy, parentMenu, /* private: */_e){
this.parentMenu = parentMenu;
if(!this.el){
this.render();
}
this.el.setXY(xy);
if(this.enableScrolling){
this.constrainScroll(xy[1]);
}
this.el.show();
Ext.menu.Menu.superclass.onShow.call(this);
if(Ext.isIE){
Exception here ===> this.layout.doAutoSize();
if(!Ext.isIE8){
this.el.repaint();
}
}
this.hidden = false;
this.focus();
this.fireEvent("show", this);
},

If I remove menu layout:'fit' configuration, then it works fine for IE. However, FF doesn't show the vertical scroll-bar so I can't see the last few rows. The next time you click on the menu, the vertical scroll-bar is displayed ok. Any suggestion? Thanks.

Animal
4 Nov 2009, 12:26 AM
Format your code with
... tags so we can read what you post. See how the code below is readable?

But OK, that looks like it could be an Ext bug.

What if you configure that menu with



bufferResize: false


?

knt
4 Nov 2009, 11:46 AM
I still see the same problem after adding that configuration. I will play with the code a bit more and let you know. Thanks.

knt
5 Nov 2009, 5:18 PM
Hi Animal, I see the same problem below. Is it okay to use layout:'fit' for the menu container? Now I run into another problem. I can't select the column header option to enable and disable certain rows. As soon as I click on it, the menu is closed. Is menu within another menu okay? Am I missing something here? Thank you.



Ext.onReady(function() {
var myData = [
['3m Co',71.72,0.02,0.03,'9/1 12:00am'],
['Alcoa Inc',29.01,0.42,1.47,'9/1 12:00am'],
['Altria Group Inc',83.81,0.28,0.34,'9/1 12:00am'],
['American Express Company',52.55,0.01,0.02,'9/1 12:00am'],
['American International Group, Inc.',64.13,0.31,0.49,'9/1 12:00am'],
['AT&T Inc.',31.61,-0.48,-1.54,'9/1 12:00am'],
['Boeing Co.',75.43,0.53,0.71,'9/1 12:00am'],
['Caterpillar Inc.',67.27,0.92,1.39,'9/1 12:00am'],
['Citigroup, Inc.',49.37,0.02,0.04,'9/1 12:00am'],
['E.I. du Pont de Nemours and Company',40.48,0.51,1.28,'9/1 12:00am'],
['Exxon Mobil Corp',68.1,-0.43,-0.64,'9/1 12:00am'],
['General Electric Company',34.14,-0.08,-0.23,'9/1 12:00am'],
['General Motors Corporation',30.27,1.09,3.74,'9/1 12:00am']
]

// create the data store
var store = new Ext.data.ArrayStore({
fields: [
{name: 'company'}
]
});

// manually load local data
store.loadData(myData);

// create the Grid
var testgrid = new Ext.grid.GridPanel({
store: store,
columns: [
{id:'company',header: 'Company', width: 160, sortable: true, dataIndex: 'company'}
],
height: 100,
width: 200,
title: 'Array Grid'
});


var myMenu = new Ext.menu.Menu({
id: 'srmenu',
layout:'fit',
items: testgrid
});

myMenu.showAt([0,0]);
});

knt
10 Nov 2009, 10:39 AM
Any suggestion here are welcome. Thanks.

Animal
10 Nov 2009, 11:12 AM
It's the WindowMgr which handles mousedowns to see if it should hideAll managed menus. Examine that.