Tabbing hosted form field
Application Type
Traditional Web

I have a credit card information form where the Credit card number and CVV fields are a hosted fields from the provider.

All the tabbing on the form works fine but the CC and CVV fields tabbing have issues. i.e they are aligned as the second and third expression but when pressing tab they are being focused after the last field (Postal Code) in the form.

I tried the setting the tabindex in the extended properties but that doesnt work either.

I have also created the same form using html css without outsystems and the tabbing works fine.

Can anyone help me with this.

cc pic.PNG

Hello muneer,

In the every input add attribute tabindex=1,tabindex=2,tabindex=3 and so on as per your requirement
For example:

Name of card - tabindex=1
Credit card number- tabindex=2
CVV- tabindex=3

Hope this well helps you,

Thanks and Regards,

Akshay Deshpande

@Akshay Deshpande šŸš€ I tried that but that didnt work.

Though i have fixed the issue by making tab index = 0 for each and every field except the CC and CVV the hosted fields and it is working fine.


Yes your are right the index start from zero but that thing is working :)
in this if you start index with 0,1,2 still you will able to solve your issue
still anyway happy to help you :)

if you find your solution using tab index, then marked as solution so everyone will get this solution easily

Keep coding :)

Community GuidelinesBe kind and respectful, give credit to the original source of content, and search for duplicates before posting.