JQuery :: How To Get Images From Database For Image Slider
Nov 30, 2010
I am using jquery image slider on my website, what I want is to get the images from the sql server table, presently the images are included in the project , see below for the code:
Is there anyway of handling images from database to jquery image swapper or any other type of image swapper. the images should be populated depending on the number of images generated from the databse. I can get all the images from the databse but I cant find a way to show those images on the jquery image swapper. I can display all the images by using datalist but with data list i cant use the jquery image swapper.
protected void showDetails(int makeID) { conn.Open(); SqlCommand cmd = new SqlCommand("Select Price,image,make from productDetail Where (makeID LIKE @makeID)" , conn); SqlParameter param = new SqlParameter(); param.ParameterName = "@makeID";
I put a jquery range slider (a 2-handled slider) on a page and am able to access its two values as needed. Works like a champ! The requirements just changed - now the range needs to be fixed. So as one handle slides, the other needs to slide with it. Or at least re-position itself after the other slider is dropped into it new position. Does that make sense? I'm still really weak with javascript, so go gently with me
I want to create a product sale page. The sale page will have images of products generated from sql server database with their price and name. When a user clicks on a specific image, it should navigate to another page with more images and details of that particular product. I just dunno which control to use to display images on the sale page. Also the admin can add products with images, therfore when they add new product , that product should come the first on the sale page. I can acheive that just by writing a simple query , but i dont know what should i use to display images. I cant use image buttons coz the images can be more than 50 depends, nor i can use grid view for images. I am using asp.net and sql server 2008.
i have to modify the thumbnail width and height as well as main center image and height. then the thumbnail list displays images with a small portion of mail image.i want to display thw hole image with reduced size inside the thumbnails.
I've implemented WebForms Routing (using ASP.NET 3.5 SP1) and have a routed page that uses the AJAX Control Toolkit Slider control. The handle image doesn't always display, depending on the depth of the URL. I believe it may be something to do with the image being and embedded resource accessed via webresource.axd.
For example:
www.myapp.com/tours - will display the handle image www.myapp.com/tours/london - doesn't display it.
My routing is configured as such:
[Code]....
On viewing the HTML source the actual image is rendered as:
[Code]....
Been hitting my head against a brick wall with this for days?
i have encountered a problem on how to load the database images to be display in the Image content in the web pages. I am currently using an Access database with a table "Images" and there are 4 columns in it. "ImageID", "ImageDescription","ImageofPicture","Description". Below is my code: Words highlighted in bold is where the problem occurs. No image is display in the Image box but theres a red cross at the top left. Image description is displaying fine in the textboxes
int MaxRows = 0; int inc = 0; int inc1 = 1; int inc2 = 2; int inc3 = 3; System.Data.OleDb.OleDbConnection cs; System.Data.OleDb.OleDbDataAdapter dta; DataSet ds1; byte[] photo_array; protected void Page_Load(object sender, EventArgs e) { cs = new System.Data.OleDb.OleDbConnection(); //tell the program where the database is located cs.ConnectionString = "Provider=Microsoft.Jet.OleDb.4.0;Data Source=C:\Users\Admin\Desktop\Website1\App_Data\Database.mdb"; ds1 = new DataSet(); string sql = "SELECT * From Images ORDER BY ImageDescription ASC"; dta = new System.Data.OleDb.OleDbDataAdapter(sql, cs); cs.Open(); dta.Fill(ds1, "Images"); Navigation(); //MaxRows equals to the total amount of records from the database MaxRows = ds1.Tables["Images"].Rows.Count; } private void Navigation() { //get the first records from the database DataRow dtaRow = ds1.Tables["Images"].Rows[inc]; //get column values in the row TextBox3.Text = dtaRow.ItemArray.GetValue(1).ToString(); TextBox7.Text = dtaRow.ItemArray.GetValue(3).ToString(); DataRow dtaRow1 = ds1.Tables["Images"].Rows[inc1]; TextBox4.Text = dtaRow1.ItemArray.GetValue(1).ToString(); TextBox2.Text = dtaRow1.ItemArray.GetValue(3).ToString(); DataRow dtaRow2 = ds1.Tables["Images"].Rows[inc2]; TextBox5.Text = dtaRow2.ItemArray.GetValue(1).ToString(); TextBox8.Text = dtaRow2.ItemArray.GetValue(3).ToString(); DataRow dtaRow3 = ds1.Tables["Images"].Rows[inc3]; TextBox6.Text = dtaRow3.ItemArray.GetValue(1).ToString(); TextBox9.Text = dtaRow3.ItemArray.GetValue(3).ToString(); //if 3rd column value is not null if (ds1.Tables[0].Rows[inc][2] != System.DBNull.Value) { Image5.ImageUrl = "ImageHandler.ashx?ImageDescription=" + TextBox3.Text; } if (ds1.Tables[0].Rows[inc1][2] != System.DBNull.Value) { Image5.ImageUrl = "ImageHandler.ashx?ImageDescription=" + TextBox4.Text; } if (ds1.Tables[0].Rows[inc2][2] != System.DBNull.Value) { Image5.ImageUrl = "ImageHandler.ashx?ImageDescription=" + TextBox5.Text; } if (ds1.Tables[0].Rows[inc3][2] != System.DBNull.Value) { Image5.ImageUrl = "ImageHandler.ashx?ImageDescription=" + TextBox6.Text; } } } Code for ImageHandler.ashx: using System; using System.Web; using System.Data.OleDb; public class ImageHandler : IHttpHandler { public void ProcessRequest (HttpContext context) { string qry = "SELECT ImageofPicture FROM Images WHERE ImageDescription = ?"; string connect = "Provider=Microsoft.Jet.OleDb.4.0;Data Source=C:\Users\Admin\Desktop\Website1\App_Data\Database.mdb"; using (OleDbConnection conn = new OleDbConnection(connect)) { if (context.Request.QueryString["id"] != null) { OleDbCommand cmd = new OleDbCommand(qry, conn); cmd.Parameters.AddWithValue("", context.Request.QueryString["id"]); conn.Open(); using (OleDbDataReader rdr = cmd.ExecuteReader()) { if (rdr.HasRows) { rdr.Read(); context.Response.ContentType = "image/jpeg"; context.Response.BinaryWrite((byte[])rdr["ImageofPicture"]); } } } } } public bool IsReusable { get { return false; }
I am unsure on how to perform this task, what i need to do is make a gallery with tagging. I need this as it is a requirement for the project. Each user will have there own gallery and be able to upload and delete images from there gallery. I already know how to insert and select images from a database. I will then display the gallery using a data repeator with paging, I am sure i can google an article for data repeator with paging.
My challenge is, when the user wants to save a image to there gallery, he must 1st upload the image and then i must some how display the image, when the image is displayed, i will have a text box where they can add tags, this textbox will save in the tag table for that user_id, picture_id and the tag will have an id also. I am unsure on how to do this When he clicks save, i wanna insert the image into the table, and the tag. If he does not click save, then nothing should be saved. Now the 2nd part.
In the data repeator, i want a modal window to popup when they click an image, this modal will have the image and the respective tags that where saved for this image, I am unsure how to this.
i want to use jquery lightbox but i want to read image from database.i save image path in database and i want to read them.every lightbox that i find use from static image.
I have a script for infinie paging data where one of the items i return is an image, not text. Right now I am returning as text. return as the html or asp image? The line I need to fix and can use the logic for other is ==$(".msgpic", table).html(customer.find("MsgPicture").text()); == See code...
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script> <script type="text/javascript"> var pageIndex = 1; var pageCount;
I have read and referred your range slider and loading infinite images on scroll.The issue is when combining both the article the data is appending to old one.
I want to display an image, be-able to drag small images on to the large image and then save the new image. Image having a photo as an image and wanting to put number blobs on and each number blob refers to a piece of text almost like labelling photo. I know how to drag and drop images using jquery but not sure how I would save the thing as a new image.
when i click the picture that is displayed in the detailsView ImageField, the jquery lightbox pops up, but does not show the picture. it shows a red x in the middle of the lightbox. the same thing happens with the asp:Image control shown in the code below. The picture is stored in a SQL database Image datatype. Using master pages.
On my page I have textbox in which user enters value. When 3 values are entered the autocomplete panel shows.In the panel the names and surnames of all available people are shown bassed on the value user enters. Bellow each name and surname is picture of each "candidate". However images are stored on another server (using https "protection") and some people don't have picture.
onerror="this.onerror=null;this.src='../Pics/Errors/NoPic.jpg'" into <img> tags in Web Handler.
I have already asked this same questions but for different problem.I have to rotate a droped clone image.The problem is rotation is working,but its not rotating at the same place,its moving to corner of my page / somtimes to the corner of Panel.
I want to display images in the Gridview from the image folder in this way:
But without saving the image location in the Database (i.e;i want to do this using the System.IO)
I can fetch the names of all the images present in the "img" folder but my problem is i cant set the src of the <img> tag properly which would display the image here is what i did: