Click here to Skip to main content
15,039,149 members
Please Sign up or sign in to vote.
0.00/5 (No votes)
See more:
I wants to make product list in my website.There have many products in different category.So I wants to make vertical menu in asp.net[c#] and bind data from appropriate table .pls helpme...

How can create category menu in asp.net[c#]? Admin page needed to add new category...
Posted

There are a couple of ways that you could show this products group by categories (as far as I understood that's what you want to do, right?) You could use a vertical menu (menu Items for categories and sub-menu Items for category's prodcut), or you could use a treeview, or you could use a DataList (so you can template the layout) or even create a similar efect creating the layout dynamically and using CollapsiblePanelExtenders if you need to save space in the screen... etc.

I would go with the combination of the last two (DataList effect and CollapsiblePanelExtender).

Hope that helps!
   
Try a combination with JQuery:

See demo at http://www.designchemical.com/lab/demo-wordpress-jquery-vertical-mega-menu-plugin/[^].

At Asp.Net project create a ASCX user control with:

XML
<div class="prductmenu">
        <ul class=&quot;megamenu&quot;>
            <asp:PlaceHolder runat="server" ID="phCategories" EnableViewState="false" />
        </ul>
    </div>


From de Codebehind use StringBuilder and build Main (<li>) and Sub categories (<ul>) with sub (<li>) and render to the Placeholder.
   
There are many approaches that you can follow like menu contol in asp.net or by using any third party control,

but the one that I prefer for my works is to create it by myself.

Lets see it the seneario (I do not have your database structure so I use a new one)

Suppose you have table like below with the columns as specified

Category<br />
   1. CategoryID INT - PrimaryKey  +  Identity<br />
   2. CategoryName VARCHAR(150)<br />
<br />


Now the main thing is the Menu which you want to be done

Take a user Control Categories.ascx

Add a Datalist Control set its id = dlCategory, put a label control in its itemtemplate, it should look like this :

<asp:DataList ID="DLCategory" runat="server"  
        RepeatColumns="1" RepeatDirection="Horizontal">
        <ItemTemplate>
            <a href="Category.aspx?Cid=<%#Eval(CategoryID) %>"><asp:Label ID="Label1" runat="server" 
    Text='<%# Eval("CategoryName") %>'></asp:Label></a>
        </ItemTemplate>
    </asp:DataList>


play with the RepeatDirection and RepeatColumns you will get an idea, write a css for styling the template as you want it to display.

Anchor tag in datalist will redirect user to category.aspx page with the querystring cid which identifies, which category was clicked


Now in the code view add the following code in the pageload event

DataSet ds = new DataSet(); 

SqlConnection con = new SqlConnection("Pass your Connection string here");

SqlDataAdapter da = new SqlDataAdapter("select * from Category", con);

da.Fill(ds);

dlCategory.DataSource = ds;

dlCategory.DataBind();


you are all ready...

Hope it helps, in case of any confusion leave a comment...

use the visual studio intellisense for any typing mistake in code...

Enjoy !!! :)
   

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