Hi
I have created a sample which full fill your requriement you need to modify it according to you need.
SQL
CREATE TABLE [Locations]
(
[Name] [varchar](50) NOT NULL,
[Description] [varchar](300) NULL
)
INSERT [Locations] ([Name], [Description]) VALUES (N'Aksa Beach', N'Aksa Beach is a popular beach and a vacation spot in Aksa village at Malad, Mumbai.')
INSERT [Locations] ([Name], [Description]) VALUES (N'Alibaug', N'Alibaug is a coastal town and a municipal council in Raigad District in the Konkan region of Maharashtra, India.')
INSERT [Locations] ([Name], [Description]) VALUES (N'Juhu Beach', N'Juhu Beach is one of favorite tourist attractions situated in Mumbai.')
INSERT [Locations] ([Name], [Description]) VALUES (N'Mumbai',N'Mumbai formerly Bombay, is the capital city of the Indian state of Maharashtra.')
INSERT [Locations] ([Name], [Description]) VALUES (N'Pune',N'Pune is the seventh largest metropolis in India, the second largest in the state of Maharashtra after Mumbai.')
HTML
<div>
<div id="myCarousel" align="center" class="carousel slide" data-ride="carousel" data-pause="hover">
<ol class="carousel-indicators">
<li data-target="#myCarousel" data-slide-to="0" class="active"></li>
<li data-target="#myCarousel" data-slide-to="1"></li>
</ol>
<div class="carousel-inner" role="listbox">
<!-- Indicators -->
<asp:Repeater ID="rptCarousel" runat="server">
<ItemTemplate>
<!-- Wrapper for slides -->
<div class="item">
<div class="carousel-content">
<div style="margin: 0 auto">
<h3>
<asp:Label Text='<%# Eval("Name") %>' runat="server" />
</h3>
<p>
<asp:Label ID="Label1" Text='<%# Eval("Description") %>' runat="server" /></p>
</div>
</div>
</div>
</ItemTemplate>
</asp:Repeater>
</div>
<a class="left carousel-control" href="#myCarousel" role="button" data-slide="prev">
<span class="glyphicon glyphicon-chevron-left" aria-hidden="true"></span><span class="sr-only">
Previous</span> </a><a class="right carousel-control" href="#myCarousel" role="button"
data-slide="next"><span class="glyphicon glyphicon-chevron-right" aria-hidden="true">
</span><span class="sr-only">Next</span> </a>
</div>
<div>
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" />
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap-theme.min.css" />
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script>
<script type="text/javascript" src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>
<style type="text/css">
.carousel
{
width: 450px;
height: 200px;
max-height: 200px !important;
}
.carousel-content
{
color: black;
display: flex;
text-align: center;
}
</style>
<script type="text/javascript">
$(document).ready(function () {
$('.carousel').carousel({
interval: 1000
});
$('.item')[0].className = "item active";
});
</script>
</div>
</div>
C#
protected void Page_Load(object sender, EventArgs e)
{
if (!IsPostBack)
{
BindRepeater();
}
}
private void BindRepeater()
{
string constr = ConfigurationManager.ConnectionStrings["constr"].ConnectionString;
using (SqlConnection con = new SqlConnection(constr))
{
using (SqlCommand cmd = new SqlCommand())
{
cmd.CommandText = "SELECT [Name] ,[Description] FROM [Locations]";
cmd.Connection = con;
con.Open();
rptCarousel.DataSource = cmd.ExecuteReader();
rptCarousel.DataBind();
con.Close();
}
}
}
VB.Net
Protected Sub Page_Load(sender As Object, e As EventArgs)
If Not IsPostBack Then
BindRepeater()
End If
End Sub
Private Sub BindRepeater()
Dim constr As String = ConfigurationManager.ConnectionStrings("constr").ConnectionString
Using con As New SqlConnection(constr)
Using cmd As New SqlCommand()
cmd.CommandText = "SELECT [Name] ,[Description] FROM [Locations]"
cmd.Connection = con
con.Open()
rptCarousel.DataSource = cmd.ExecuteReader()
rptCarousel.DataBind()
con.Close()
End Using
End Using
End Sub
ScreenShot