Display image in Image control based on TextBox value using C# and VB.Net in ASP.Net

Last Reply on Jun 16, 2017 03:08 AM By dharmendr

Posted on Jun 16, 2017 02:47 AM

https://www.aspsnippets.com/Articles/Display-image-in-Image-control-based-on-DropDownList-selection-in-ASPNet.aspx


I am using this code as reference to display Flags of Different Countries

I want to display image like

Step1.Type Image name in Textbox,
Step2. Upload Image in database in binary format

Step 3. Finally While displaying it SHOULD display particular image ONLY when I type the image name in the textbox instead of direct dropdown selection.


Kindly help to attain this type instead of dropdown Selection.

Posted on Jun 16, 2017 03:08 AM

Hi MKR,

Refer the below sample code which full-fill your requirement.

HTML

<asp:TextBox runat="server" ID="txtImages" OnTextChanged="FetchImage" AutoPostBack="true" />
<hr />
<asp:Image ID="Image1" runat="server" Visible="false" />

C#

private DataTable GetData(string query)
{
    DataTable dt = new DataTable();
    string constr = ConfigurationManager.ConnectionStrings["constr"].ConnectionString;
    using (SqlConnection con = new SqlConnection(constr))
    {
        using (SqlCommand cmd = new SqlCommand(query))
        {
            using (SqlDataAdapter sda = new SqlDataAdapter())
            {
                cmd.CommandType = CommandType.Text;
                cmd.Connection = con;
                sda.SelectCommand = cmd;
                sda.Fill(dt);
            }
        }
        return dt;
    }
}

protected void FetchImage(object sender, EventArgs e)
{
    string name = txtImages.Text.Trim();
    Image1.Visible = name != "";
    if (name != "")
    {
        DataTable dt = GetData("SELECT Data FROM tblFiles WHERE Name ='" + name + "'");
        if (dt.Rows.Count > 0)
        {
            byte[] bytes = (byte[])dt.Rows[0]["Data"];
            string base64String = Convert.ToBase64String(bytes, 0, bytes.Length);
            Image1.ImageUrl = "data:image/png;base64," + base64String;
        }
        else
        {
            Image1.ImageUrl = "";
            Image1.AlternateText = "No image present in database with the name";
        }
    }
}

VB.Net

Private Function GetData(query As String) As DataTable
    Dim dt As New DataTable()
    Dim constr As String = ConfigurationManager.ConnectionStrings("constr").ConnectionString
    Using con As New SqlConnection(constr)
        Using cmd As New SqlCommand(query)
            Using sda As New SqlDataAdapter()
                cmd.CommandType = CommandType.Text
                cmd.Connection = con
                sda.SelectCommand = cmd
                sda.Fill(dt)
            End Using
        End Using
        Return dt
    End Using
End Function
Protected Sub FetchImage(sender As Object, e As EventArgs)
    Dim name As String = txtImages.Text.Trim()
    Image1.Visible = name <> ""
    If name <> "" Then
        Dim dt As DataTable = GetData((Convert.ToString("SELECT Data FROM tblFiles WHERE Name ='") & name) + "'")
        If dt.Rows.Count > 0 Then
            Dim bytes As Byte() = DirectCast(dt.Rows(0)("Data"), Byte())
            Dim base64String As String = Convert.ToBase64String(bytes, 0, bytes.Length)
            Image1.ImageUrl = Convert.ToString("data:image/png;base64,") & base64String
        Else
            Image1.ImageUrl = ""
            Image1.AlternateText = "No image present in database with the name"
        End If
    End If
End Sub