You are viewing a plain text version of this content. The canonical link for it is here.
Posted to users@tapestry.apache.org by Denis McCarthy <dm...@annadaletech.com> on 2010/09/27 19:09:18 UTC
Dynamically setting tabindex for input elements in a component
Hi I have a pretty large component that needs to appear in one of two places
in a large form, depending on who's using the form. The dynamic placement I
can do pretty easily using delegates. However, I'm struggling with the
tabindex of the various input elements in the component. I want them to vary
(depending on where the component is actually rendered) so the user can
seamlessly tab through this large form, regardless of where this particular
component is rendered.
Now, a naive implementation would be to simply have a server side method per
tabindex, like
<t:select t:id="country" t:model="dummyModel" t:value="country"
t:label="message:COUNTRY" tabindex="${countryTabIndex}" />
This will work. However, I have 70+ input elements in this form, and adding
70+ getters like this hurts my brain. Is there some nicer way to do this? I
don't think having a single getter with side effects is going to work either
(like this:
getNextComponentTab() {
nextTab ++;
return Integer.parseInt(nextTab);
}
<t:select t:id="country" t:model="dummyModel" t:value="country"
t:label="message:COUNTRY" tabindex="${nextComponentTab}" />
Because the getter is called a couple of times during page render, so I'd
end up missing numbers in the tab index order - this itself doesn't break
the tabbing of course, but it causes an overlap with subsequent elements in
following components. If there was some way I could do the arithmetic in the
tag itself, e.g.
<t:select t:id="country" t:model="dummyModel" t:value="country"
t:label="message:COUNTRY" tabindex="${tabIndexStart + 1}" />
Then I'd settle for that, but that isn't possible I don't think.
Any ideas greatly appreciated.
Denis
Re: Dynamically setting tabindex for input elements in a component
Posted by Andreas Andreou <an...@di.uoa.gr>.
So, your component contains 70+ inputs and I guess it's included in pages
more than once... If you're happy with the default taborder within one render of
your component (and you don't need to manually tweak it), then just set the
taborder in all your inputs to be the same number.
And then, on the next render of the component, inc the taborder but
still use the
same in all inputs. That should work because elements that have identical
tabindex values are navigated in the order they appear in the html file.
On Mon, Sep 27, 2010 at 20:09, Denis McCarthy
<dm...@annadaletech.com> wrote:
> Hi I have a pretty large component that needs to appear in one of two places
> in a large form, depending on who's using the form. The dynamic placement I
> can do pretty easily using delegates. However, I'm struggling with the
> tabindex of the various input elements in the component. I want them to vary
> (depending on where the component is actually rendered) so the user can
> seamlessly tab through this large form, regardless of where this particular
> component is rendered.
>
> Now, a naive implementation would be to simply have a server side method per
> tabindex, like
> <t:select t:id="country" t:model="dummyModel" t:value="country"
> t:label="message:COUNTRY" tabindex="${countryTabIndex}" />
>
> This will work. However, I have 70+ input elements in this form, and adding
> 70+ getters like this hurts my brain. Is there some nicer way to do this? I
> don't think having a single getter with side effects is going to work either
> (like this:
>
> getNextComponentTab() {
> nextTab ++;
> return Integer.parseInt(nextTab);
> }
> <t:select t:id="country" t:model="dummyModel" t:value="country"
> t:label="message:COUNTRY" tabindex="${nextComponentTab}" />
>
> Because the getter is called a couple of times during page render, so I'd
> end up missing numbers in the tab index order - this itself doesn't break
> the tabbing of course, but it causes an overlap with subsequent elements in
> following components. If there was some way I could do the arithmetic in the
> tag itself, e.g.
>
> <t:select t:id="country" t:model="dummyModel" t:value="country"
> t:label="message:COUNTRY" tabindex="${tabIndexStart + 1}" />
>
> Then I'd settle for that, but that isn't possible I don't think.
>
> Any ideas greatly appreciated.
> Denis
>
--
Andreas Andreou - andyhot@apache.org - http://blog.andyhot.gr
Tapestry PMC / Tacos developer
Open Source / JEE Consulting
---------------------------------------------------------------------
To unsubscribe, e-mail: users-unsubscribe@tapestry.apache.org
For additional commands, e-mail: users-help@tapestry.apache.org
Re: Dynamically setting tabindex for input elements in a component
Posted by Denis McCarthy <dm...@annadaletech.com>.
Perfect, thanks
On Mon, Sep 27, 2010 at 6:44 PM, Thiago H. de Paula Figueiredo <
thiagohp@gmail.com> wrote:
> On Mon, 27 Sep 2010 14:09:18 -0300, Denis McCarthy <
> dmccarthy@annadaletech.com> wrote:
>
> <t:select t:id="country" t:model="dummyModel" t:value="country"
>> t:label="message:COUNTRY" tabindex="${tabIndexStart + 1}" />
>>
>
> <t:select t:id="country" t:model="dummyModel" t:value="country"
> t:label="message:COUNTRY" tabindex="${getTabIndex(1)}" />
>
> public int getTabIndex() {
> ....
> }
>
>
> public int getTabIndex(int skip) {
> getTabIndex() + skip;
> }
>
> --
> Thiago H. de Paula Figueiredo
> Independent Java, Apache Tapestry 5 and Hibernate consultant, developer,
> and instructor
> Owner, Ars Machina Tecnologia da Informação Ltda.
> http://www.arsmachina.com.br
>
>
> ---------------------------------------------------------------------
> To unsubscribe, e-mail: users-unsubscribe@tapestry.apache.org
> For additional commands, e-mail: users-help@tapestry.apache.org
>
>
--
Annadale Technologies Limited
Re: Dynamically setting tabindex for input elements in a component
Posted by "Thiago H. de Paula Figueiredo" <th...@gmail.com>.
On Mon, 27 Sep 2010 14:09:18 -0300, Denis McCarthy
<dm...@annadaletech.com> wrote:
> <t:select t:id="country" t:model="dummyModel" t:value="country"
> t:label="message:COUNTRY" tabindex="${tabIndexStart + 1}" />
<t:select t:id="country" t:model="dummyModel" t:value="country"
t:label="message:COUNTRY" tabindex="${getTabIndex(1)}" />
public int getTabIndex() {
....
}
public int getTabIndex(int skip) {
getTabIndex() + skip;
}
--
Thiago H. de Paula Figueiredo
Independent Java, Apache Tapestry 5 and Hibernate consultant, developer,
and instructor
Owner, Ars Machina Tecnologia da Informação Ltda.
http://www.arsmachina.com.br
---------------------------------------------------------------------
To unsubscribe, e-mail: users-unsubscribe@tapestry.apache.org
For additional commands, e-mail: users-help@tapestry.apache.org