How to dynamically select a given tab

When a form is first opened, the first tab (or the one with Active checked) is selected by default. But in the course of using the form, the user might close the form after selecting another tab.

I would like to have the default tab selected every time the form is opened. I’m thinking from the Modal Show or Shown events, as the form is in a Modal, but not sure what to put in there. Is there a way to do that?

There is a way to dynamically select a tab. Don’t remember though.

Just to clarify, you are talking about a tab control component, right? Maybe a screenshot would help.
Don’t quite understand what you mean by closing the form?

Yes a tab control component. The form is in a modal popup window that can be closed. That’s what I meant by closing the form.

image

In this case, the Order tab is the default tab and is active when the modal is first opened, but if the user selects the Products tab and then closes the modal, the next time it’s opened, Products is still selected.

@dan65h I’ve been trying to figure this out for weeks myself. Right now I’m using a URL var like tab=1 and then toggling the active class on the tab based on the value of the URL var but this doesn’t seem to always work. Sometimes the class is not set at all and no tabs show as active. That said I’m doing the same toggling of classes on the tab pane itself and that works. The correct content shows based on the URL var so I know it’s working but tabs don’t always cooperate. Hope that makes sense. Typing on my phone and in a hurry haha

What bootstrap version are you using?

I’m using Bootstrap 5

Bootstrap 4 here

Here you can both find the answers to your questions:

1 Like

Thank you! That’s what I was looking for. Not sure why that post didn’t show up when I searched for it.

Thank you @Teodor I will give it a try when I get back to the project with the issue.