Some CSS crack there to help fix Tab Order with new responsive engine?

Need help
1

Hello all!
The tab order in forms is a big problem… When pressing tab, users are not focused to the following field. I reached the Bubble support team but they don’t have a fix for this for now.
They say to fix it with CSS but honestly I don’t know how to proceed.
If there’s over there someone expert on this, maybe he/she can help ?
Thank you !!!

2

hey @Sarah_Esteve
This is untested in Bubble but works outside it and is worth a try…If you give each of the input elements a HTML ID such as input1, input2 etc.

You can then drop the script below somewhere on the page (you need to replace the values in inputs with the IDs of your elements, in the order that you want them to tab in… either in an HTML element, or run it as a script on the Page Load event:

Whether this works or not depends on whether you have other inputs on your page, but some variation of this should work with a bit of playing.

let inputs = ["input1","input2","input3","input4"]; //replace with the IDs of your elements here
inputs.forEach((el, ind) => {
  $("#"+el).attr('tabindex', (ind+1));
});
1 Like
3

This tab order issue on Bubble sucks…

I gave up… if this solution works, I will be eternally grateful

2 Likes
4

Seems we need to put all the inpu in the same and unique group for this to work properly

Group label
Label 1
Label 2 etc
Group Input
Input 1
Input 2 etc

5

This topic was automatically closed after 70 days. New replies are no longer allowed.