skip to Main Content

I want to display my database image into new tab when user click on the image.

I can do it with with static images because that time I have their static image url.

But I do not have any idea about how to do it with dynamic images.

Please help. A warm thanks in advance😁

This is my C# code – File1.aspx:

<asp:ListView ID="ListView1" runat="server" DataSourceID="SqlDataSource1">
     <ItemTemplate>
         <div class="independence">
             <figure class="column">
                 <asp:ImageButton CssClass="inimg" ID="Image1" OnClick="Image1_Click" runat="server" ImageUrl='<%# Eval("Picture","Admin/AdminGallery/Events/{0}") %>' />
             </figure>
         </div>
     </ItemTemplate>
</asp:ListView>

File1.cs:

protected void Image1_Click(object sender, ImageClickEventArgs e)
{
    Response.Redirect();
}

2

Answers


  1. try this then.

    protected void Page_Load() {
        this.Form.Target = "_blank"; 
    }
    
    Login or Signup to reply.
  2. You can do it this way:

    First, the markup for the ListView:

    <asp:ListView ID="ListView1" runat="server" DataKeyNames="ID" >
        <ItemTemplate>
            <tr style="">
                <td><asp:Label ID="FighterLabel" runat="server" Text='<%# Eval("Fighter") %>' /></td>
                <td><asp:Label ID="EngineLabel" runat="server" Text='<%# Eval("Engine") %>' /></td>
                <td><asp:Label ID="ThrustLabel" runat="server" Text='<%# Eval("Thrust") %>' /></td>
                <td><asp:Label ID="DescriptionLabel" runat="server" Text='<%# Eval("Description") %>' /></td>
                <td>
                <asp:ImageButton ID="ImageView" runat="server" Width="200px"
                    ImageUrl='<%# Eval("ImagePath") %>'
                    OnClick='<%# $@"window.open(""ViewFighter.aspx?ID={Eval("ID")}"")" %>'
                    />
                </td>
            </tr>
        </ItemTemplate>
        <LayoutTemplate>
            <table id="itemPlaceholderContainer" runat="server" class="table table-hover">
                <tr runat="server" style="">
                    <th runat="server">Fighter</th>
                    <th runat="server">Engine</th>
                    <th runat="server">Thrust</th>
                    <th runat="server">Description</th>
                    <th runat="server">View</th>
                </tr>
                <tr id="itemPlaceholder" runat="server">
                </tr>
            </table>
        </LayoutTemplate>
    </asp:ListView>
    

    And code behind to load up the ListView data:

        protected void Page_Load(object sender, EventArgs e)
        {
            if (!IsPostBack)
                LoadData();
        }
    
        void LoadData()
        {
            ListView1.DataSource = General.MyRst("SELECT * FROM Fighters ORDER BY Fighter");
            ListView1.DataBind();   
        }
    

    And the result is now this:

    enter image description here

    And the target page ViewFighter.aspx has this markup:

            <h3 id="myheading" runat="server"></h3>
    
            <asp:Image ID="Image1" runat="server" Width="80%" />
    

    And code behind assumes a URL with ID having been passed.

    e.g., this: ViewFighter.aspx?ID=3
    

    So, code behind for this target page is:

       protected void Page_Load(object sender, EventArgs e)
        {
            if (!IsPostBack)
            {
                if (Request.QueryString["ID"] != null)
                {
                    int PK = Convert.ToInt32(Request.QueryString["id"]);
                    SqlCommand cmdSQL = new SqlCommand("SELECT * FROM Fighters WHERE ID = @ID");
                    cmdSQL.Parameters.Add("@ID",SqlDbType.Int).Value = PK;
                    DataRow rFigher = General.MyRstP(cmdSQL).Rows[0];
                    myheading.InnerText = rFigher["Fighter"].ToString();
                    Image1.ImageUrl = rFigher["ImagePath"].ToString();
                }
            }
        }
    

    So, you don’t have to actually write a JavaScript function, but the image button does require what amounts to code as an JavaScript expression. That JavaScript code opens a new tab, and redirects the page to open ViewFighter.aspx in a new tab.

    Above assumes an image path is stored in the database. However, the above approach would also work fine if the actual image was stored in the database column as opposed to an image path.

    If you are storing a raw binary image in the database column, then I can add a few lines of code to above that demonstrates how the image could come from the database, and not using a path. (just ask in the comments, and I post additional code).

    In above, I used 2 global helper routines that returns a data table from given SQL text, or SQL passed with a SqlCommand object.

    Those 2 routines are:

        public static DataTable MyRst(string strSQL, string sConn = "")
        {
            DataTable rstData = new DataTable();
    
            if (sConn == "")
                sConn = Properties.Settings.Default.TEST4;
    
            using (SqlConnection conn = new SqlConnection(sConn))
            {
                using (SqlCommand cmdSQL = new SqlCommand(strSQL, conn))
                {
                    cmdSQL.Connection.Open();
                    rstData.Load(cmdSQL.ExecuteReader());
                }
            }
            return rstData;
        }
    
    
    public static DataTable MyRstP(SqlCommand cmdSQL, string sCon = "")
    {
        DataTable rstData = new DataTable();
        if (sCon == "")
            sCon = Properties.Settings.Default.TEST4;
    
        using (SqlConnection conn = new SqlConnection(Properties.Settings.Default.TEST4))
        {
            using (cmdSQL)
            {
                cmdSQL.Connection = conn;
                conn.Open();
                rstData.Load(cmdSQL.ExecuteReader());
            }
        }
        return rstData;
    }
    
    Login or Signup to reply.
Please signup or login to give your own answer.
Back To Top
Search