Dynamically add
from database parameters in aspx without code behind

Question

We are trying to create a playlist of video from a database. We want to get the path of a video from the database and want to pass it to a li tag

but

We don't know how to do it with or without code-behind technique
We just want to add dynamic lists with path parameters from a table

Response.Write function is displaying lists but at the top of the page and we wanted to display those lists in a specific div.

our code-behind code

   using System;
   using System.Collections.Generic;
   using System.Linq;
   using System.Web;
   using System.Web.UI;
   using System.Web.UI.WebControls;
   using System.Data.SqlClient;
   using System.Data;
   using System.Configuration;
   namespace videoplayer
   {
       public partial class VideoPage : System.Web.UI.Page
       {
           SqlConnection con=new     SqlConnection(ConfigurationManager.ConnectionStrings["conn"].ConnectionString);
            //protected void Page_Load(object sender, EventArgs e)
            //{

            //}

            public void getdata()
            {
                String html=string.Empty;
                string a = string.Empty;
                string b = string.Empty;
                con.Open();
                SqlCommand cmd = new SqlCommand("Select Filename from VideoFile", con);
                SqlDataReader dr = cmd.ExecuteReader();

                while (dr.Read())
                {
                    html += "<li data-address='local9' class='playlistNonSelected' data-type='local' data-mp4Path='../media/video/1/main/02.mp4' data-ogvPath='../media/video/1/main/02.ogv' data-webmPath='../media/video/1/main/02.webm' data-imagePath='../media/video/1/main/02.jpg' data-description='<span class='infoTitle'>Nulla mauris justo</span><br><br>Aenean egestas. Donec vel sapien ultrices lorem laoreet viverra. Curabitur molestie gravida nisi. Vivamus elementum scelerisque lectus. Etiam interdum, nisi vel adipiscing gravida, leo tortor placerat ipsum, a eleifend velit tortor id ligula. Etiam quis leo a velit mollis vestibulum. Morbi consequat, odio eget feugiat mollis, enim erat dignissim ipsum, eget vehicula sapien metus non massa. Aliquam aliquet sagittis ligula. Sed adipiscing sodales ipsum. Mauris orci ligula, commodo vitae, commodo in, tempor eu, urna. Etiam justo ipsum, gravida vitae, tristique sed, porttitor ac, ipsum. Maecenas elit lectus, elementum id, fermentum eget, accumsan ac, quam. Duis lacinia urna ac nisi. Cras bibendum. In hac habitasse platea dictumst. Morbi iaculis volutpat dui. Pellentesque non leo.;<a href='' target='_blank'>Link</a>'<div class='playlistThumb'><img class='thumb' src='../media/video/1/preview/02.jpg' width='120' height='68' alt=''/></div><div class='playlistInfo'><p><span class='playlistTitle'>Video title goes here</span><br><span class='playlistContent'>Commodo vitae, commodo in, tempor eu, urna. Etiam justo ipsum maecenas nec tellus.</span></p></div></li>";
                    Response.write(html);
            }
           con.Close();
         }
      }
   }

This is my aspx code

<div class="playlistData">
  <ul id='playlist1' data-address="playlist1">
    <script language="c#" runat="server" id="123">
       public void Page_Load(object sender, EventArgs e)
         {
           getdata();
          }
    </script>
  <ul>

I cannot understand your problem as it is not well explained. You should describe better what you have done and what is not working. — Telmo Silva, Oct 12 '15 at 10:04
CSS is used to put colors and form on your markup (HTML). It has no connection to your database. I would guess you're using ASP.NET in some form. You need to get that code to communicate with your database and then display it in HTML. — Hydrospanners, Oct 12 '15 at 10:55
@Hydrospanners i just want to get path of a video from database and want to display it in a list, on specific div. i was using response.write which is displaying at top of the page and it is not inheriting specific div's css properties when i print it to html.. — Hardik Patil, Oct 12 '15 at 11:18
Don't use `Response.Write` in a Web Forms page, you won't have control over where the output ends up. Instead, use some control such as a Repeater and bind your data to the Repeater. — mason, Oct 12 '15 at 13:54

score 1 · Answer 1 · answered Oct 12 '15 at 13:51

Try this: c#

using System;
using System.Configuration;
using System.Data.SqlClient;
using System.Text;
using System.Web.UI.WebControls;

namespace videoplayer
{
    public partial class VideoPage : System.Web.UI.Page
    {
        SqlConnection con = new SqlConnection(ConfigurationManager.ConnectionStrings["conn"].ConnectionString);

        protected void Page_Load(object sender, EventArgs e)
        {
            getdata();
        }

        private void getdata()
        {
            StringBuilder htmlBuilder = new StringBuilder();
            string a = string.Empty;
            string b = string.Empty;
            con.Open();
            SqlCommand cmd = new SqlCommand("SELECT Filename FROM VideoFile", con);
            SqlDataReader dr = cmd.ExecuteReader();

            while (dr.Read())
            {
                htmlBuilder.AppendLine("<li data-address='local9' class='playlistNonSelected' data-type='local' data-mp4Path='../media/video/1/main/02.mp4' data-ogvPath='../media/video/1/main/02.ogv' data-webmPath='../media/video/1/main/02.webm' data-imagePath='../media/video/1/main/02.jpg' data-description='<span class='infoTitle'>Nulla mauris justo</span><br><br>Aenean egestas. Donec vel sapien ultrices lorem laoreet viverra. Curabitur molestie gravida nisi. Vivamus elementum scelerisque lectus. Etiam interdum, nisi vel adipiscing gravida, leo tortor placerat ipsum, a eleifend velit tortor id ligula. Etiam quis leo a velit mollis vestibulum. Morbi consequat, odio eget feugiat mollis, enim erat dignissim ipsum, eget vehicula sapien metus non massa. Aliquam aliquet sagittis ligula. Sed adipiscing sodales ipsum. Mauris orci ligula, commodo vitae, commodo in, tempor eu, urna. Etiam justo ipsum, gravida vitae, tristique sed, porttitor ac, ipsum. Maecenas elit lectus, elementum id, fermentum eget, accumsan ac, quam. Duis lacinia urna ac nisi. Cras bibendum. In hac habitasse platea dictumst. Morbi iaculis volutpat dui. Pellentesque non leo.;<a href='' target='_blank'>Link</a>'<div class='playlistThumb'><img class='thumb' src='../media/video/1/preview/02.jpg' width='120' height='68' alt=''/></div><div class='playlistInfo'><p><span class='playlistTitle'>Video title goes here</span><br><span class='playlistContent'>Commodo vitae, commodo in, tempor eu, urna. Etiam justo ipsum maecenas nec tellus.</span></p></div></li>");
            }

            con.Close();

            Literal lit = new Literal();
            lit.Text = htmlBuilder.ToString();
            PlaceHolder1.Controls.Add(lit);
        }
    }
}

aspx file: add a PlaceHolder

<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="VideoPage.aspx.cs" Inherits="videoplayer.VideoPage" %>

<!DOCTYPE html>

<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <title></title>
</head>
<body>
    <form id="form1" runat="server">
        <div class="playlistData">
            <ul id='playlist1' data-address="playlist1">
                <asp:PlaceHolder ID="PlaceHolder1" runat="server"><asp:PlaceHolder>
            </ul>
        </div>
    </form>
</body>
</html>

mason · Answer 2 · 2015-10-12T14:24:41.363

Take advantage of Web Forms data binding. Below, we'll fetch the data from the database into a DataTable (which is simply an in-memory representation of some data) and then we'll bind that DataTable to a Repeater. A Repeater is control that has a template defined, that will render the template to HTML for each item in the collection bound to it.

Also, you need to wrap your SqlConnection in a using statement to ensure it gets disposed of properly.

public partial class VideoPage : System.Web.UI.Page
{
    public void getdata()
    {
        DataTable dt = new DataTable();
        using(SqlConnection con = new SqlConnection(ConfigurationManager.ConnectionStrings["conn"].ConnectionString))
        {
            SqlCommand cmd = new SqlCommand("Select Filename from VideoFile", con);
            con.Open();                
            dt.Load(cmd.ExecuteReader());
        }
        VideoRepeater.DataSource = dt;
        VideoRepeater.DataBind();
    }
}

ASPX

<ul>
    <asp:Repeater id="VideoRepeater" runat="server">
        <ItemTemplate>
            <!-- You could do more HTML here -->
            <li><%# Eval("Filename") %></li>
        </ItemTemplate>
    </asp:Repeater>
</ul>

The advantage of this technique over the one shown by @krlzlx is that all your HTML will be in the ASPX page instead of embedded as a string inside your C# code. So it's easier to deal with quotes, and Visual Studio can tell you if you have any syntax errors. It also keeps your logic nice and tidy, and you can more easily split your HTML up into multiple lines and indent it, etc.

Dynamically add from database parameters in aspx without code behind

2 Answers2

Dynamically add
from database parameters in aspx without code behind