Search code examples
jquerycssstruts2

Dynamically assign CSS class to web site menu bar struts2


I want to dynamically assign CSS class to my web site menu bar

Header.jsp file

 <div class='menuArea'>
         <ul>

            <li class="current"><s:a action="listUsers">Users</s:a></li>
            <li><s:a action="listCustomers">Customers</s:a></li>
            <li><s:a action="searchItems">Items</s:a></li>

        </ul>
    </div>

Class "current" is applied to first li element and is static, but I want it to be dynamic depending upon the page selected.

<s:include value="header.jsp"/> is used to include header in other JSPs.


Solution

  • How about passing parameter with <s:include> tag.

    <s:include value="header.jsp">
      <s:param name="currentmenu" value="'page_id'" />
    </s:include>
    

    And then in your header.jsp retrieve parameter using ${param.your_param_name} notation and set it to some variable which you can use inside <s:if> tag to set class to an element.

    <s:set name="curr">
      ${param.currentmenu}
    </s:set>
    
    <ul>
      <li <s:if test="#curr == 'first_page_id'">class="current"</s:if> >
        <s:a action="listUsers">Users</s:a>
      </li>
      <li <s:if test="#curr == 'second_page_id'">class="current"</s:if> >
        <s:a action="listCustomers">Customers</s:a>
      </li>
      <li <s:if test="#curr == 'third_page_id'">class="current"</s:if> >
        <s:a action="searchItems">Items</s:a>
      </li>
    </ul>