469,934 Members | 2,358 Online
Bytes | Developer Community
New Post

Home Posts Topics Members FAQ

Post your question to a community of 469,934 developers. It's quick & easy.

Compatibility for Mozilla Firefox - for div tag

15
Hi,

I am using div tag for displaying an uploaded image. On change of 'browse' button, a function called showFile () will be called. The image to be uploaded is displayed in the div tag named "imgdiv".This works fine using IE.But in firefox, the image is not displayed. If MAC OS with Safari browser is used, its displaying a 'question mark' instead of image.


Expand|Select|Wrap|Line Numbers
  1.  
  2. function showFile()
  3. {
  4.  
  5.  var f = document.acuploadfrm;
  6.  document.getElementById("imgdiv").innerHTML = "<img  src='"+f.imgfile.value+"' width=730>";
  7.     document.getElementById("imgdiv").style.display = 'block';
  8.  
  9.  
  10.  
  11. }
  12.  
  13.  

Can any one pls help me to solve this...
Nov 30 '07 #1
17 3806
acoder
16,027 Expert Mod 8TB
Welcome to TSDN!

The problem is not with the div tag, but with the image source. It's a local file, so JavaScript can't access it.
Nov 30 '07 #2
Nithu25
15
But the same function is working fine in Internet Explorer. If the img src ..is the problem how it will work in IE?
Dec 3 '07 #3
Nithu25
15
ya...i got wat is specified in the reply..Thank You
Dec 3 '07 #4
acoder
16,027 Expert Mod 8TB
But the same function is working fine in Internet Explorer. If the img src ..is the problem how it will work in IE?
IE will display local images, other browsers won't.
Dec 3 '07 #5
Nithu25
15
Hi...
How to set the absolute path for the image (in the above situation) to make it display in the Mozilla Firefox browser?
Dec 4 '07 #6
Velhari
46
Hi,

To display image in firefox, you have to proceed the following things in your browser before run that program.

In the address bar type, about:config
In filter option you have to type, security.checkloaduri
It will give the 'preference name'

Double click that option and change the value to False

close the browser once and run your program, it will works fine.

Thanks,
Velhari
Dec 4 '07 #7
acoder
16,027 Expert Mod 8TB
Hi...
How to set the absolute path for the image (in the above situation) to make it display in the Mozilla Firefox browser?
It's not about absolute and relative paths. Image files from the local hard disk cannot be accessed and therefore will not display.
Dec 4 '07 #8
acoder
16,027 Expert Mod 8TB
To display image in firefox, you have to proceed the following things in your browser before run that program.

In the address bar type, about:config
In filter option you have to type, security.checkloaduri
It will give the 'preference name'

Double click that option and change the value to False

close the browser once and run your program, it will works fine.
This may well work, but it would only work on a per-user basis. Each user would have to change their settings.
Dec 4 '07 #9
Nithu25
15
Thank You for Replies.

Hope that you undersood the requirement. The user should be able to upload image and that image selected in the browse file is displayed inside div tag.Onchange of the browser file the above given javascript function is called.

Do you mean that this is not possible in this way? If so, kindly provide me a solution how i can do this.

It's not about absolute and relative paths. Image files from the local hard disk cannot be accessed and therefore will not display.
Dec 5 '07 #10
acoder
16,027 Expert Mod 8TB
Do you mean that this is not possible in this way? If so, kindly provide me a solution how i can do this.
Is this for an application used in a controlled user environment? If you can be sure of the settings, you may change the settings to allow the image preview to display, otherwise besides actually uploading the file and displaying the uploaded file (which sort of defeats the purpose), there's no other way.
Dec 5 '07 #11
Nithu25
15
Thank You for your reply.
Dec 7 '07 #12
Ferris
101 100+
Hi

Here's the solution.

If you want to show local images in firefox,you should use file protocal to visit it,not just give the image path.

You code is:
<img src="C:\Photo\Photo1.jpg" />
it is fine in IE,but not fine in Firefox.

So,change it into this:
<img src="file:///C:/Photo/Photo1.jpg" />
it OK!

OK,I write a sample code for you. I think it will solve your problem.


[HTML]

<!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>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Untitled Document</title>
<script language="javascript" type="text/javascript">
function showFile(){
var imgSrc = document.getElementById("imgfile").value;
if (imgSrc!=""){
imgSrc = imgSrc.replace(/\\/g,"/");
imgSrc = "file:///" + imgSrc;
//alert (imgSrc);
document.getElementById("imgdiv").innerHTML = "<img src='"+imgSrc+"' />";
}
}
</script>
</head>
<body>
<div id="imgdiv" style="width:300px; height:300px; border:1px solid;"></div>
<input type="file" id="imgfile" onchange="showFile();" />
</body>
</html>


[/HTML]
Dec 7 '07 #13
acoder
16,027 Expert Mod 8TB
Hi

Here's the solution.

If you want to show local images in firefox,you should use file protocal to visit it,not just give the image path.
No, I don't think that will work.

Try it online. If it does work, maybe you've changed the default settings.
Dec 10 '07 #14
Ferris
101 100+
No, I don't think that will work.

Try it online. If it does work, maybe you've changed the default settings.
Yes, you are right. I tried it online,and it doesn't work.
Thank you so much!
Dec 10 '07 #15
acoder
16,027 Expert Mod 8TB
No problem. There is a setting you can change to make it work, but then everyone would have to change it which wouldn't be feasible.
Dec 11 '07 #16
Nithu25
15
Thank You all for your replies.
Dec 12 '07 #17
acoder
16,027 Expert Mod 8TB
You're welcome. Sorry, the problem can't be solved, but the security restrictions are there for good reason.
Dec 12 '07 #18

Post your reply

Sign in to post your reply or Sign up for a free account.

Similar topics

26 posts views Thread by Roger Desparois | last post: by
36 posts views Thread by Simon Wigzell | last post: by
2 posts views Thread by Jason S | last post: by
9 posts views Thread by Simon Wigzell | last post: by
6 posts views Thread by Mark Rae | last post: by
34 posts views Thread by Simon Wigzell | last post: by
2 posts views Thread by Serena | last post: by
By using this site, you agree to our Privacy Policy and Terms of Use.