CODEWITHSUNDEEP
c#asp.net
user249375
user249375

Reputation:

Display an image from a database

I have a simple database where i have book information stored in it. 2 Fiction books and 2 category books..

For example: a technical book; name, description, isbn, author,publication,price,image

In the database i am not storing the actually image the image row just has the name of the image. for example cprog.jpeg i think in index 8

I have the image stored in the images file in the project. Now, i am displaying the books in a div rather than a gridview. which is displaying fine, except i dont know how to do the image.

My question is how can i display the correct image from the database? Keep in mind i have several images.

strBooksInCategory = "<div>";

            foreach (DataTable table in dsgrid2.Tables)
            {
                foreach (DataRow row in table.Rows)
                {
                    strBooksInCategory +=
                          "<div style=\"height:150px;\">"  
                        + "  <div style=\"border-style:solid;height:100px;width:100px;float:left;\"> Image </div>"
                        + "  <div style=\"height:110px;float:left;padding-left:10px;\">"
                        + "   <div style=\"height=auto;left-margin:10px;\">" + row[0] + "</div>"
                        + "   <div style=\"height=auto;left-margin:10px;\">" + row[1] + "</div>"
                        + "   <div style=\"height=auto;left-margin:10px;\">" + row[2] + "</div>"
                        + "   <div style=\"height=auto;left-margin:10px;\">" + row[3] + "</div>"
                        + "   <div style=\"height=auto;left-margin:10px;\">" + row[4] + "</div>"
                        + "   <div style=\"height=auto;left-margin:10px;\">" + row[5] + "</div>"
                        + " </div>"
                        + "</div>";
                    strBooksInCategory += "<div style=\"height:10px;width=100%;\"></div>";
                    //foreach (DataColumn column in table.Columns)
                    //{
                    //    strBooksInCategory += "<div style=\"border-style:solid;\">" + row[column] + "</div>";
                    //}
                }
            }
            strBooksInCategory += "</div>";

Here is my function on how i am retiriving the data from the database:

private DataSet GetDataSet2()
    {
        // SQLiteConnection sqlite = new SQLiteConnection("Data Source=/path/to/file.db");
        //SQLiteConnection sqlite = new SQLiteConnection( "Data Source=" + Server.MapPath(@"~\App_Data\bookDB.db"));
        // SQLiteDataAdapter ad;

        string cid = Server.UrlDecode(Request.QueryString["Category"]);
        //string Cname = Request.QueryString["CategoryDescription"];
        lblCategory.Text = cid;
        DataSet ds2 = new DataSet();
        // this.TextBox1.Text = cid;

        String connectionString = "Data Source=" + Server.MapPath(@"~\App_Data\bookDB.db");
        String selectCommand = String.Format("Select * from Book where CategoryName = '{0}'", Request.QueryString);
        SQLiteConnection myConnection = new SQLiteConnection();
        myConnection.ConnectionString = connectionString;
        myConnection.Open();
        SQLiteDataAdapter dataAdapter = new SQLiteDataAdapter(selectCommand, myConnection);

        myConnection.Close();
        // DataSet ds = new DataSet();
        dataAdapter.Fill(ds2);
        return ds2;
    }

Here is what the page looks like so far using the above code to display my 2 books in div

enter image description here

Upvotes: 1

Views: 668

Answers (4)

Ravi Gadag
Ravi Gadag

Reputation: 15861

use html image tag, , mention src property with filename which is returned by dataset. and one more thing don use Select * from Use only column name which are required, which makes more secured.

Suggestion for this

  1. Store all FileName with GUID, so that they will be unique
  2. Use "<img src='" + Your Dataset ReturnedFileName + "'/>"
  3. Also Use repeaters, which suits your scenario, instead of looping and creating,

Repeater example

Repeater Documentation

Upvotes: 0

nycdan
nycdan

Reputation: 2839

Where you have 

 + "  <div style=\"border-style:solid;height:100px;width:100px;float:left;\"> Image </div>"

You need the tag but you can still use a variable to show the correct image. Save the root path of the image directory in one variable. Then append the unique image name.

imagepath = imagedir + row[n];

Then use that in your repeating rows:

 + "<img src='" + imagepath + "' alt='' height='100' width='100'>"

You may need to work your css a bit to get it all positioned right, but this will get your dynamic images into each row.

Upvotes: 0

Ashok Padmanabhan
Ashok Padmanabhan

Reputation: 2120

I think what they are saying isdont store the images in the db. Store theimages on disk ina folder. Store just the image name in the db and then just append the image name to the path where the images are located.

Upvotes: 0

Talvalin
Talvalin

Reputation: 7889

If this is just HTML, then use <img src="url" alt="some_text"/>, where the url will be a combination of the directory where your images are stored and the image name.

Upvotes: 1

Related Questions