Displaying images in a web form
-
Hello I have always had a problem with this and have never managed to get it right. I am creating a shopping application and have many pictures that l want to display in a web form inside a datagrid. I want to have the path of the picture in the database (SQL Server). Someone told me to have all the pictures a folder called images, which l have done. But where about do l put this folder. I never been able to get this right, can someone show me step by step on how to do this. I only need the bare minium code and help. Many thanks in advance, Steve
-
Hello I have always had a problem with this and have never managed to get it right. I am creating a shopping application and have many pictures that l want to display in a web form inside a datagrid. I want to have the path of the picture in the database (SQL Server). Someone told me to have all the pictures a folder called images, which l have done. But where about do l put this folder. I never been able to get this right, can someone show me step by step on how to do this. I only need the bare minium code and help. Many thanks in advance, Steve
I just had to solve this problem at work. Basically, you have two ways to do this. One, which "someone" told you to do, is to store the images in a folder on your web server then store a link to their location in the database which you can then slip into an IMG tag in the code. The other way is to actually store the images into the database then retrieve them accordingly. There are advantages and disadvantages to each method. To boil them down, storing the images in a database means faster retrieval and display for your web page and easier administration (especially in server farms), but it also means higher database server load and greater complexity in the system. To perform the latter, you must first get the images into the database. One way to do this is to use an upload control and convert its uploaded file into byte format. That byte stream, in the form of a Byte variable, can then be stored into the SQL Server database's image datatype field via an update or insert query or through a stored procedure, just like any other data. To retrieve the image is a bit tricky. Basically, you need another page. The way I did it was to retrieve the image through a query into a Byte variable in PageA. Then, I saved that variable into a session variable that I could access from PageB. In PageB's code, I set its content type to JPEG (or whatever type your image is), then I simply wrote the Byte variable into the page with Response.Write. I displayed PageB in PageA with an IFRAME. You'll have to adapt the technique slightly to display the images in a datagrid, but I don't expect it'll be too difficult to figure out. You could store all your images in an array as a session variable, then pass some sort of identifier to your PageB so it can access the correct image within the array to write it out. The only concern I might have in this scenario would be server memory - too many or too large pictures would be a big load. I would provide code snippets, but that's all at work and I don't have access to it.
-
I just had to solve this problem at work. Basically, you have two ways to do this. One, which "someone" told you to do, is to store the images in a folder on your web server then store a link to their location in the database which you can then slip into an IMG tag in the code. The other way is to actually store the images into the database then retrieve them accordingly. There are advantages and disadvantages to each method. To boil them down, storing the images in a database means faster retrieval and display for your web page and easier administration (especially in server farms), but it also means higher database server load and greater complexity in the system. To perform the latter, you must first get the images into the database. One way to do this is to use an upload control and convert its uploaded file into byte format. That byte stream, in the form of a Byte variable, can then be stored into the SQL Server database's image datatype field via an update or insert query or through a stored procedure, just like any other data. To retrieve the image is a bit tricky. Basically, you need another page. The way I did it was to retrieve the image through a query into a Byte variable in PageA. Then, I saved that variable into a session variable that I could access from PageB. In PageB's code, I set its content type to JPEG (or whatever type your image is), then I simply wrote the Byte variable into the page with Response.Write. I displayed PageB in PageA with an IFRAME. You'll have to adapt the technique slightly to display the images in a datagrid, but I don't expect it'll be too difficult to figure out. You could store all your images in an array as a session variable, then pass some sort of identifier to your PageB so it can access the correct image within the array to write it out. The only concern I might have in this scenario would be server memory - too many or too large pictures would be a big load. I would provide code snippets, but that's all at work and I don't have access to it.
Hello Tantiboh, Thanks for you long reply. The way I would perfer to do this is store the images in a folder rather than in the database itself. I am still working out how to do this. But l think l am getting close to a solution. If you have any code snippets, I would be most grateful. Thanks in advance, Steve
-
Hello Tantiboh, Thanks for you long reply. The way I would perfer to do this is store the images in a folder rather than in the database itself. I am still working out how to do this. But l think l am getting close to a solution. If you have any code snippets, I would be most grateful. Thanks in advance, Steve
If that's your chosen method, then you've picked the simpler way to do it from a programmatic standpoint. All you have to do is store the image at a specified URL on your web server, then store that URL as a varchar in the database. Then, just query the database for each URL and stick that string as the src attribute of an image tag in the web page. For example:
StringBuilder builder = new StringBuilder(); //...Set up a DataReader called i.e. datardr to read the records from your database... //...Add any html text you want to with builder.Append()... while datardr.Read() { builder.Append(" "); //where [n] is the index of the column containing the image's URL } //Then you can output the HTML string contained in builder any way you want, for example: Response.Write(builder.ToString());Hope that helps!