[Users] How to add a pointer to a popup?

John Buonagurio jbuonagurio at exponent.com
Tue Apr 12 15:57:00 CEST 2011


Rob,

GeoExt.Popup is just an implementation of Ext.Window with a custom CSS class and some code to handle positioning, source code is here: http://trac.geoext.org/browser/core/trunk/geoext/lib/GeoExt/widgets/Popup.js

108	    /** api: config[popupCls]
109	     *  ``String`` CSS class name for the popup DOM elements.  Default is
110	     *  "gx-popup".
111	     */
112	    popupCls: "gx-popup",

In the popup.css though this seems to be called "gx-popup-anc" so there might be a mismatch: http://trac.geoext.org/browser/core/trunk/geoext/resources/css/popup.css

Perhaps you just need to change the name of this class. I'd just inline it in your html for readability.

For customizing the attributes shown by the propertyGrid, you'll probably need to do that by adding propertyRecords dynamically (according to your criteria) on the featureselected event:

layer.events.on({'featureselected': function(e) {
	if (!e.feature.cluster) {
		var attributes = e.feature.attributes;
		var propsGrid = Ext.getCmp('propsGrid');
		propsGrid.setSource({});
 		for (var key in attributes) {
			propGrid.store.add(new Ext.grid.PropertyRecord({ name: key, value: attributes[key] }));
		}
	}
}});

Also, if the PropertyGrid won't be editable (most likely if you're not doing any WFS-T transactions) I would cancel the beforeedit event by adding this to the PropertyGrid definition:

listeners: { 'beforeedit': function() {
	return false;
}}

Hope this helps.

John Buonagurio
Exponent Inc.

From: users-bounces at geoext.org [mailto:users-bounces at geoext.org] On Behalf Of Robert Buckley
Sent: Tuesday, April 12, 2011 5:49 AM
To: users at geoext.org
Subject: [Users] How to add a pointer to a popup?

Hi,

I am using a propertygrid to display the attributes of a vector layer.

I would like to be able to do two things....

1. Add a little pointer to the bottom of the grid so that one sees clearly which element is selected. (I am refering to this example (http://dev.geoext.org/trunk/geoext/examples/popup.html)
2. Be able to filter (regulate) which attributes are being shown by the propertygrid.

Thanks for any help,

Rob

My code for the popup is here: It is triggered by clicking on the layer "layer_wea"


layer_wea.events.on({
 featureselected: function (event) {
 
  var propsGrid = new Ext.grid.PropertyGrid({
   autoHeight: true,
   source: event.feature.attributes
  });

  // rename the columns in the property grid
  propsGrid.getColumnModel().setColumnHeader(0, 'EIGENSCHAFT');
  propsGrid.getColumnModel().setColumnHeader(1, 'WERT');
 
  popup_wea = new GeoExt.Popup({
   id: 'popup_wea',
   title: "Informationen",
   feature: event.feature,
   collapsible: true,
   layout: "fit",
   autoHeight: true,
   panIn: true,
   width: 270,
   unpinnable: true,
   border: false,
   items: [propsGrid]
  });

  popup_wea.show();
 },
 featureunselected: function (event) {
  popup_wea.destroy();
 }
});



More information about the Users mailing list