PDA

View Full Version : Reload Google Map (gmappanel)



willbelair
3 Mar 2010, 9:54 PM
hello,
I hope that this question was asked before,and someone have seen that, please point me to that (I have been searching for many days), if not, please give me some help.
What I am trying to do is to load google map in a tab panel, which responses to a click event in another grid
This is my grid:


PresidentsColumnModel = new Ext.grid.ColumnModel(
[{
header: 'clientid',
readOnly: true,
dataIndex: 'id',
width: 30,
hidden: false,
renderer : function(val) {
return '<a href="javascript:loaddetail(' + "'" + val + "'" +')">View</a>';}

},{
....


when user click on the "clientid" on any record in the grid, the function loaddetail(clientid) is called. This funtion is outside the "Ext.onReady(function() "



function loaddetail(clientid){
// search for client address using clientid
mynamespace.showgmap(clientaddress);
...
}


Once the client address found, the function mygmap() will be called, and that function is inside the "Ext.ready..."



var mapwin;
Ext.ns('mynamespace');
mynamespace.showgmap = function (clientaddress){
if(!mapwin){

mapwin = new Ext.Panel({
layout: 'fit',
title: 'GMap Window',
closeAction: 'hide',
width:400,
height:400,
x: 40,
y: 60,
items: {
xtype: 'gmappanel',
zoomLevel: 14,
gmapType: 'map',
mapConfOpts: ['enableScrollWheelZoom','enableDoubleClickZoom','enableDragging'],
mapControls: ['GSmallMapControl','GMapTypeControl','NonExistantControl'],
setCenter: {
geoCodeAddr: clientaddress,
marker: {title: clientaddress}
}
}
});

}

mapwin.render('mygmap');

}


and here is the tab


var tabs = new Ext.TabPanel({
id: 'mytab',
renderTo:'clientdetail',
activeTab: 0,
width:680,
height:250,
plain:true,
defaults:{autoScroll: true},
items:[{
title: 'client detail',
contentEl:'showdetails'
}{
title: 'Map',
contentEl:'mygmap'
}
]
});


this is the div tag in html


<div id="mygmap" class="x-hide-display"></div>


what happened was, if I have the same div as above, when I clicked on the grid's clientid, there is panel inside the tab, but nothing displayed. If I took out the "class="x-hide-display"", then there would be a google map window pop up at the bottom of the page, and when I click on the map tab, the window would disappear, and inside the tab was the right map. But when clicking on another clientid, the map did not reload.

Please help.

Thank you.

willbelair
4 Mar 2010, 5:46 AM
somebody , please help.

Animal
4 Mar 2010, 5:54 AM
DON'T render. As the API doc for "render" clearly tells you!