MonoX support board

Start the conversation, ask questions and share tips and solutions with fellow developers.

Non-registered users can only browse through our support boards. Please register now if you want to post your questions. It takes a second and it is completely free. Alternatively, you can log in without registration using your credentials at major sites such as Google, Microsoft Live, OpenId, Facebook, LinkedIn or Yahoo.

HOW TO ADD "current" class in MessageCenter control menu  (Mono Support )

Viewed 17387 time(s), 4 post(s) 12/11/2013 10:50:13 AMby sonap
sonap

sonap

12/11/2013 10:50:39 AM
Hello,

I was wondering how is it possible to add a "current" class on the <li> for the <received> <sent> <new message> menu in the MessageCenter.ascx module.

The module's <LI> menu: 
<div class="tabs clearfix">
                <ul>
                    <li>
                        <asp:LinkButton ID="btnRecivedMessages" CausesValidation="false" runat="server" CommandArgument="MessageList" OnClick="btnTab_Click" CssClass="selected" ></asp:LinkButton>
                    </li>
                    <li>
                        <asp:LinkButton ID="btnSentMessages" CausesValidation="false" runat="server" CommandArgument="MessageListSent" OnClick="btnTab_Click" ></asp:LinkButton>
                    </li>
                    <li>
                        <asp:LinkButton ID="btnNewMessage" CausesValidation="false" runat="server" CommandArgument="MessageCreate" OnClick="btnTab_Click" ></asp:LinkButton>
                    </li>
                    <li>
                        <asp:HiddenField ID="hfSelectedTabs" runat="server" Value="MessageList" />
                    </li>
                </ul>
                <div class="tab-line"></div>
            </div>


I see it get done in the GroupView.asxc module:

<div class="tabs clearfix">
            <ul id="rowSwitch" runat="server">
                <li class="<%= InternalWorkingMode.Equals(SnGroupWorkingMode.Wall) ? "current" : String.Empty %>">
                    <asp:HyperLink ID="lnkWall" runat="server" CausesValidation="false" CssClass="tab-button">
                        <span id="labWall" runat="server">Wall</span>
                    </asp:HyperLink>
                </li>
                <li class="<%= InternalWorkingMode.Equals(SnGroupWorkingMode.Photos) ? "current" : String.Empty %>">
                    <asp:HyperLink ID="lnkPhotos" runat="server" CausesValidation="false" CssClass="tab-button">
                        <span id="labPhotos" runat="server">Photos</span>
                    </asp:HyperLink>
                </li>
                <li class="<%= InternalWorkingMode.Equals(SnGroupWorkingMode.DiscussionBoard) ? "current" : String.Empty %>">
                    <asp:HyperLink ID="lnkDiscussion" runat="server" CausesValidation="false" CssClass="tab-button">
                        <span id="labDiscussion" runat="server">Discussion board</span>
                    </asp:HyperLink>
                </li>
                <!--CLIPFLAIR-->
                <li>
                    <asp:Panel runat="server" ID="pnlWarning">
                        <asp:LinkButton runat="server" ID="lnkJoin" CssClass="styled-button main-button submit-btn" OnCommand="lnkJoin_Command"></asp:LinkButton>
                    </asp:Panel>
                </li>
                <!--/CLIPFLAIR-->
            </ul>
            <div class="tab-line"></div>
        </div>
This content has not been rated yet. 
475 Reputation 52 Total posts
dbogdan

dbogdan

12/11/2013 11:23:18 AM
Hi Sonap,

You can handle it in a same way as it is handled in GroupView.ascx. So basicly, if you need some logic behind assigning "current" class, you can handle it in code behind and then from the markup you can call particular property or method.

Another approach is by assigning "runat" and "id" attributes to the particular <li> elements, and then you can access them directly from codebehind.
E.g.
 listItem.Attributes.Add("class", "current");
Regards,
Darjan
This content has not been rated yet. 
231 Reputation 38 Total posts
sonap

sonap

12/11/2013 11:30:54 AM
Hello and thank you for your reply.

I tried adding a jquery instead of working on codebehind and it worked.

I added in js code:
//change the parrent element
$('a.selected').closest('li').addClass('current');
and it adds the wanted class attribute :)
This content has not been rated yet. 
475 Reputation 52 Total posts
dbogdan

dbogdan

12/11/2013 11:40:48 AM
Hi, 

No problem, I am glad that you've found desired solution

Regards
Darjan 
This content has not been rated yet. 
231 Reputation 38 Total posts