Table row visibility
Hi,
I have a table with legends explaining map (OpenLayers) layers.
I want to turn visibility on/off on the entire row based on the visibility of
these map layers using JS.
I can easily turn on/off the visibility of the legend image itself using
JavaScript/JQuery, but I want to toggle visibility of the entire row. I know
this can be done through ajax, but I don't want to put extra unnecessary load
on the server through Ajax calls.
The easiest way to do this (AFAIK) is adding an id to the table row, and
toggling visibility through JQuery:
$(#tableRowId).show()/hide();
Below is the entire code of my LegendPanel pasted.
Yours,
Tron Walseth
public class LegendPanelID extends Serializable extends MapPanelID
{
private static final long serialVersionUID = 1L;
/**
* @param id
*/
public LegendPanel(String id, ListBusinessLayer layers,
BusinessDataAjaxMapID map)
{
super(id, map);
ListDataProviderBusinessLayer dp = new ListDataProvider(layers);
DefaultDataTableBusinessLayer, String table = new
DefaultDataTable(legends, getTableColumns(), dp, 10);
add(table);
}
private static ListIColumnBusinessLayer, String getTableColumns()
{
ListIColumnBusinessLayer, String cols = new ArrayList();
cols.add(new HeaderlessColumnBusinessLayer, String() {
private static final long serialVersionUID = 1L;
@Override
public void populateItem(ItemICellPopulatorBusinessLayer
cellItem, String componentId, IModelBusinessLayer rowModel)
{
cellItem.add(new Label(componentId,
rowModel.getObject().getLegendDescription()));
}});
cols.add(new HeaderlessColumnBusinessLayer, String() {
private static final long serialVersionUID = 1L;
@Override
public void populateItem(ItemICellPopulatorBusinessLayer
cellItem, String componentId, IModelBusinessLayer rowModel)
{
Url imgUrl =
Url.parse(rowModel.getObject().getLayerLegend().trim());
ResourceReference ref = new UrlResourceReference(imgUrl);
ImagePanel i = new ImagePanel(componentId, ref);
i.setMarkupId(rowModel.getObject().getLegendDescription());
cellItem.add(i);
}
});
return cols;
}
/* (non-Javadoc)
* @see
org.apache.wicket.Component#renderHead(org.apache.wicket.markup.head.IHeaderResponse)
*/
@Override
public void renderHead(IHeaderResponse response)
{
super.renderHead(response);
response.render(JavaScriptHeaderItem.forScript(function
toggleLegend(event){\n\t +
var visible = event.object.visibility;\n +
\tvar divObject = '#' +
event.object.params.BUSINESSNAME;\n +
\tif (visible) \n +
\t\t$(divObject).show();\n +
\telse\n +
\t\t$(divObject).hide();\n +
}, layerlegend));
}
/* (non-Javadoc)
* @see
no.telespor.web.page.map.openlayers.MapPanel#updateComponents(org.apache.wicket.ajax.AjaxRequestTarget)
*/
@Override
public void updateComponents(AjaxRequestTarget target)
{
//empty on purpose
}
}
-
To unsubscribe, e-mail: users-unsubscr...@wicket.apache.org
For additional commands, e-mail: users-h...@wicket.apache.org
Re: Table row visibility
Hi,
What is your question ?
I guess how to get the markup id of the row?.
I'd suggest you to add a JS event listener on the table that filters for
clicks on 'tr' (i.e. event delegation).
On Mon, Nov 11, 2013 at 12:17 PM, Tron Walseth t...@telespor.no wrote:
Hi,
I have a table with legends explaining map (OpenLayers) layers.
I want to turn visibility on/off on the entire row based on the visibility
of these map layers using JS.
I can easily turn on/off the visibility of the legend image itself using
JavaScript/JQuery, but I want to toggle visibility of the entire row. I
know this can be done through ajax, but I don't want to put extra
unnecessary load on the server through Ajax calls.
The easiest way to do this (AFAIK) is adding an id to the table row, and
toggling visibility through JQuery:
$(#tableRowId).show()/hide();
Below is the entire code of my LegendPanel pasted.
Yours,
Tron Walseth
public class LegendPanelID extends Serializable extends MapPanelID
{
private static final long serialVersionUID = 1L;
/**
* @param id
*/
public LegendPanel(String id, ListBusinessLayer layers,
BusinessDataAjaxMapID map)
{
super(id, map);
ListDataProviderBusinessLayer dp = new
ListDataProvider(layers);
DefaultDataTableBusinessLayer, String table = new
DefaultDataTable(legends, getTableColumns(), dp, 10);
add(table);
}
private static ListIColumnBusinessLayer, String getTableColumns()
{
ListIColumnBusinessLayer, String cols = new ArrayList();
cols.add(new HeaderlessColumnBusinessLayer, String() {
private static final long serialVersionUID = 1L;
@Override
public void populateItem(ItemICellPopulatorBusinessLayer
cellItem, String componentId, IModelBusinessLayer rowModel)
{
cellItem.add(new Label(componentId,
rowModel.getObject().getLegendDescription()));
}});
cols.add(new HeaderlessColumnBusinessLayer, String() {
private static final long serialVersionUID = 1L;
@Override
public void populateItem(ItemICellPopulatorBusinessLayer
cellItem, String componentId, IModelBusinessLayer rowModel)
{
Url imgUrl =
Url.parse(rowModel.getObject().getLayerLegend().trim());
ResourceReference ref = new UrlResourceReference(imgUrl);
ImagePanel i = new ImagePanel(componentId, ref);
i.setMarkupId(rowModel.getObject().getLegendDescription());
cellItem.add(i);
}
});
return cols;
}
/* (non-Javadoc)
* @see
org.apache.wicket.Component#renderHead(org.apache.wicket.markup.head.IHeaderResponse)
*/
@Override
public void renderHead(IHeaderResponse response)
{
super.renderHead(response);
response.render(JavaScriptHeaderItem.forScript(function
toggleLegend(event){\n\t +
var visible = event.object.visibility;\n +
\tvar divObject = '#' +
event.object.params.BUSINESSNAME;\n +
\tif (visible) \n +
\t\t$(divObject).show();\n +
\telse\n +
\t\t$(divObject).hide();\n +
}, layerlegend));
}
/* (non-Javadoc)
* @see
no.telespor.web.page.map.openlayers.MapPanel#updateComponents(org.apache.wicket.ajax.AjaxRequestTarget)
*/
@Override
public void updateComponents(AjaxRequestTarget target)
{
//empty on purpose
}
}
-
To unsubscribe, e-mail: users-unsubscr...@wicket.apache.org
For additional commands, e-mail: users-h...@wicket.apache.org
SV: Table row visibility
Hi again
I wanted to turn on/off row visibility, and in doing that, I wanted to set row
id on the row.
I found out how this should be done, in overriding the newRowItem on the
DefaultDataTable class, and adding an AttributeModifier to the rowItem.
Sorry for any inconvenience.
Yours,
Tron Walseth
Fra: Martin Grigorov [mgrigo...@apache.org]
Sendt: 11. november 2013 11:28
Til: users@wicket.apache.org
Emne: Re: Table row visibility
Hi,
What is your question ?
I guess how to get the markup id of the row?.
I'd suggest you to add a JS event listener on the table that filters for
clicks on 'tr' (i.e. event delegation).
On Mon, Nov 11, 2013 at 12:17 PM, Tron Walseth t...@telespor.no wrote:
Hi,
I have a table with legends explaining map (OpenLayers) layers.
I want to turn visibility on/off on the entire row based on the visibility
of these map layers using JS.
I can easily turn on/off the visibility of the legend image itself using
JavaScript/JQuery, but I want to toggle visibility of the entire row. I
know this can be done through ajax, but I don't want to put extra
unnecessary load on the server through Ajax calls.
The easiest way to do this (AFAIK) is adding an id to the table row, and
toggling visibility through JQuery:
$(#tableRowId).show()/hide();
Below is the entire code of my LegendPanel pasted.
Yours,
Tron Walseth
public class LegendPanelID extends Serializable extends MapPanelID
{
private static final long serialVersionUID = 1L;
/**
* @param id
*/
public LegendPanel(String id, ListBusinessLayer layers,
BusinessDataAjaxMapID map)
{
super(id, map);
ListDataProviderBusinessLayer dp = new
ListDataProvider(layers);
DefaultDataTableBusinessLayer, String table = new
DefaultDataTable(legends, getTableColumns(), dp, 10);
add(table);
}
private static ListIColumnBusinessLayer, String getTableColumns()
{
ListIColumnBusinessLayer, String cols = new ArrayList();
cols.add(new HeaderlessColumnBusinessLayer, String() {
private static final long serialVersionUID = 1L;
@Override
public void populateItem(ItemICellPopulatorBusinessLayer
cellItem, String componentId, IModelBusinessLayer rowModel)
{
cellItem.add(new Label(componentId,
rowModel.getObject().getLegendDescription()));
}});
cols.add(new HeaderlessColumnBusinessLayer, String() {
private static final long serialVersionUID = 1L;
@Override
public void populateItem(ItemICellPopulatorBusinessLayer
cellItem, String componentId, IModelBusinessLayer rowModel)
{
Url imgUrl =
Url.parse(rowModel.getObject().getLayerLegend().trim());
ResourceReference ref = new UrlResourceReference(imgUrl);
ImagePanel i = new ImagePanel(componentId, ref);
i.setMarkupId(rowModel.getObject().getLegendDescription());
cellItem.add(i);
}
});
return cols;
}
/* (non-Javadoc)
* @see
org.apache.wicket.Component#renderHead(org.apache.wicket.markup.head.IHeaderResponse)
*/
@Override
public void renderHead(IHeaderResponse response)
{
super.renderHead(response);
response.render(JavaScriptHeaderItem.forScript(function
toggleLegend(event){\n\t +
var visible = event.object.visibility;\n +
\tvar divObject = '#' +
event.object.params.BUSINESSNAME;\n +
\tif (visible) \n +
\t\t$(divObject).show();\n +
\telse\n +
\t\t$(divObject).hide();\n +
}, layerlegend));
}
/* (non-Javadoc)
* @see
no.telespor.web.page.map.openlayers.MapPanel#updateComponents(org.apache.wicket.ajax.AjaxRequestTarget)
*/
@Override
public void updateComponents(AjaxRequestTarget target)
{
//empty on purpose
}
}
-
To unsubscribe, e-mail: users-unsubscr...@wicket.apache.org
For additional commands, e-mail: users-h...@wicket.apache.org
-
To unsubscribe, e-mail: users-unsubscr...@wicket.apache.org
For additional commands, e-mail: users-h...@wicket.apache.org
