CODEWITHSUNDEEP
javawicket
LDropl
LDropl

Reputation: 944

Add CSS class to selected Wicket Tab

I have couple Wicket Tabs and I need to add CSS class "text-primary" to the current selected tab

        List<ITab> tabList = new ArrayList<>();
        tabList.add(new AbstractTab(new Model<>("Tab 1")) {
            @Override
            public Panel getPanel(String panelId) {
                return new TabPanel1(panelId);
            }
        });
        tabList.add(new AbstractTab(new Model<>("Tab 2")) {
            @Override
            public Panel getPanel(String panelId) {
                return new TabPanel2(panelId);
            }
        });
        add(new AjaxTabbedPanel<>("tabs", tabList) {
            @Override
            protected WebMarkupContainer newLink(String linkId, int index) {
                AjaxFallbackLink<Void> link = new AjaxFallbackLink<>(linkId) {
                    private static final long serialVersionUID = 1L;

                    @Override
                    public void onClick(Optional<AjaxRequestTarget> target) {
                        TabbedPanel<ITab> selectedTab = setSelectedTab(index);
                        ITab tab = tabList.get(index);
                        if (target.isPresent()) {

                            tab.getPanel(linkId);

                            target.get().add(selectedTab);
                        }
                        onAjaxUpdate(target);
                    }
                };
                link.add(AttributeAppender.append("class", "text-primary"));
                return link;
            }
        });

This is how looks like markup for the Link

<a href="#" wicket:id="link"><span wicket:id="title">[[tab title]]</span></a>

this implementation adds to the both tabs css class and I need to check somehow if tab is selected

Upvotes: 1

Views: 942

Answers (1)

martin-g
martin-g

Reputation: 17533

You can use the passed argument index and compare it to the selectedTab:

if (index == getSelectedTab()) {
   link.add(AttributeAppender.append("class", "text-primary"));
}

Also take a look at org.apache.wicket.extensions.markup.html.tabs.TabbedPanel#getSelectedTabCssClass()

Upvotes: 2

Related Questions