How to prevent moving to next Tab until required fields in current tab are filled? | Community
Skip to main content
sesmic
sesmic
Level 4
December 6, 2022
Solved

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

  • December 6, 2022
  • 1 reply
  • 942 views

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

This post is no longer active and is closed to new replies. Need help? Start a new post to ask your question.
Best answer by Mayank_Gandhi

@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>

1 reply

Mayank_Gandhi
Adobe Employee
Mayank_GandhiAdobe Employee
Adobe Employee
December 6, 2022

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

    sesmic
    sesmicAuthor
    Level 4
    December 6, 2022

    @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?

      Mayank_Gandhi
      Adobe Employee
      Mayank_GandhiAdobe EmployeeAccepted solution
      Adobe Employee
      December 6, 2022

      @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>
        Terms & ConditionsAccessibility statement

        Loading footer...