Click here to Skip to main content
15,036,823 members
Please Sign up or sign in to vote.
0.00/5 (No votes)
See more:
I'm a beginner and I want to display menu on the middle like This Website(www.kammadanam.com) and when user clicks on any Category Name or its Sub Category Name I want to display Products related to the clicked category.



i am trying this way but it is not correct please provide valid code

i am struck in my project before 1 week.
please help me friends

What I have tried:

MY TABLE:

<pre>Category:

CategoryId(pk), CategoryName, Description, 

SubCategory:

SubCategoryId(pk), SubCategoryName, Description, Icon,CategoryId(fk)

Product:

ProductId(pk), Name, Price, Description, CategoryId(fk), SubCategoryId(fk),


my controller is:

public ActionResult Home()
    {
        Products obj = new Products();

        //=====Menu Menthods=====
        obj.Showall_Menu_Cate = obj.selectalldata_Menu_Cate();

        return View(obj);
    }


public JsonResult GetSiteMenu(string id)
        {
            Sample Productobj = new Sample();
            DataTable dt = new DataTable();
            List<Sample> PrtList = null;
            SqlCommand Cmd = new SqlCommand("select * from SubCategory where CategoryID='" + id + "'", Con);
            SqlDataAdapter Da = new SqlDataAdapter(Cmd);
            DataSet Ds = new DataSet();
            Da.Fill(Ds);
            PrtList = new List<Sample>();
            for (int i = 0; i < Ds.Tables[0].Rows.Count; i++)
            {
                Sample CatObj = new Sample();
                //CatObj.Id = Ds.Tables[0].Rows[i]["Id"].ToString();
                CatObj.SubCategoryID = Ds.Tables[0].Rows[i]["CategoryID"].ToString();
                CatObj.SubCategoryName = Ds.Tables[0].Rows[i]["CategoryName"].ToString();
                //CatObj.Description = Ds.Tables[0].Rows[i]["Description"].ToString();
                //CatObj.Image = Ds.Tables[0].Rows[i]["Image"].ToString();
                //CatObj.CreatedOn = Ds.Tables[0].Rows[i]["CreatedOn"].ToString();
                //CatObj.Status = Ds.Tables[0].Rows[i]["Status"].ToString();
                PrtList.Add(CatObj);
            }
            //Productobj.Showall_Menu_Category = PrtList;
            return new JsonResult { Data = PrtList };
        }


my Model is:

public List<Sample> selectalldata_Menu_Cate()
        {
            List<Sample> PrtList = null;
            SqlCommand Cmd = new SqlCommand("select * from Category", Con);
            SqlDataAdapter Da = new SqlDataAdapter(Cmd);
            DataSet Ds = new DataSet();
            Da.Fill(Ds);
            PrtList = new List<Sample>();
            for (int i = 0; i < Ds.Tables[0].Rows.Count; i++)
            {
                Sample CatObj = new Sample();
                CatObj.Id = Ds.Tables[0].Rows[i]["Id"].ToString();
                CatObj.CategoryID = Ds.Tables[0].Rows[i]["CategoryID"].ToString();
                CatObj.CategoryName= Ds.Tables[0].Rows[i]["CategoryName"].ToString();
                CatObj.Description = Ds.Tables[0].Rows[i]["Description"].ToString();
                CatObj.Image = Ds.Tables[0].Rows[i]["Image"].ToString();
                CatObj.CreatedOn = Ds.Tables[0].Rows[i]["CreatedOn"].ToString();
                CatObj.Status = Ds.Tables[0].Rows[i]["Status"].ToString();
                PrtList.Add(CatObj);
            }
            return PrtList;
        }

View:

@foreach (var item in Model.Showall_Menu_Products)
                            {
                                <li class="dropdown">
                                    <a href="@Html.ActionLink(item.ProductName,"Shop", "Kammadanam",new { id="Pandu2" },new { @class= ".button_action"})"></a>
                                    <ul>
                                        @foreach (var item2 in Model.Showall_Menu_Category)
                                        {
                                            <li>
                                                @*@Html.ActionLink("Solar Water heaters", "Shop", "Kammadanam")*@
                                                <a href="@Html.ActionLink(item2.CategoryName,"Shop", "Kammadanam",new { id ="Pandu" },new { @class= ".button_a"})"></a>
                                            </li>
                                        }
                                        @*<li><a href="shop.html">Solar LED Lights</a></li>
                                        <li><a href="shop.html">solar water pumps</a></li>
                                        <li><a href="shop.html">solar potable led & lamp LED</a></li>*@
                                    </ul>
                                </li>
                            }


Ajax Method:

<script>
                        $('.button_action').click(function (index) {
                            $.ajax({
                                url: "/Kammadanam/getProduct/",
                                contentType: 'application/html; charset=utf-8',
                                type: 'GET',
                                data: {
                                    id: $("#Pandu2").val()
                                },
                                success: function (result) {
                                    debugger
                                    $("#Pandu").attr('href', result)
                                }
                            });
                            return false;
                        });
                    </script>
Posted
Updated 4-Jan-17 2:47am
Comments
Suvendu Shekhar Giri 3-Jan-17 1:30am
   
"i am trying this way but it is not correct"
What is the issue with what you have tried?
Member 11652153 3-Jan-17 1:54am
   
Category and SubCategory's binding dynamically from database like menu's and Submenu's. in menu's bind category and in submenu bind SubCategory like this website..see once this website www.kammadanam.com

1 solution

1 . Create a Demo controller with 2 action Methods

1. Home ActionMethod
2. HomeLayout (this is Childonly ActionMethod will return a partial view )
[
return PartialView("_MenuList", Model);
]

2. Create Partial View with Name _MenuList in shared folder

<div>
    <ul class="nav nav-pills nav-stacked">
        @foreach (var menu in Model.ProductList)
        {                 
                // If you want to bind sub menu than create a static Method that will take product ID as input and will get sub product and iterate here     
            <li>@menu.MenuName
            </li>   
        }
    </ul>
</div>


3. Now On layout or View were you want to render this Menu just call

@{Html.RenderAction("HomeLayout", "DemoDashboard");}


Your Menu will be rendered here
   
Comments
Member 11652153 5-Jan-17 5:55am
   
i am tryed your way.but i am getting error.
in this directly load renderAction ethod
Member 11652153 5-Jan-17 5:57am
   
please see this link. www.kammadanam.com
in this one menu bar is there.
you understand what i need
Saineshwar Bageri 5-Jan-17 6:08am
   
Use same idea but you need to apply class to this menus accordingly then it will generate like that.

This content, along with any associated source code and files, is licensed under The Code Project Open License (CPOL)




CodeProject, 20 Bay Street, 11th Floor Toronto, Ontario, Canada M5J 2N8 +1 (416) 849-8900