Create Dynamic List in Asp.net with SQL Server

Hi,

i want to create a dynamic list in asp.net with sql server as database.

code for attached image is:

<a href="#" class="list-group-item active">
    Cras justo odio
  </a>
  <a href="#" class="list-group-item">Dapibus ac facilisis in</a>
  <a href="#" class="list-group-item">Morbi leo risus</a>
  <a href="#" class="list-group-item">Porta ac consectetur ac</a>
  <a href="#" class="list-group-item">Vestibulum at eros</a>

Open in new window

i want href and name will be dynamic.
2014-12-20-12-16-17.png
LVL 6
Mandeep SinghDatabase AdministratorAsked:
Who is Participating?
I wear a lot of hats...

"The solutions and answers provided on Experts Exchange have been extremely helpful to me over the last few years. I wear a lot of hats - Developer, Database Administrator, Help Desk, etc., so I know a lot of things but not a lot about one thing. Experts Exchange gives me answers from people who do know a lot about one thing, in a easy to use platform." -Todd S.

maqskywalkerCommented:
Here are two examples that bind a sql server table to a ASP.NET Drop Down list.
Example 2 is similar to what you need.


Example 1

Step 1: Create Sql Server Table

Here is the script to create the table

CREATE TABLE [dbo].[TestNFLTable](
	[TeamID] [int] NOT NULL,
	[TeamName] [varchar](255) NULL,
	[TeamWebsite] [varchar](255) NULL
) ON [PRIMARY]
GO
SET ANSI_PADDING OFF
GO
INSERT [dbo].[TestNFLTable] ([TeamID], [TeamName], [TeamWebsite]) VALUES (1, N'Arizona Cardinals', N'http://www.azcardinals.com')
INSERT [dbo].[TestNFLTable] ([TeamID], [TeamName], [TeamWebsite]) VALUES (2, N'Atlanta Falcons', N'http://www.atlantafalcons.com')
INSERT [dbo].[TestNFLTable] ([TeamID], [TeamName], [TeamWebsite]) VALUES (3, N'Baltimore Ravens', N'http://www.baltimoreravens.com')
INSERT [dbo].[TestNFLTable] ([TeamID], [TeamName], [TeamWebsite]) VALUES (4, N'Buffalo Bills', N'http://www.buffalobills.com')
INSERT [dbo].[TestNFLTable] ([TeamID], [TeamName], [TeamWebsite]) VALUES (5, N'Carolina Panthers', N'http://www.panthers.com')
INSERT [dbo].[TestNFLTable] ([TeamID], [TeamName], [TeamWebsite]) VALUES (6, N'Chicago Bears', N'http://www.chicagobears.com')
INSERT [dbo].[TestNFLTable] ([TeamID], [TeamName], [TeamWebsite]) VALUES (7, N'Cincinnati Bengals', N'http://www.bengals.com')
INSERT [dbo].[TestNFLTable] ([TeamID], [TeamName], [TeamWebsite]) VALUES (8, N'Cleveland Browns', N'http://www.clevelandbrowns.com')
INSERT [dbo].[TestNFLTable] ([TeamID], [TeamName], [TeamWebsite]) VALUES (9, N'Dallas Cowboys', N'http://www.dallascowboys.com')
INSERT [dbo].[TestNFLTable] ([TeamID], [TeamName], [TeamWebsite]) VALUES (10, N'Denver Broncos', N'http://www.denverbroncos.com')
INSERT [dbo].[TestNFLTable] ([TeamID], [TeamName], [TeamWebsite]) VALUES (11, N'Detroit Lions', N'http://www.detroitlions.com')
INSERT [dbo].[TestNFLTable] ([TeamID], [TeamName], [TeamWebsite]) VALUES (12, N'Green Bay Packers', N'http://www.packers.com')
INSERT [dbo].[TestNFLTable] ([TeamID], [TeamName], [TeamWebsite]) VALUES (13, N'Houston Texans', N'http://www.houstontexans.com')
INSERT [dbo].[TestNFLTable] ([TeamID], [TeamName], [TeamWebsite]) VALUES (14, N'Indianapolis Colts', N'http://www.colts.com')
INSERT [dbo].[TestNFLTable] ([TeamID], [TeamName], [TeamWebsite]) VALUES (15, N'Jacksonville Jaguars', N'http://www.jaguars.com')
INSERT [dbo].[TestNFLTable] ([TeamID], [TeamName], [TeamWebsite]) VALUES (16, N'Kansas City Chiefs', N'http://www.kcchiefs.com')
INSERT [dbo].[TestNFLTable] ([TeamID], [TeamName], [TeamWebsite]) VALUES (17, N'Miami Dolphins', N'http://www.miamidolphins.com')
INSERT [dbo].[TestNFLTable] ([TeamID], [TeamName], [TeamWebsite]) VALUES (18, N'Minnesota Vikings', N'http://www.vikings.com')
INSERT [dbo].[TestNFLTable] ([TeamID], [TeamName], [TeamWebsite]) VALUES (19, N'New England Patriots', N'http://www.patriots.com')
INSERT [dbo].[TestNFLTable] ([TeamID], [TeamName], [TeamWebsite]) VALUES (20, N'New Orleans Saints', N'http://www.neworleanssaints.com')
INSERT [dbo].[TestNFLTable] ([TeamID], [TeamName], [TeamWebsite]) VALUES (21, N'New York Giants', N'http://www.giants.com')
INSERT [dbo].[TestNFLTable] ([TeamID], [TeamName], [TeamWebsite]) VALUES (22, N'New York Jets', N'http://www.newyorkjets.com')
INSERT [dbo].[TestNFLTable] ([TeamID], [TeamName], [TeamWebsite]) VALUES (23, N'Oakland Raiders', N'http://www.raiders.com')
INSERT [dbo].[TestNFLTable] ([TeamID], [TeamName], [TeamWebsite]) VALUES (24, N'Philadelphia Eagles', N'http://www.philadelphiaeagles.com')
INSERT [dbo].[TestNFLTable] ([TeamID], [TeamName], [TeamWebsite]) VALUES (25, N'Pittsburgh Steelers', N'http://www.steelers.com')
INSERT [dbo].[TestNFLTable] ([TeamID], [TeamName], [TeamWebsite]) VALUES (26, N'San Diego Chargers', N'http://www.chargers.com')
INSERT [dbo].[TestNFLTable] ([TeamID], [TeamName], [TeamWebsite]) VALUES (27, N'San Francisco 49ers', N'http://www.sf49ers.com')
INSERT [dbo].[TestNFLTable] ([TeamID], [TeamName], [TeamWebsite]) VALUES (28, N'Seattle Seahawks', N'http://www.seahawks.com')
INSERT [dbo].[TestNFLTable] ([TeamID], [TeamName], [TeamWebsite]) VALUES (29, N'St. Louis Rams', N'http://www.stlouisrams.com')
INSERT [dbo].[TestNFLTable] ([TeamID], [TeamName], [TeamWebsite]) VALUES (30, N'Tampa Bay Buccaneers', N'http://www.buccaneers.com')
INSERT [dbo].[TestNFLTable] ([TeamID], [TeamName], [TeamWebsite]) VALUES (31, N'Tennessee Titans', N'http://www.titansonline.com')
INSERT [dbo].[TestNFLTable] ([TeamID], [TeamName], [TeamWebsite]) VALUES (32, N'Washington Redskins', N'http://www.redskins.com')

Open in new window


When you run this script the TestNFLTable looks like this:

TestNFLTable
Step 2: Create ASP.NET Page and bind DropDownlist to table

If you create a ASP.NET Empty website, then create this page and use this code.

TestNFLPage.aspx

<%@ Page Language="C#" AutoEventWireup="true" CodeFile="TestNFLPage.aspx.cs" Inherits="TestNFLPage" %>
 
<!DOCTYPE html>
 
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <title></title>
</head>
<body>
    <form id="form1" runat="server">
    <div>
        <asp:SqlDataSource ID="SqlDataSource1" runat="server" 
            ConnectionString="<%$ ConnectionStrings:NFLConnectionString %>" 
            SelectCommand="SELECT [TeamID], [TeamName],[TeamWebsite] FROM [TestNFLTable]">
        </asp:SqlDataSource> 
 
        <br />
        <br />
 
            <table class="style1">
            <tr>
                <td class="style2" colspan="4">
                    Bind Sql Server Table to ASP.NET DropDownList</td>
            </tr>
            <tr>
                <td >
                    <asp:DropDownList id="DropDownList1" runat="server" DataSourceID="SqlDataSource1" DataTextField="TeamName" DataValueField="TeamWebsite" AutoPostBack="True" OnSelectedIndexChanged="DropDownList1_SelectedIndexChanged">
                    </asp:DropDownList>
                    
                </td>
 
            </tr>
        </table>
    </div>
    </form>
</body>
</html>

Open in new window



TestNFLPage.aspx.cs

using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.UI;
using System.Web.UI.WebControls;
 
public partial class TestNFLPage : System.Web.UI.Page
{
    protected void Page_Load(object sender, EventArgs e)
    {
 
    }
 
    protected void DropDownList1_SelectedIndexChanged(object sender, EventArgs e)
    {
 
        // redirect the user to selected value url of the dropdownlist
        Response.Redirect(DropDownList1.SelectedValue);
 
    }
}

Open in new window


When you run that page then you will get this:

ASP.NET page when run.  

So whatever team you select from the list , the user will navigate to the url for that team.
The url is stored in the sql server table listed above.



Example 2

Step 1: Create Sql Server Table

Here is the script to create the table

-- create table
CREATE TABLE [dbo].[TestTable](
	[ItemID] [int] NULL,
	[ItemDescription] [varchar](100) NULL,
       [ItemURL] [varchar](100) NULL
) 
GO
-- insert data into table  
INSERT [dbo].[TestTable] ([ItemID], [ItemDescription], [ItemURL]) VALUES (1, 'Cras justo odio', N'http://www.google.com')
INSERT [dbo].[TestTable] ([ItemID], [ItemDescription], [ItemURL]) VALUES (2, 'Dapibus ac facilisis in', N'http://www.bing.com')
INSERT [dbo].[TestTable] ([ItemID], [ItemDescription], [ItemURL]) VALUES (3, 'Morbi leo risus', N'http://www.yahoo.com')
INSERT [dbo].[TestTable] ([ItemID], [ItemDescription], [ItemURL]) VALUES (4, 'Porta ac consectetur ac', N'http://www.aol.com')
INSERT [dbo].[TestTable] ([ItemID], [ItemDescription], [ItemURL]) VALUES (5, 'Vestibulum at eros', N'http://www.espn.com')

Open in new window


When you run this script the TestTable looks like this:

TestTable
Step 2: Create ASP.NET Page and bind DropDownlist to table

If you create a ASP.NET Empty website, then create this page and use this code.

TestPage.aspx

<%@ Page Language="C#" AutoEventWireup="true" CodeFile="TestPage.aspx.cs" Inherits="TestPage" %>

<!DOCTYPE html>

<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <title></title>
</head>
<body>
    <form id="form1" runat="server">
    <div>
        <asp:SqlDataSource ID="SqlDataSource1" runat="server" 
            ConnectionString="<%$ ConnectionStrings:TestDatabaseConnectionString %>" 
            SelectCommand="SELECT [ItemID], [ItemDescription],[ItemURL] FROM [TestTable]">
        </asp:SqlDataSource> 

        <br />
        <br />

            <table class="style1">
            <tr>
                <td class="style2" colspan="4">
                    Bind Sql Server Table to ASP.NET DropDownList</td>
            </tr>
            <tr>
                <td >
                    <asp:DropDownList id="DropDownList1" runat="server" DataSourceID="SqlDataSource1" DataTextField="ItemDescription" DataValueField="ItemURL" AutoPostBack="True" OnSelectedIndexChanged="DropDownList1_SelectedIndexChanged">
                    </asp:DropDownList>
                    
                </td>

            </tr>
        </table>
    </div>
    </form>
</body>
</html>

Open in new window



TestPage.aspx.cs

using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.UI;
using System.Web.UI.WebControls;

public partial class TestPage : System.Web.UI.Page
{
    protected void Page_Load(object sender, EventArgs e)
    {

    }

    protected void DropDownList1_SelectedIndexChanged(object sender, EventArgs e)
    {

        // redirect the user to selected value url of the dropdownlist
        Response.Redirect(DropDownList1.SelectedValue);

    }
}

Open in new window


When you run that page then you will get this:

TestPage when runSo whatever item you select from the list , the user will navigate to the url for that item.
0
Mandeep SinghDatabase AdministratorAuthor Commented:
Hi maqskywalker,

I am not using Dropdownlist, you can see that in image too. I am just creating a side menu. Some thing like categories menu for products. On clicking any category it will display respective products on that category to datalist.

I Need side menu should be dynamic.
0
Mandeep SinghDatabase AdministratorAuthor Commented:
Hi Friends,

I solved this using placeholder, i bind data into that in code and defined my menu style their, to redirect to respective page i have used querystring.
0

Experts Exchange Solution brought to you by

Your issues matter to us.

Facing a tech roadblock? Get the help and guidance you need from experienced professionals who care. Ask your question anytime, anywhere, with no hassle.

Start your 7-day free trial
Mandeep SinghDatabase AdministratorAuthor Commented:
Explore myself and got the answer.
0
It's more than this solution.Get answers and train to solve all your tech problems - anytime, anywhere.Try it for free Edge Out The Competitionfor your dream job with proven skills and certifications.Get started today Stand Outas the employee with proven skills.Start learning today for free Move Your Career Forwardwith certification training in the latest technologies.Start your trial today
Microsoft Development

From novice to tech pro — start learning today.