[Solved] Onclick of submenu other submenu displaying in ASP.Net

Last Reply 3 months ago By pandeyism

Posted 3 months ago

I use sidebar submenu in my project. but I have a problem in use nested submenu.

when I click on one submenu, the other submenu is shown. how can I fix this problem?

this is my code:

<%@ Master Language="C#" AutoEventWireup="true" CodeBehind="Site1.master.cs" Inherits="KDUIS_v0._1.Site1" %>

<!DOCTYPE html>

<html lang="en">
<head runat="server">
    <meta charset="utf-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <link href="CssFiles/StyleSheet.css" rel="stylesheet" />
    <title><%: Page.Title %> -موسسه غیر انتفاعی توسعه دانش</title>
    <asp:PlaceHolder runat="server">
        <%: Scripts.Render("~/bundles/modernizr") %>
    </asp:PlaceHolder>
    <webopt:BundleReference runat="server" Path="~/Content/css" />
    <link href="favicon.ico" rel="shortcut icon" type="image/x-icon" />
    <script src="http://code.jquery.com/jquery-2.1.1.min.js"></script>
    <script>
        var toggle = true;
        $(".sidebar-icon").click(function () {
            if (toggle) {
                $(".page-container").addClass("sidebar-collapsed").removeClass("sidebar-collapsed-back");
                $("#menu span").css({ "position": "absolute" });
            }
            else {
                $(".page-container").removeClass("sidebar-collapsed").addClass("sidebar-collapsed-back");
                setTimeout(function () {
                    $("#menu span").css({ "position": "relative" });
                }, 400);
            }

            toggle = !toggle;
        });
    </script>
    <script type="text/javascript">
        var _gaq = _gaq || [];
        _gaq.push(['_setAccount', 'UA-36251023-1']);
        _gaq.push(['_setDomainName', 'jqueryscript.net']);
        _gaq.push(['_trackPageview']);
        (function () {
            var ga = document.createElement('script'); ga.type = 'text/javascript'; ga.async = true;
            ga.src = ('https:' == document.location.protocol ? 'https://ssl' : 'http://www') + '.google-analytics.com/ga.js';
            var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(ga, s);
        })();
    </script>
    <style type="text/css">
        .auto-style3 {
            font-family: tahoma;
        }
    </style>
</head>
<body style="background-color: #DCDCDC">
    <div class="sidebar-menu">
        <div style="border-top: 1px solid rgba(69, 74, 84, 0.7)"></div>
        <div class="menu">
            <ul id="menu">
                <li id="menu-home"><a href="ManagementControlPannel.aspx">
                    <div class="auto-style2">
                        <i></i><span>راهنمای سایت</span>
                    </div>
                </a>
                </li>
                <li id="menu-Education">
                    <a href="#">
                        <div class="auto-style2">
                            <span class="fa fa-angle-left" style="float: left"></span><span>مدیریت آموزش</span>
                        </div>
                    </a>
                    <ul>
                        <li>
                            <a href="#">
                                <div class="auto-style2">
                                    <span class="fa fa-angle-left" style="float: left"></span><span>واحد درسی</span>
                                </div>
                            </a>
                            <ul id="Menu-Course">
                                <li id="Menu-Course-sub1"><a href="#">تعریف درس و واحد درسی</a></li>
                                <li id="Menu-Course-sub2"><a href="#">ویرایش واحد درسی</a></li>
                            </ul>
                        </li>
                        <li>
                            <a href="#">
                                <div class="auto-style2">
                                    <span class="fa fa-angle-left" style="float: left"></span><span>مدیریت انسانی</span>
                                </div>
                            </a>
                            <ul id="Menu-Person">
                                <li id="Menu-Person-Sub">
                                    <a href="#">
                                        <div class="auto-style2">
                                            <span class="fa fa-angle-left" style="float: left"></span><span>فرد</span>
                                        </div>
                                    </a>
                                    <ul id="Menu-Person-Manegement">
                                        <li id="Menu-Person-Manegement1">
                                            <a href="#">تعریف فرد</a>
                                        </li>
                                        <li id="Menu-Person-Manegement2">
                                            <a href="#">مدیریت فرد</a>
                                        </li>
                                    </ul>
                                </li>
                                <li id="Menu-Student">
                                    <a href="#">
                                        <div class="auto-style2">
                                            <span class="fa fa-angle-left" style="float: left"></span><span>دانشجو</span>
                                        </div>
                                    </a>
                                    <ul>
                                        <li id="Menu-Student1">
                                            <a href="#">تعریف دانشجو</a>
                                        </li>
                                        <li id="Menu-Student2">
                                            <a href="#">مدیریت دانشجو</a>
                                        </li>
                                    </ul>
                                </li>
                                <li id="Menu-Prof">
                                    <a href="#">
                                        <div class="auto-style2">
                                            <span class="fa fa-angle-left" style="float: left"></span><span>استاد</span>
                                        </div>
                                    </a>
                                    <ul>
                                        <li id="Menu-Prof1">
                                            <a href="#">تعریف استاد</a>
                                        </li>
                                        <li id="Menu-Prof2">
                                            <a href="#">مدیریت استاد</a>
                                        </li>
                                    </ul>
                                </li>
                            </ul>
                        </li>
                        <li>
                            <a href="#">
                                <div class="auto-style2">
                                    <span class="fa fa-angle-left" style="float: left"></span><span>انتخاب واحد</span>
                                </div>
                            </a>
                        </li>
                        <li>
                            <a href="#">
                                <div class="auto-style2">
                                    <span class="fa fa-angle-left" style="float: left"></span><span>گزارشگیری</span>
                                </div>
                            </a>
                            <ul class="tert-nav">
                                <li><a href="#">لیست حضور و غیاب</a></li>
                                <li><a href="#">لیست حضور و غیاب جلسه امتحان</a></li>
                            </ul>
                        </li>
                    </ul>
                </li>
            </ul>
        </div>
    </div>
    <form runat="server">
        <asp:Label ID="LblFirstName" runat="server" Text="LblFirstName" Visible="False"></asp:Label>
        <asp:Label ID="LblLastName" runat="server" Text="LblLastName" Visible="False"></asp:Label>
        <asp:Label ID="LblPersonID" runat="server" Text="LblPersonID" Visible="False"></asp:Label>
        <div class="Content">
            <div class="HeaderDIV">
                <div class="ToseeDAnesh">
                    <strong>&nbsp;<asp:Label ID="Label5" runat="server" Font-Names="Tahoma" Text="موسسه غیر انتفاعی توسعه دانش"></asp:Label>
                    </strong>
                </div>
                <div class="LOGO">
                    <asp:Image ID="Image1" runat="server" ImageUrl="~/pictures/KDUni-Logo-New-ed2-xs.png" />
                </div>
            </div>
            <div class="Header">
                <div class="LoginBtn">

                    <asp:ImageButton ID="BtnLogout" runat="server" Height="52px" ImageAlign="Left" ImageUrl="~/Pictures/start_transport_oman_info_icon_vb_exit.png" ToolTip="خروج" Width="71px" Visible="False" OnClick="BtnLogout_Click" />
                    &nbsp;
                        <asp:Label ID="LblLogOut" runat="server" Font-Names="Tahoma" Text="خروج" Visible="False"></asp:Label>
                    &nbsp;
                        <asp:ImageButton ID="BtnLogin" runat="server" Height="47px" ImageUrl="~/Pictures/Login.png" OnClick="BtnLogin_Click" ToolTip="ورود" Width="58px" Visible="False" />
                    <asp:Label ID="Label4" runat="server" Font-Names="Tahoma" Text="ورود" Visible="False"></asp:Label>
                </div>
                <div class="LoginStatus">
                    <asp:Label ID="LblLogin" runat="server" Text="LblLogin" Font-Bold="True" Font-Names="Tahoma" Width="363px"></asp:Label>
                </div>
            </div>
            <div class="page-container">
                <div class="MainDIV">
                    <asp:ContentPlaceHolder ID="MainContent" runat="server">
                    </asp:ContentPlaceHolder>
                </div>
            </div>
            <div>
                <br />
                <footer class="FoteerDIV">
                    <p>
                        <asp:Label ID="Label1" runat="server" Text="Label" CssClass="auto-style3"></asp:Label>
                    </p>
                    <p>
                        <asp:Label ID="Label2" runat="server" CssClass="auto-style3" Text="Label"></asp:Label>
                    </p>
                    <p>&nbsp;</p>
                </footer>
            </div>
        </div>
    </form>
</body>
</html>

 

You are viewing reply posted by: pandeyism 3 months ago.
Posted 3 months ago
pandeyism says:
 /*#menu li li:hover ul
        {
            visibility: visible;
            opacity: 1;
        }*/

 Above lin of code i have commented, then that's working.