You are viewing a plain text version of this content. The canonical link for it is here.
Posted to users@wicket.apache.org by Thorsten Schöning <ts...@am-soft.de> on 2016/05/14 06:17:54 UTC

Generating table header ids for multiple tables pe rpage

Hi all,

I have a page where one and the same table (in terms of markup) is
rendered multiple times with different data at the same time, simply
underneath each other. The markup uses "id" and "headers" attributes,
but with static values in the markup and with multiple instances of
the table this is wrong of course, because ids need to be unique
across a whole page, not only across a single table.

In terms of Wicket the tables itself are rendered using IDataView with
the table markup coming from a panel. The rows of the table are
rendered using IDataView as well and each cell is e.g. a simple Label
component.

With each cell being a Label, I could add an AttributeReplacer or sich
replacing the static "headers" from the markup with some generic
value. But I would like to avoid the need to think of this for every
table and a more generic approach. Additionally, the "thead" of the
table with the column headers and ids is no wicket component
currently, but I would need to make each column header one to be able
to change the "id" using an AttributeReplacer as well.

So is there some easy, somewhat clean way to change the markup of a
component instance before it is used for rendering and produce some
page unique ids in it?

Thanks!

Mit freundlichen Grüßen,

Thorsten Schöning

-- 
Thorsten Schöning       E-Mail: Thorsten.Schoening@AM-SoFT.de
AM-SoFT IT-Systeme      http://www.AM-SoFT.de/

Telefon...........05151-  9468- 55
Fax...............05151-  9468- 88
Mobil..............0178-8 9468- 04

AM-SoFT GmbH IT-Systeme, Brandenburger Str. 7c, 31789 Hameln
AG Hannover HRB 207 694 - Geschäftsführer: Andreas Muchow


---------------------------------------------------------------------
To unsubscribe, e-mail: users-unsubscribe@wicket.apache.org
For additional commands, e-mail: users-help@wicket.apache.org


Re: Generating table header ids for multiple tables pe rpage

Posted by Bas Gooren <ba...@iswd.nl>.
Hi Thorsten,

Yeah, wicket is beautiful haha! Whenever I encounter a tricky problem, I always find a nice and clean way to handle it with wicket.
One of the reasons it is my framework of choice.

Regarding the transformer behavior: yeah, that is probably a good fit for you.

On another note: why not simply use a data table and manage everything in java code?

Met vriendelijke groet,
Kind regards,

Bas Gooren

Op 15 mei 2016 bij 20:01:15, Thorsten Schöning (tschoening@am-soft.de) schreef:

Guten Tag Thorsten Schöning,  
am Sonntag, 15. Mai 2016 um 11:14 schrieben Sie:  

> So next I will have a look at extending  
> AbstractTransformerBehavior with its "tranform" method.  

Hi,  

this was far easier to use, beautiful Wicket... Sadly I saw it too  
late and wasted quite some hours on the former approach. :-)  

Mit freundlichen Grüßen,  

Thorsten Schöning  

--  
Thorsten Schöning E-Mail: Thorsten.Schoening@AM-SoFT.de  
AM-SoFT IT-Systeme http://www.AM-SoFT.de/  

Telefon...........05151- 9468- 55  
Fax...............05151- 9468- 88  
Mobil..............0178-8 9468- 04  

AM-SoFT GmbH IT-Systeme, Brandenburger Str. 7c, 31789 Hameln  
AG Hannover HRB 207 694 - Geschäftsführer: Andreas Muchow  


---------------------------------------------------------------------  
To unsubscribe, e-mail: users-unsubscribe@wicket.apache.org  
For additional commands, e-mail: users-help@wicket.apache.org  


Re: Generating table header ids for multiple tables pe rpage

Posted by Thorsten Schöning <ts...@am-soft.de>.
Guten Tag Thorsten Schöning,
am Sonntag, 15. Mai 2016 um 11:14 schrieben Sie:

> So next I will have a look at extending
> AbstractTransformerBehavior with its "tranform" method.

Hi,

this was far easier to use, beautiful Wicket... Sadly I saw it too
late and wasted quite some hours on the former approach. :-)

Mit freundlichen Grüßen,

Thorsten Schöning

-- 
Thorsten Schöning       E-Mail: Thorsten.Schoening@AM-SoFT.de
AM-SoFT IT-Systeme      http://www.AM-SoFT.de/

Telefon...........05151-  9468- 55
Fax...............05151-  9468- 88
Mobil..............0178-8 9468- 04

AM-SoFT GmbH IT-Systeme, Brandenburger Str. 7c, 31789 Hameln
AG Hannover HRB 207 694 - Geschäftsführer: Andreas Muchow


---------------------------------------------------------------------
To unsubscribe, e-mail: users-unsubscribe@wicket.apache.org
For additional commands, e-mail: users-help@wicket.apache.org


Re: Generating table header ids for multiple tables pe rpage

Posted by Thorsten Schöning <ts...@am-soft.de>.
Guten Tag Thorsten Schöning,
am Samstag, 14. Mai 2016 um 19:26 schrieben Sie:

> [...]instead I would like to have one
> place, e.g. "resultsContainer" itself, to process the markup in such a
> way that this parent container of all markup generates unique ids,
> changes the "headers" references to those ids and afterwards Wicket
> proceeds with markup processing fully transparent.

Hi,

I seem to have a working PoC overriding Component.getMarkup, by
converting the given markup of the super class to a string, replacing
some parts of it and creating a new IMarkupFragment instance. The most
tricky part of this is that one really needs to create a
MarkupFragment instance, not Markup, even though both implement the
same interface:

> Markup          newMarkup       = Markup.of(stringifiedNew);
> IMarkupFragment retVal          = new MarkupFragment(newMarkup, 0);

While this seems to work, it's not as elegant as I hoped because one
needs to override getMarkup. So next I will have a look at extending
AbstractTransformerBehavior with its "tranform" method. It reads as
well like what I would like to have, only after all processing by
Wicket has happends. Shouldn't make any difference for me, though.

https://ci.apache.org/projects/wicket/apidocs/7.x/org/apache/wicket/markup/transformer/AbstractTransformerBehavior.html#transform(org.apache.wicket.Component,%20java.lang.CharSequence)

Mit freundlichen Grüßen,

Thorsten Schöning

-- 
Thorsten Schöning       E-Mail: Thorsten.Schoening@AM-SoFT.de
AM-SoFT IT-Systeme      http://www.AM-SoFT.de/

Telefon...........05151-  9468- 55
Fax...............05151-  9468- 88
Mobil..............0178-8 9468- 04

AM-SoFT GmbH IT-Systeme, Brandenburger Str. 7c, 31789 Hameln
AG Hannover HRB 207 694 - Geschäftsführer: Andreas Muchow


---------------------------------------------------------------------
To unsubscribe, e-mail: users-unsubscribe@wicket.apache.org
For additional commands, e-mail: users-help@wicket.apache.org


Re: Generating table header ids for multiple tables pe rpage

Posted by Thorsten Schöning <ts...@am-soft.de>.
Guten Tag Bas Gooren,
am Samstag, 14. Mai 2016 um 11:45 schrieben Sie:

> Can you show us some code (html and java) - perhaps as a github
> gist or similar? It’s not 100% clear to me what you are asking.

Find my table at the bottom, it is coming from one panel and contains
different Wicket components. The "id" I'm talking about is the
attribute of the "th" tags, which needs to be unique across a page and
the ids need to be referenced in the body by the "td" tags using the
"headers" attributes. Currently the ids are generic and multiple
instances of the table on a single page would violate their
uniqueness.

As you can see, there's no component involved in "thead", but all the
cells of "tbody" are one. And I wouldn't want to span the "unique ids"
logic across multiple components, instead I would like to have one
place, e.g. "resultsContainer" itself, to process the markup in such a
way that this parent container of all markup generates unique ids,
changes the "headers" references to those ids and afterwards Wicket
proceeds with markup processing fully transparent.

                <wicket:panel>
                        <table  class="results.details.meters ui-expandable ui-expandable-collapsed"
                                        wicket:id="resultsContainer">
                                <caption>
                                        <a      href="#"
                                                title="Show details of all ... meters."
                                                wicket:message="title:caption.show.title">
                                                <wicket:message key="caption.show.msg">
                                                        Details of all ... meters.
                                                </wicket:message></a>

                                        <a      href="#"
                                                title="This link provides a readings file with only the ... meters."
                                                wicket:id="caption.download"
                                                wicket:message="title:caption.download.title">
                                                <wicket:message key="caption.download.msg">
                                                        Download
                                                </wicket:message></a>
                                </caption>

                                <colgroup>
                                        <col />
                                        <col />
                                        <col />
                                        <col />
                                </colgroup>

                                <thead>
                                        <tr>
                                                <th id="results.details.realEstate">
                                                        <wicket:message key="head.realEstate">
                                                                Real estate
                                                        </wicket:message>
                                                </th>
                                                <th     id="results.details.prodCode"
                                                        class="sorter-text">
                                                        <wicket:message key="head.prodCode">
                                                                Prod code
                                                        </wicket:message>
                                                </th>
                                                <th     id="results.details.readingSerial"
                                                        class="sorter-text">
                                                        <wicket:message key="head.readingSerial">
                                                                Reading serial
                                                        </wicket:message>
                                                </th>
                                                <th     id="results.details.type"
                                                        class="sorter-text">
                                                        <wicket:message key="head.type">
                                                                Type
                                                        </wicket:message>
                                                </th>
                                        </tr>
                                </thead>

                                <tfoot wicket:id="resultsPager">
                                        <tr>
                                                <td     colspan="4"
                                                        class="tableSorterPager">
                                                        <button type="button"
                                                                        class="first">
                                                                &lt;&lt;
                                                        </button>
                                                        <button type="button"
                                                                        class="prev">
                                                                &lt;
                                                        </button>
                                                        <span class="pageDisplay"></span>
                                                        <button type="button"
                                                                        class="next">
                                                                &gt;
                                                        </button>
                                                        <button type="button"
                                                                        class="last">
                                                                &gt;&gt;
                                                        </button>
                                                        <select class="pageSize"
                                                                        title="Select a page size..."
                                                                        wicket:message="title:foot.pageSize.title">
                                                                <option value="25"
                                                                                selected="selected">
                                                                        25
                                                                </option>
                                                                <option value="50">
                                                                        50
                                                                </option>
                                                                <option value="75">
                                                                        75
                                                                </option>
                                                                <option value="100">
                                                                        100
                                                                </option>
                                                        </select>
                                                        <select class="gotoPage"
                                                                        title="Select a page number..."
                                                                        wicket:message="title:foot.pageNumber.title">
                                                                <option value="1"
                                                                                selected="selected">
                                                                        1
                                                                </option>
                                                        </select>
                                                </td>
                                        </tr>
                                </tfoot>

                                <tbody>
                                        <tr     class="noResults"
                                                wicket:id="noResults">
                                                <td colspan="3">
                                                        <wicket:message key="body.noResults">
                                                                No results found!
                                                        </wicket:message>
                                                </td>
                                        </tr>

                                        <tr wicket:id="resultsRow">
                                                <td     headers="results.details.realEstate"
                                                        wicket:id="realEstate">
                                                        Real estate 1
                                                </td>
                                                <td     headers="results.details.prodCode"
                                                        wicket:id="prodCode">
                                                        MEH
                                                </td>
                                                <td     headers="results.details.readingSerial"
                                                        wicket:id="readingSerial">
                                                        12345678
                                                </td>
                                                <td     headers="results.details.type"
                                                        wicket:id="type">
                                                        Heat
                                                </td>
                                        </tr>
                                </tbody>
                        </table>
                </wicket:panel>

Mit freundlichen Grüßen,

Thorsten Schöning

-- 
Thorsten Schöning       E-Mail: Thorsten.Schoening@AM-SoFT.de
AM-SoFT IT-Systeme      http://www.AM-SoFT.de/

Telefon...........05151-  9468- 55
Fax...............05151-  9468- 88
Mobil..............0178-8 9468- 04

AM-SoFT GmbH IT-Systeme, Brandenburger Str. 7c, 31789 Hameln
AG Hannover HRB 207 694 - Geschäftsführer: Andreas Muchow


---------------------------------------------------------------------
To unsubscribe, e-mail: users-unsubscribe@wicket.apache.org
For additional commands, e-mail: users-help@wicket.apache.org


Re: Generating table header ids for multiple tables pe rpage

Posted by Bas Gooren <ba...@iswd.nl>.
Hi Thorsten,

Can you show us some code (html and java) - perhaps as a github gist or similar? It’s not 100% clear to me what you are asking.

For page-unique ids, simply let wicket render the components and call setOutputMarkupId(true).
If you want to control the ids yourself, cal setMarkupId(String id).

Regarding the “headers” attribute: simply override onComponentTag in your table component, and change the headers attribute as you want; This way you don’t have to add an AttributeModifier, and don’t have to think of it.

Met vriendelijke groet,
Kind regards,

Bas Gooren

Op 14 mei 2016 bij 08:18:07, Thorsten Schöning (tschoening@am-soft.de) schreef:

Hi all,  

I have a page where one and the same table (in terms of markup) is  
rendered multiple times with different data at the same time, simply  
underneath each other. The markup uses "id" and "headers" attributes,  
but with static values in the markup and with multiple instances of  
the table this is wrong of course, because ids need to be unique  
across a whole page, not only across a single table.  

In terms of Wicket the tables itself are rendered using IDataView with
the table markup coming from a panel. The rows of the table are  
rendered using IDataView as well and each cell is e.g. a simple Label  
component.  

With each cell being a Label, I could add an AttributeReplacer or sich  
replacing the static "headers" from the markup with some generic  
value. But I would like to avoid the need to think of this for every  
table and a more generic approach. Additionally, the "thead" of the  
table with the column headers and ids is no wicket component  
currently, but I would need to make each column header one to be able  
to change the "id" using an AttributeReplacer as well.  

So is there some easy, somewhat clean way to change the markup of a
component instance before it is used for rendering and produce some  
page unique ids in it?  

Thanks!  

Mit freundlichen Grüßen,  

Thorsten Schöning  

--  
Thorsten Schöning E-Mail: Thorsten.Schoening@AM-SoFT.de  
AM-SoFT IT-Systeme http://www.AM-SoFT.de/  

Telefon...........05151- 9468- 55  
Fax...............05151- 9468- 88  
Mobil..............0178-8 9468- 04  

AM-SoFT GmbH IT-Systeme, Brandenburger Str. 7c, 31789 Hameln  
AG Hannover HRB 207 694 - Geschäftsführer: Andreas Muchow  


---------------------------------------------------------------------  
To unsubscribe, e-mail: users-unsubscribe@wicket.apache.org  
For additional commands, e-mail: users-help@wicket.apache.org