Services
Technology Web App Development Mobile App Development Windows App Development Database Development UI/UX Development Cloud Development SEO Digital Marketing Guest Posting Content Writing Artificial Intelligence Data Science ERP Development CRM Development CMS Development LMS Development Business Listing Blockchain Technology Startup Promotion
Products
Data Converter Cleaner TUC - Unit Converter Import Export Survey Manager Tweet Controller
Developer
Article Blog Forum Interview Beginner News Startup Quiz
Users
Career
Apply Job Internship
Pricing
Login Sign Up Get a Quote

forum

home / developersection / forums / how to use left panel menu in asp.net or mvc using jquery.
Ask Question

How to use left panel Menu in asp.net or mvc using jquery.

Anonymous User 3013 01 Jan 2016
I want to use  left panel Menu in asp.net or mvc using jquery.How to do this please give me a sample demo code. 
.net asp.netjquery
Updated 03 Jul 2023
Anonymous User
Anonymous User

Other

I am a content writter !

Message

2 Answers

Aryan Kumar
Aryan Kumar 03 Jul 2023
Report Abuse

Sure, here are the steps on how to use left panel menu in ASP.NET or MVC using jQuery:

  1. Create a left panel menu in your HTML page.
  2. Add a jQuery library to your HTML page.
  3. Write jQuery code to toggle the left panel menu.
  4. Bind the jQuery code to the left panel menu.

Here is an example of the code:

HTML

<div id="left-panel">
    <ul>
        <li><a href="#">Home</a></li>
        <li><a href="#">About Us</a></li>
        <li><a href="#">Contact Us</a></li>
    </ul>
</div>

<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>
<script>
$(document).ready(function() {
    // Toggle the left panel menu
    $("#left-panel").toggle();

    // Bind the jQuery code to the left panel menu
    $("#left-panel").on("click", function() {
        $("#left-panel").toggle();
    });
});
</script>

This code will create a left panel menu in your HTML page. The jQuery library will be loaded from Google CDN. The jQuery code will toggle the left panel menu when it is clicked. The jQuery code will be bound to the left panel menu using the on event handler.

Anonymous User
Anonymous User 01 Jan 2016
Report Abuse

here we are going to create left panel menu using  jquery. following the below code

<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="Fourm.aspx.cs" Inherits="Forumasp.Fourm" %>
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <meta charset="utf-8">
    <title>jQuery UI Menu - Categories</title>
    <link rel="stylesheet" href="//code.jquery.com/ui/1.11.4/themes/smoothness/jquery-ui.css">
    <script src="//code.jquery.com/jquery-1.10.2.js"></script>
    <script src="//code.jquery.com/ui/1.11.4/jquery-ui.js"></script>
    <link rel="stylesheet" href="/resources/demos/style.css">
    <script>
        $(function () {
            $("#menu").menu({
                items: "> :not(.ui-widget-header)"
            });
        });
    </script>
    <style>
        .ui-menu {
            width: 300px;
        }
        .ui-widget-header {
            padding: 0.2em;
        }
    </style>
</head>
<body>
    <ul id="menu">
        
        <li class="ui-widget-header">Main Master</li>
        <li>Dashboard</li>
        <li>State</li>
        <li>City</li>
        <li>Category</li>
        <li>Sub Category</li>
        <li>Product</li>
        <li class="ui-widget-header">Transaction</li>
        <li>Sales</li>
          <li>Sales Return</li>
        <li>Purchase</li>
         <li>Purchase Retuen</li>
        <li>Debit Note</li>
        <li>Credit Note</li>
        <li>Payment</li>
        <li>Receipt</li>
    </ul>

</body>
</html>

OutPut

Anonymous User

advertising