CODEWITHSUNDEEP
javawicket
Moroianu Alexandru
Moroianu Alexandru

Reputation: 167

How can disable the selected link when clicking another in wicket ?

i have a bunch of links like this :

 <li wicket:id="LIlink"><a href="#" wicket:id="link">Link name</a></li>

in wicket , the <li> is a WebMarkupContainer and <a> is a Link

when i am clicking a link , i want to change the li's class to active , and i'm doing this with a class made by me like in the following example :

Link link= new Link("link") 
{
   @Override
       public void onClick() {
                    WMK.add(CssClassManagement.addAttribute("active"));
                }
};

considering that WMK is the WebMarkupContainer containing the link .

Until here ,everything works , the problem is i can't figure out how i remove the class active from the <li> when another link is clicked ?

Upvotes: 0

Views: 758

Answers (2)

martin-g
martin-g

Reputation: 17503

The problem is in CssClassManagement.addAttribute("active"). This adds a permanent Behavior to the component that contributes "active" CSS class for each render of the component. If the Behavior is temporary (see Behavior#isTemporary()) then it will be used just once and removed immediately from the component. So next repaint of the page will not mark the link as active.

Another approach is to remove the CSS class when the click event happens:

$(function() {
  $(document).on('click', 'a', function() {$('li.active').removeClass('active');});
});

This will remove the CSS class when the user clicks on an anchor. The repaint of the page will come with the new link selected as active.

Upvotes: 1

Andrea Del Bene
Andrea Del Bene

Reputation: 2511

if your links point to different pages you can just check if the current page is one pointed by a given link and then decide to add or remove the active attribute.

Upvotes: 1

Related Questions