Thank you again for your input and sorry for the slow responses. Been
unexpectedly busy with more urgent problems in my project.
Beforehand: If it's still not clear what I'm trying to achieve after this
message, I'll happily provide the requested quickstart, though from your
responses and my own digging I already get the feeling, that it might just not
be possible ...
While the idea of Martin Terra with using a generic panel is good, the example
that I've given with the h1 in the section is sadly just a simple one to show
the general problem.
There are many many use cases with aria-* accessibillity attributes where you
have to add the id of one element to an attribute of another element.
aria-labelledby, aria-owns, aria-controls, aria-describedby, ... just to name a
few. With many of those you don't always have the convinient case that these
elements encase eachother as they do in my example. They could be encased the
other way around or not all and both just be direct children of another parent
element. They might not even be in close proxymity, as an element right at the
beginning of a panel could reference an element which is at the very end of
that panel.
So yes, I might be able to write some JS code for this very particular simple
example but as soon as the structure changes or in general I have panels with
different structures, the JS code would fail or I would at least have to write
different JS code for each case. That's why I'd like to do it on the server
side where it's reasonable to assume to have unique Wicket IDs in a panel.html
file which then get turned into unique html IDs when wicket assembles the full
page.
Maybe I failed to make clear that of course I am well aware of how to do this
the "hard" way with some boiler plate could. I know I could very well have this
bit of html:
<section wicket:id="section">
<h1 wicket:id="sectionheader">Lorem ipsum</h1>
</section>
and wire everything together with this bit of code:
WebMarkupContainer section = new WebMarkupContainer("section");
add(section);
WebMarkupContainer sectionheader = new WebMarkupContainer("sectionheader");
sectionheader.setOutputMarkupId(true);
section.add(sectionheader);
section.add(AttributeModifier.replace("aria-labelledby",
sectionheader::getMarkupId));
which would produce something like this with unique IDs
<section aria-labelledby="section1">
<h1 id="sectionheader1">Lorem ipsum</h1>
</section>
But I wanted to avoid that. Adding these elements to the Java side has no real
benefits in my eyes.
If I write this in html
<section aria-labelledby="sectionheader">
<h1 id="sectionheader">Lorem ipsum</h1>
</section>
it's already clear from the html side that the developer wants to wire these
components togehter just by having the attributes on the corresponding tags.
Adding any (boiler plate-)code on the Java side increases the complexitiy,
feels redundant and in the worst case even causes trouble. So the idea was that
maybe there is a way to write whatever "global" behaviour/listener/filter etc.
to recognise matching pairs id- and aria-*-attributes in a Wicket panel and
then generate and insert unique IDs into these places within a panel.
I will check out AutoLabelTagHandler and AutoLabelTagResolver again as Martijn
suggested.
With that said, if it turns out, that it's not possible, I will just have to do
it the "old fashioned" way by adding everything on the Java side as well. I
just wanted to know ahead of that if somebody has solved this problem in a more
elegant way before and I would maybe not have to reinvent the wheel.
Thank you for your time and kind regards
Daniel Radünz
Gesendet: Sonntag, 03. Juli 2022 um 22:36 Uhr
Von: "Martin Grigorov" <[email protected]>
An: [email protected]
Betreff: Re: Re: Automatically insert generated html IDs in other places in
html file
On Sat, Jul 2, 2022, 15:18 Martijn Dashorst <[email protected]>
wrote:
> I think Daniel suggest that Wicket doesn't make /all/ id's unique, only
> those that are owned by it by having a component attached to it. And even
> then, when you explicitly setMarkupId() you are yourself responsible for
> ensuring it is unique.
>
> BarPanel.html:
> <wicket:panel>
> <h1 id="bar"></h1>
>
1. Don't set the ID in HTML
2. Use panel.setOutputMarkupId(true)
Voila!
</wicket:panel>
>
> BarPage.html:
> <div wicket:id="panel1"></div>
> <div wicket:id="panel2"></div>
>
> BarPagel.java:
> add(new BarPanel("panel1"));
> add(new BarPanel("panel2"));
>
> This would result in two h1 tags with the same HTML id. Wicket doesn't
> modify the id magically.
>
> Wicket (from what i know) doesn't support Daniel's usecase out of the box,
> but Wicket does have the ability to act on tags if you make such affordance
> yourself.
>
> I suppose
>
> <div wicket:aria-label="sect1">
> <section wicket:aria-id="sect1">
>
> Could be similarly implemented as the wicket:for attribute.
> See AutoLabelTagHandler and AutoLabelTagResolver for more information.
>
> Martijn
>
> --
> Become a Wicket expert, learn from the best: http://wicketinaction.com
>
---------------------------------------------------------------------
To unsubscribe, e-mail: [email protected]
For additional commands, e-mail: [email protected]
