[Feature-1181]Tabbing through components in Perspective

Is there a way to setup a “tab order” in perspective. I have 20 some numeric entries on a page and when I press tab I jump all over the place. I tried adding a prefix to each components name (0-26_ComponentName) but that didn’t seem to help either. Is there any way to do without having to restructure everything I already have?

Thanks,

2 Likes

Pretty sure that sets up the DOM.

I guess you could use focus and blur events.

But, it probably is quicker to just refactor it and put it in the correct order.

There is an open feature request to configure this, but the current approach is to manipulate the z-index of input components such that they are in the order you want the tabbing to follow. Long-term we will most likely introduce something like Component.meta.tabIndex which would allow for specifying the order of components.

Thanks, I will look into the z-index and see if I can make it work.

Did the z-index work? if yes, could you explain?

No, I never got it working. I haven’t put much time into it since I originally asked but it never worked as I intended. It hasn’t been priority enough for me to revisit again.

@cmallonee Any update on ETA on this? I’ve got a heavy form based application and the end user is asking for better control of tabbing through the form when entering data.

It is still in the incubation phase, and so I would not expect it in the next couple of releases.

@cmallonee do you know of a reliable work around? Even if it is hacky I’d be willing to try it.

I don’t think there is one. tabIndex is an HTML attribute on each node; you can’t even customize it via CSS.

If I remember correctly, the tabbing from one component to the next is predicated by their order in the project browser, so if you’re using a coordinate container you can just place all of the input components as the last components in their respective level. If you’re not using a coordinate container, or you have nesting going on, then there’s nothing you can do as of right now.

OK Thanks for the ideas.

I’ll try the coordinate container and see if that help out. Right now it is a flex container so that makes sense on why it might not be working.