c# - Select all images using ASP.NET

Question

I am new to ASP.NET and C#. I am trying to retrieve all images from folder and show it on page, but it's only selecting one image.

My ASP.NET code:

<form id="form1" runat="server" class="col-lg-5">            
    <asp:Image ID="Image" runat="server" />
</form>

My C# 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 Blog
{
    public partial class index : System.Web.UI.Page
    {
        SqlConnection con = new SqlConnection(ConfigurationManager.ConnectionStrings["blogconnection"].ToString());
        protected void Page_Load(object sender, EventArgs e)
        {
            con.Open();
            string allimage;
            string qry="select * from images";
            SqlCommand cmd = new SqlCommand(qry, con);
            SqlDataReader dr =cmd.ExecuteReader();

            if (dr.HasRows)
            {
                while(dr.Read())
                {
                   if (!string.IsNullOrEmpty(Convert.ToString(dr["Image_Path"])))
                   {                                             
                        Image.ImageUrl = Convert.ToString(dr["Image_Path"]);                                         
                   }
                }
           }
           con.Close();
       }               
    }
}

What I want: I want to select all image which path is store in sql table.

Additional: is there a way to select videos from folder which path is store in sql, mean to select videos and images from different folder and show both on same page by date specified or by latest upload etc.

Any help will be appreciated.

Edit #1

In php i use the below code to get all images and show it, is there any thing equivalent to the below code in ASP.NET?

PHP Code

<?php
include 'conn.php';
$smt=$conn->prepare('SELECT * FROM post');
$smt->execute();

?>
<?php include 'header.php';

?>
<div class="">
<?php
if(isset($_SESSION['user']))
{
include 'nav.php';
}
else
{
include 'nav-simple.php';
}
?>
<?php include 'slider.php';?>

<?php include 'right_sidebar.php';?>

    <div class="col-md-1 top_space"></div>
<div class="container col-md-8 main-container-top">


    <br/>

<div class="">
    <?php while ($gdata = $smt->fetch(PDO::FETCH_OBJ)): ?>
        <a href="#" class="col-md-4"><img src="posts/<?php echo $gdata->Post_Path; ?>" alt="image" class="post-image"/></a>
        <div class="media-body col-md-8 post pull-left">
            <div class="post-overview">
                <ul>
                    <li class="post-category"><?php echo $gdata->Category; ?></li>
                    <li class="post-timestemp">Post on <?php echo $gdata->Post_Date; ?></li>
                </ul>


                <a href="post-description.php?id=<?php echo $gdata->Id ?>"><h4
                        class="media-heading h4"><?php echo $gdata->Title; ?></h4></a>

                <p class="post-text"><?php echo $gdata->Post; ?></p><br/>
            </div>


        </div>
<div class="post-image-space"></div>
    <?php endwhile;?>

Answer 1

In the code behind write your Collection() method to retrieve images as a List of Strings like this (Also it is better to use Using statements):

protected IEnumerable<string> Collection()
{
     string address = ConfigurationManager.ConnectionStrings["blogconnection"].ToString();
     using (SqlConnection con = new SqlConnection(address))
     {
         con.Open();
         string qry = "select * from images";
         SqlCommand cmd = new SqlCommand(qry, con);
         using (SqlDataReader dr = cmd.ExecuteReader())
         {
             if (!dr.HasRows) return allimage;
             while (dr.Read())
             {
                 if (!string.IsNullOrEmpty(Convert.ToString(dr["Image_Path"])))
                 {
                     yield return (dr["Image_Path"].ToString());
                 }
              }
          }
      }
}

Then either you can use asp:Repeater like this:

<asp:Repeater ID="Repeater1" runat="server" DataSourceID="imgCats">
      <ItemTemplate>
         <div>
            <img src='<%# Container.DataItem.ToString() %>' alt="" />
         </div>                  
      </ItemTemplate>
</asp:Repeater>
<asp:ObjectDataSource ID="imgCats" runat="server" SelectMethod="Collection" 
          TypeName="WebApplication1.WebForm8">
</asp:ObjectDataSource>

Or you can do it like this:

<form id="form1" runat="server" class="col-lg-5">
  <div>
    <ul>
        <% var drc = Collection();
           foreach (var item in drc)
           { %>
            <li>
                <img src="<%: item %>"/>
            </li>
        <% } %>
    </ul>
  </div>
</form>