Gridview with images in asp.net using DataTable

Gridview with images in asp.net using DataTable/
GridView Databinding to Datatable

Step 1)Add GridView

          <asp:GridView Caption="<h3>DataBinding in GridView with Datatable</h3>" ID="GridView1" runat="server" 

            GridLines="Both" EmptyDataText="Nodatafound" Width="440px" 

            AutoGenerateColumns="false" 

             

            >

            <Columns>

                <asp:BoundField HeaderText="Serialno" DataField="SerialNo" />

                <asp:BoundField HeaderText="Brand" DataField="Brand" />

                <asp:TemplateField HeaderText="LOGO">

                    <ItemTemplate>

                        <asp:Image runat="server" AlternateText="no image found" ImageUrl='<%# Eval("BrandImage")%>' />

                    </ItemTemplate>

                </asp:TemplateField>

            </Columns>

        </asp:GridView>

Step 2) Add DataTable/Programatically construct Datatable.

        void AddDataTableColumns()

        {

            DataColumn ID = new DataColumn("SerialNo", typeof(System.Int32));

            ID.AutoIncrement = true;

            ID.AutoIncrementSeed = 1000;

            ID.AutoIncrementStep = 16;

            DataColumn BrandName = new DataColumn("Brand", typeof(System.String));

            BrandName.MaxLength = 10;

            DataColumn BrandImage = new DataColumn("BrandImage");

            BrandImage.DataType = typeof(String);

            //typeof(System.Web.UI.WebControls.Image);

            //DataColumn BrandNewImage = new DataColumn("BrandNewImage");

            //BrandImage.DataType = typeof(String);

            brandsTable.Columns.Add(ID); brandsTable.Columns.Add(BrandName); brandsTable.Columns.Add(BrandImage);

           // brandsTable.Columns.Add(BrandNewImage);

        }

        void AddDataTableRows()

        {

            DataRow row1 = brandsTable.NewRow();

            row1[1] = "Bata";

            row1[2] = convertImage("images/Bata_brand.jpg").ToString(); //"<img src='" + convertImage("images/Bata_brand.jpg")+"' alt='no image found'/>";

            //convertimagetobinary("images/Bata_brand.jpg");

            DataRow row2 = brandsTable.NewRow();

            row2[1] = "Ambassador";

            row2[2] = convertImage("~/images/Ambassador_brand.jpg"); ;

            DataRow row3 = brandsTable.NewRow();

            row3[1] = "FootIn";

            row3[2] = convertImage("~/images/footin_brand.jpg"); ;

            DataRow row4 = brandsTable.NewRow();

            row4[1] = "North Star";

            row4[2] = convertImage("~/images/North-Star_brand.jpg"); ;

            //GridView1.Columns.Add(new ImageField());

            DataRow row5 = brandsTable.NewRow();

            row5[1] = "Power";

            row5[2] = convertImage("~/images/power_brand.jpg"); ;

            brandsTable.Rows.Add(row1);

            brandsTable.Rows.Add(row2); brandsTable.Rows.Add(row3); brandsTable.Rows.Add(row4);

            brandsTable.Rows.Add(row5);

        }

Step3)  Convert  Images to  Base 64 Strings/Inline Images in ASP.NET 4.5

        string convertImage(string imagefile)

        {

            return "data:image/jpeg;base64," + System.Convert.ToBase64String(convertimagetobinary(imagefile));

        }

        byte[] convertimagetobinary(String imagefile)

        {

            System.IO.StreamReader reader = new System.IO.StreamReader(MapPath(imagefile));

            System.IO.Stream stream = reader.BaseStream;

            //System.IO.FileStream fileStream = new System.IO.FileStream(MapPath(imagefile), System.IO.FileMode.Open);

            byte[] fileContent = new byte[stream.Length];

            stream.Read(fileContent, 0, (int)stream.Length);

            return fileContent;

        }

Step 4) Bind in Page_Load event

 protected void Page_Load(object sender, EventArgs e)

        {

            AddDataTableColumns();

            AddDataTableRows();

            BindtoGridView();

        }


Here is the output