On Fri, Jul 8, 2022 at 7:55 PM Daniel Radünz <ihmehlm...@gmx.de> wrote:

> 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>
>

How about of using custom attribute instead of id here, e.g.: <h1
wicket:id="..." *myid*="sectionheader">Lorem ipsum</h1>
Then again with JavaScript you can lookup all HTML elements with such
attributes and update their siblings if they have aria-xyz="same_value".
The only well-defined logic that you need here is how far to look for
siblings/parents.


>
> 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" <mgrigo...@apache.org>
> An: users@wicket.apache.org
> Betreff: Re: Re: Automatically insert generated html IDs in other places
> in html file
> On Sat, Jul 2, 2022, 15:18 Martijn Dashorst <martijn.dasho...@gmail.com>
> 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: users-unsubscr...@wicket.apache.org
> For additional commands, e-mail: users-h...@wicket.apache.org
>
>

Reply via email to