Expand my Community achievements bar.

Dive into Adobe Summit 2024! Explore curated list of AEM sessions & labs, register, connect with experts, ask questions, engage, and share insights. Don't miss the excitement.
SOLVED

How to prevent moving to next Tab until required fields in current tab are filled?

Avatar

Level 4

Hi!
I'm having form with 3-4 tabs & some required fields in each. Now I want to prevent the user to move to next tab until the required fields are filled in current one.
I'm using this & it's working fine for next button which prevents from going to next tab until fields are filled. But still user is able to jump to other tabs directly by clicking respective tabs.
Please suggest any method to prevent this.

Thanks

1 Accepted Solution

Avatar

Correct answer by
Employee Advisor

@sesmic I believe there would be some common class at tabs, just grab them using js and remove the anchor tags from them

<a href="javascript&colon;void(0)">Google.com</a>

View solution in original post

3 Replies

Avatar

Employee Advisor

@sesmic the approach is correct, however, the tabs act as a link allowing users to navigate, which theme and layout are you using?

Avatar

Level 4

@Mayank_Gandhi Thanks for the reply.
I'm using my custom theme with 3-4 panels and tab layout.
If tabs act a link, then is there any way I disable it until fields are filled?

Avatar

Correct answer by
Employee Advisor

@sesmic I believe there would be some common class at tabs, just grab them using js and remove the anchor tags from them

<a href="javascript&colon;void(0)">Google.com</a>