Recently, I read about using ajax. I have this question.
can use Ajax to get image file or stream? It seems ajax only use to get text data from Database. If database has image file or image stream, can this be retrieved by Ajax?
Please kindly point me to some code example how this being done.
i don't know know why you want to get the stream directly, but you can get image easily.
at the server side, you set the response content type to 'image/jpeg' (or else), and you write the image bytes directly to the response body, at the client side, you will get the image.
Thank. I know how to access image using normal javascript. But I want to do it in Ajax. Let me explain what I want to do. I want to retrieve image which store in Database.
Want to knoe ajax object 's responseText Property. Is this property only mean for Text-base data?
In the Aspx Page : I have a textbox , button and an Image Tag(<img id="img">). I use the textbox to enter the image name, use button's Onclick event to fire the ajax code. So, I use this:
creat ajax object var xmlHttp.........
send :
xmlHttp.open("GET","image.aspx",true); <<------- The url of the aspx page to retun byte Stream
xmlHttp.send(null); }
get returned Data? How ? use xmlHttp.ResponseText?
How Do I get the returned data and assign it to Image Tag (<img id="img" >)?? since Ajax object has only responseText Property.
I'm agree with codavid's last post.
The browser will send individual request for each img tag in the html source, it's working under the hood. You won't see a refersh when the browser tries to fetch data for it.
So, simply change the src property is enough.
SkySky
Member
265 Points
177 Posts
Can use AJAX to get image file or stream?
May 06, 2007 03:07 AM|LINK
Hi,
Recently, I read about using ajax. I have this question.
can use Ajax to get image file or stream? It seems ajax only use to get text data from Database. If database has image file or image stream, can this be retrieved by Ajax?
Please kindly point me to some code example how this being done.
thanks in advance
codavid
Member
34 Points
100 Posts
Re: Can use AJAX to get image file or stream?
May 06, 2007 05:37 AM|LINK
hi,
i don't know know why you want to get the stream directly, but you can get image easily.
at the server side, you set the response content type to 'image/jpeg' (or else), and you write the image bytes directly to the response body, at the client side, you will get the image.
e.g.
<image src="youImageHandler.ashx" />
Server-side
response.contentType('image/jpeg');
response.binaryWrite(imageBytes);
SkySky
Member
265 Points
177 Posts
Re: Can use AJAX to get image file or stream?
May 06, 2007 07:39 AM|LINK
Hi ,
Thank. I know how to access image using normal javascript. But I want to do it in Ajax. Let me explain what I want to do. I want to retrieve image which store in Database.
Want to knoe ajax object 's responseText Property. Is this property only mean for Text-base data?
In the Aspx Page : I have a textbox , button and an Image Tag(<img id="img">). I use the textbox to enter the image name, use button's Onclick event to fire the ajax code. So, I use this:
creat ajax object var xmlHttp.........
send :
xmlHttp.open("GET","image.aspx",true); <<------- The url of the aspx page to retun byte Stream
xmlHttp.send(null); }
get returned Data? How ? use xmlHttp.ResponseText?
How Do I get the returned data and assign it to Image Tag (<img id="img" >)?? since Ajax object has only responseText Property.
Please help.
Thanks
codavid
Member
34 Points
100 Posts
Re: Can use AJAX to get image file or stream?
May 07, 2007 02:24 AM|LINK
the response data is text based, and i don't think you can assign the data to the image object
why you don't just assign the url of your image to the image object's 'src' property ? is that easier?
Raymond Wen ...
All-Star
32101 Points
3764 Posts
Re: Can use AJAX to get image file or stream?
May 08, 2007 05:25 AM|LINK
I'm agree with codavid's last post.
The browser will send individual request for each img tag in the html source, it's working under the hood. You won't see a refersh when the browser tries to fetch data for it.
So, simply change the src property is enough.
Hope this helps.
SkySky
Member
265 Points
177 Posts
Re: Can use AJAX to get image file or stream?
May 09, 2007 09:16 AM|LINK
hi,
BOth of your suggestion make sense. How do I set the URL to the <img> ?
<script>
//How do I set the return URL to MyImg??
// is this ok document.getElementById("MyImg").src= response;
</script>
<table>
<tr>
<td>
<img id="MyImg" src="abc.aspx">
</td>
</tr>
</table>
please help
thanks
SkySky
Member
265 Points
177 Posts
Re: Can use AJAX to get image file or stream?
May 09, 2007 09:18 AM|LINK
hi,
BOth of your suggestion make sense. How do I set the URL to the <img> ?
<script>
//How do I set the return URL to MyImg??
// is this ok document.getElementById("MyImg").src= response;
</script>
<table>
<tr>
<td>
<img id="MyImg" src="abc.aspx">
</td>
</tr>
</table>
please help
thanks
Raymond Wen ...
All-Star
32101 Points
3764 Posts
Re: Can use AJAX to get image file or stream?
May 09, 2007 09:43 AM|LINK
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml" > <head> <title>Untitled Page</title> <script language="javascript" type="text/javascript"> // <!CDATA[ function Button1_onclick() { document.getElementById("img1").src ="Images/edit.gif"; } // ]]> </script> </head> <body> <input id="Button1" type="button" value="button" onclick="return Button1_onclick()" /> <img id="img1" src="Images/Add.gif" /> </body> </html>