Jack Martin-Jones
Jack Martin-Jones

Reputation: 49

Image Preview from on click event c# asp .net

I'm currently trying to look at a directory, and then preview a .jpeg from a list box. I have the list box populating with the contents of the directory and only showing Jpegs, but I can't think of what to do to get the jpeg preview in a picture box. I'm using an asp .net application on Visual Studio 2010.

This is the code I have

    public partial class _Default : System.Web.UI.Page
{
    protected void Page_Load(object sender, EventArgs e)
    {
        DirectoryInfo infoDir = new DirectoryInfo(@"G:\Test_Directory");            
        FileInfo[] infoFile = infoDir.GetFiles("*.jpeg");
        foreach( FileInfo file in infoFile )
        {
        lstDirectory.Items.Add(file.Name);
        }                    
    }

    protected void lstDirectory_SelectedIndexChanged(object sender, EventArgs e)
    {
    }
}

I'm under the understanding Postback needs to be used. If anyone is able to help, that would be great.

The file which is in the G: Drive, is a jpeg, which can be seen in the list box is : jpegimage.jpeg

Thanks.

Upvotes: 2

Views: 794

Answers (1)

Ann L.
Ann L.

Reputation: 13965

How about something like this?

I think you could do this mostly in Javascript, with two additional ASP.NET page.

  1. First, create a new web page. We'll call this A.aspx. This page will be passed the image name in the query string. It will be very simple: it will just fetch the contents of the file from "G:\TestDirectory" and write it to the Response stream. There are quite a few questions and answers on Stack Overflow on how to do this, if you haven't done it before.

  2. Then, create another web page. We'll call this B.aspx. This will have an image control with height and width set appropriately. It will also take the image name from its query string. The code-behind will build a URL to use as the ImageSource property on the image control. The URL will be that of A.aspx, with the (URL-encoded) image name appended as a parameter.

  3. On your ASP.NET page, hook up an event handler to your listbox. When the selected index on the list box changes, on the client side, build a URL, based on the URL to B.aspx with the image name from the list box appended as a parameter. Then open a window, using the URL you just built, pointing to B and passing the desired file name.

So: when the list box selected index changes (or when you double click, or whatever event you pick), the javascript will open a window with page B.aspx. Page B will have an image control, set to the URL to A.aspx. A.aspx will stream the image contents to the image control, which will appear in your new window.

Upvotes: 1

Related Questions