Could anyone please check the code?
It's working fine normally.. but It doesn't work if we run this code in IIS.
Actually, Im working on one ASP.NET Project. There is one page that a user allow to browse the image from their hard disk and upload this image to the Server. Everything is working fine except displaying the image that the user selected on IMG tag..
It would be great if anyone can help me to fix this code..
<html>
<head> <meta http-equiv="Content-Type" content="text/html; charset=windows-1252"> <META http-equiv="Pragma" content="no-cache"> <title>Image Src</title> <script lang="javascript"> function changePic(imgId,strPath) { var o = document.getElementById(imgId); var s = new String(strPath); s = s.replace("\\","/"); o.src = "file:///" + s; }
It's working fine normally.. but It doesn't work if we run this code in IIS.
[...] There is one page that a user allow to browse the image from their hard disk and upload this image to the Server
Your code can work locally but, for security reasons, the file: path won't work from a web server, that is from a page served over http:.
Thanks.
Actually, I'm working on ASP.NET project for internal use. There is one page called Employee Details that allows the users to enter new profile or update the existing profile. The users is able to update Employee Photo too. So, The updated images should be
show in Image control as soon as the user choose new photo.
The coding that I show above is working fine in IE6. but not on other.. :(
Any Idea?
Thanks.
(If this has answered your question, please click on "Mark as Answer" on this post. Thank you!)
I am sure that you either store the photo path or the photo itself in the database.......................so first the update to the databse is required.....this cannot be done by javascript....but you want an effect that the image has changed on client side............use
Microsoft's AJAX i.e.in an updatepanel put the image control & after the upload call a trigger for a pratial post back of the update panel.
>>As LudovicoVan said, you need to virtual path, to access the image file.
I guess There won't be no way to get the virtual path because the user is allowed to select any photo file in his/her machine for changing the Employee Photo.
> As I need to use this project within my office, all users who are using this project can be trusted.
It is the site to be trusted by user systems, not the reverse. Also, you were actually replacing the first back-slash only. Anyway...
Anyway, you know, I have tried it on IE6/Win98 and IE6/WinXP+SP2 and it *works*! Didn't even need to touch my security settings, but if IE7 complains, then you might try to add the site to the trusted list. However, it doesn't work in FX,
nor I guess in any non-IE browser.
I only have one final doubt, that is that it works for me because it is a plain html page, not an .aspx page. In that case, either you again might try by trusting the site in IE, or you might work-around it with an IFRAME.
Hope this helps, and please let me know if it worked for you! Thanks. -LV
mchlSync
Member
201 Points
43 Posts
Changing Image Src from JavaScript
Nov 07, 2006 05:43 AM|LINK
Could anyone please check the code?
It's working fine normally.. but It doesn't work if we run this code in IIS.
Actually, Im working on one ASP.NET Project. There is one page that a user allow to browse the image from their hard disk and upload this image to the Server. Everything is working fine except displaying the image that the user selected on IMG tag..
It would be great if anyone can help me to fix this code..
Thanks in advance.
<Img> javascript in asp.net
Regards,
Michael Sync
Silverlight MVP
Blog : http://michaelsync.net
imran.nathan...
Contributor
4615 Points
836 Posts
Re: Changing Image Src from JavaScript
Nov 07, 2006 09:25 AM|LINK
what you could do is simply put the image tag in a DIV & then change the innerHTML property of the div as follows
<div id="DIV1" style="width: 100px; position: relative; height: 100px">
<img src="" style="position: relative" /></div>
</div>
in the javascript use
var path ="/MY/images/IMG.jpg";
document.getElementById("DIV1").innerHTML="<img src='"+path+"'/>";
LudovicoVan
Star
9692 Points
1935 Posts
Re: Changing Image Src from JavaScript
Nov 07, 2006 10:13 AM|LINK
Your code can work locally but, for security reasons, the file: path won't work from a web server, that is from a page served over http:.
-LV
mchlSync
Member
201 Points
43 Posts
Re: Changing Image Src from JavaScript
Nov 07, 2006 11:09 AM|LINK
Thanks.
Actually, I'm working on ASP.NET project for internal use. There is one page called Employee Details that allows the users to enter new profile or update the existing profile. The users is able to update Employee Photo too. So, The updated images should be show in Image control as soon as the user choose new photo.
The coding that I show above is working fine in IE6. but not on other.. :(
Any Idea?
Thanks.
Regards,
Michael Sync
Silverlight MVP
Blog : http://michaelsync.net
imran.nathan...
Contributor
4615 Points
836 Posts
Re: Changing Image Src from JavaScript
Nov 07, 2006 01:14 PM|LINK
I am sure that you either store the photo path or the photo itself in the database.......................so first the update to the databse is required.....this cannot be done by javascript....but you want an effect that the image has changed on client side............use Microsoft's AJAX i.e.in an updatepanel put the image control & after the upload call a trigger for a pratial post back of the update panel.
RoamingLlama
Member
220 Points
40 Posts
Re: Changing Image Src from JavaScript
Nov 07, 2006 02:33 PM|LINK
Hello,
This is very simple to do. I have re-writen your code here:
<html> <head> <meta http-equiv="Content-Type" content="text/html; charset=windows-1252"> <META http-equiv="Pragma" content="no-cache"> <title>Image Src</title> <script lang="javascript"> function changePic(imgId,strPath) { var path = new String(strPath); path = path.replace("\\","/"); path = "file:///" + path; if(document.getElementById){ image = document.getElementById(imgId); image.setAttribute("src",path); } } </script> </head> <body> <img id="img1" height="85" src="ATT00199.jpg" width="70" border="0" /><br /> <input id="filBrowse" type="file" onChange="changePic('img1',this.value)" size="5" name="filBrowse" width="10" /> </body> </html>This code works in Firefox and IE.Dan
e_screw
All-Star
19530 Points
3894 Posts
Re: Changing Image Src from JavaScript
Nov 07, 2006 05:57 PM|LINK
As LudovicoVan said, you need to virtual path, to access the image file. File path wont work when accessing from web server.
Thanks
Electronic Screw
Website||Blog||Dub@i.net
RoamingLlama
Member
220 Points
40 Posts
Re: Changing Image Src from JavaScript
Nov 07, 2006 07:20 PM|LINK
I was under the impression that this would be running locally on his machine...in which case the above code that I posted would work.
Thanks
Dan
mchlSync
Member
201 Points
43 Posts
Re: Changing Image Src from JavaScript
Nov 08, 2006 03:20 AM|LINK
Thank you all.
>>As LudovicoVan said, you need to virtual path, to access the image file.
I guess There won't be no way to get the virtual path because the user is allowed to select any photo file in his/her machine for changing the Employee Photo.
@ RoamingLlama
Sorry. man. I have tested your code in local IIS. It's not working. I tested as the following.
As I said in previous thread, I need to deploy this project on Internal Web Server. So, it should work on Web Server also.
@LudovicoVan
>>Your code can work locally but, for security reasons, the file: path won't work from a web server, that is from a page served over http:.
As I need to use this project within my office, all users who are using this project can be trusted.
Do I need to change the security setting of IIS?
Thanks so much.
Regards,
Michael Sync
Silverlight MVP
Blog : http://michaelsync.net
LudovicoVan
Star
9692 Points
1935 Posts
Re: Changing Image Src from JavaScript
Nov 08, 2006 09:13 AM|LINK
Hello Michael,
> As I need to use this project within my office, all users who are using this project can be trusted.
It is the site to be trusted by user systems, not the reverse. Also, you were actually replacing the first back-slash only. Anyway...
Anyway, you know, I have tried it on IE6/Win98 and IE6/WinXP+SP2 and it *works*! Didn't even need to touch my security settings, but if IE7 complains, then you might try to add the site to the trusted list. However, it doesn't work in FX, nor I guess in any non-IE browser.
I have simplified the script a bit, since the replace stuff is unneeded, but have added some error handling. You can see it live here: http://julio.diegidio.name/Sandbox/LocalBrowse.htm
I only have one final doubt, that is that it works for me because it is a plain html page, not an .aspx page. In that case, either you again might try by trusting the site in IE, or you might work-around it with an IFRAME.
Hope this helps, and please let me know if it worked for you! Thanks. -LV