Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 4 of 4
  1. #1
    New to the CF scene
    Join Date
    Aug 2006
    Posts
    2
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Javascript Cross Browser Issue with FireFox

    I have run out of options and would love any help on this issue. Thanks in advance

    I spawn a popup window and list image files in the window with this code, The users can select the image that they would like to preview by clicking on the link

    Code:
    For Each file1 in f.files
    	if (instr(lcase(file1.name), ".jpg") > 0) and (includeJPG) then
    		s = s & "<a href=""javascript: previewImageFunc('" & lcase(file1.name) & "')"">" & lcase(file1.name) & "</a>"
    		s = s &   "<BR>"
    	end if

    In IE 6.0 this works great but I get no preview or error message in FireFox 1.5.0.6. This is the preview javascript

    Code:
    var fullpathname='';
    	function previewImageFunc(imagename)
    	{
    		fullpathname =  "/<%=session("brand")%>FILES/access_db/viki/images/<%=imagetype%>/" + selected_folder_name + "/" + imagename;
    		var innerHtml = "<span style='font-family:verdana,tahoma;font-size:9px'>" + imagename + "<br><img width=300 src=" + fullpathname + "></span>";
    		buttonsDiv.style.display = "";
    		imagePreview.innerHTML = innerHtml;
    	}

  • #2
    Supreme Master coder! _Aerospace_Eng_'s Avatar
    Join Date
    Dec 2004
    Location
    In a place far, far away...
    Posts
    19,291
    Thanks
    2
    Thanked 1,043 Times in 1,019 Posts
    Don't use variables that have reserved words in JS for example innerHTML is already something in JS don't use it for a variable. What is buttonsDiv? Do you have the html that goes with the script?
    ||||If you are getting paid to do a job, don't ask for help on it!||||

  • #3
    New to the CF scene
    Join Date
    Aug 2006
    Posts
    2
    Thanks
    0
    Thanked 0 Times in 0 Posts
    Thanks Aero,

    I also just found out that firefox doesn't support innerHTML, the work around is here:

    http://www.webdeveloper.com/forum/sh...ad.php?t=74592

    I am not familiar with how to use the syntax for :document.getElementById, which is thier solution. Here is the rest of the HTMl that you suggested.



    Code:
    <%
    dim folder_name, imagetype, includeJPG, includeSWF
    imagetype = request("type")
    if imagetype="" then imagetype="800x"
    includeJPG = (trim(request("xJPG"))="")
    if includeJPG then
    	includeJPGInt=""
    else
    	includeJPGInt=1
    end if
    includeSWF = (trim(request("xSWF"))="")
    if includeSWF then
    	includeSWFInt=""
    else
    	includeSWFInt=1
    end if
    folder_name = request("folder_name")
    if len(folder_name)=0 then folder_name = "Other"
    %>
    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
    <html>
    <head>
    <title>Select Image</title>
    	<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
    <script language="javascript">
    	var fullpathname='';
    	function previewImageFunc(imagename)
    	{
    		fullpathname =  "/<%=session("brand")%>FILES/images/<%=imagetype%>/" + selected_folder_name + "/" + imagename;
    		var innerHtml = "<span style='font-family:verdana,tahoma;font-size:9px'>" + imagename + "<br><img width=300 src=" + fullpathname + "></span>";
    		buttonsDiv.style.display = "";
    		imagePreview.innerHTML = innerHtml;
    	//document.getElementById("imagePreview").innerHtml = innerHtml;
    	}
    	function previewFlash(flashname)
    	{
    		fullpathname =  "/<%=session("brand")%>FILES/access_db/viki/images/<%=imagetype%>/" + selected_folder_name + "/" + flashname;
    //		var innerHtml = "<span style='font-family:verdana,tahoma;font-size:9px'>" + imagename + "<br><img width='300' src='" + fullpath_imagename + "'></span>";
    		var innerHtml = "<span style='font-family:verdana,tahoma;font-size:9px'>" +
    						flashname + 
    						"<object classid='clsid:D27CDB6E-AE6D-11cf-96B8-444553540000' codebase='http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=6,0,29,0' name='bg' width='300' height='250' id='bg'>" +
    						"  <param name='movie' value='" + fullpathname + "'>" +
    						"  <param name='quality' value='high'><param name='SCALE' value='noborder'><param name='LOOP' value='false'>" +
    						"  <embed src='" + fullpathname + "' width='300' height='250' loop='false' quality='high' pluginspage='http://www.macromedia.com/go/getflashplayer' type='application/x-shockwave-flash' scale='noborder' name='bg'></embed>" +
    						"</object>" +
    						"</span>";
    		buttonsDiv.style.display = "";
    		//imagePreview.innerHTML = innerHtml;
    	imagePreview.innerHtml = innerHtml;
    	//document.getElementById("imagePreview").innerHtml = innerHtml;
    
    	
    	
    	
    	}	
    	function selectImage()
    	{
    		window.opener.selected_image = fullpathname;
    		window.opener.focus();
    		window.close();
    	}
    	function ChangeFolder()
    	{
    	
    	}
    	</script>
    <style type="text/css">
    <!--
    .style1 {font-family: Verdana, Arial, Helvetica, sans-serif}
    .style4 {font-size: 13px}
    .style8 {font-family: Verdana, Arial, Helvetica, sans-serif; font-size: 13px; }
    -->
    </style>
    </head>
    <body onLoad="window.focus()">
    <div align="center"><img src="../../images/select-back-header.gif" width="391" height="54"><br> 
    </div><form name="form1" id="form1" method="GET">
    <input type=HIDDEN name=xJPG value="<%=includeJPGInt%>">
    <input type=HIDDEN name=xSWF value="<%=includeSWFInt%>">
    <input type=HIDDEN name=type value="<%=imagetype%>">
     <table width="100%"  border="0" cellspacing="0" cellpadding="2"> 
    <tr> <th width="20%" valign="top" nowrap scope="row"><span class="style8">Image 
    Folder:</span></th><td valign="top"> <span class="style8"> <select name="folder_name" onchange="form1.submit()"><OPTION VALUE="Art">Art</OPTION><OPTION VALUE="animals">Animals</OPTION><OPTION VALUE="Computer">Computer</OPTION><OPTION VALUE="English">English</OPTION><OPTION VALUE="ForeignLanguage">Foreign 
    Language</OPTION><OPTION VALUE="Geography">Geography</OPTION><OPTION VALUE="History">History</OPTION><OPTION VALUE="Literature">Literature</OPTION><OPTION VALUE="Math">Math</OPTION><OPTION VALUE="Music">Music</OPTION><OPTION VALUE="Other">Other</OPTION><OPTION VALUE="Sci">Science</OPTION><OPTION VALUE="SocialStudies">Social 
    Studies</OPTION></select> <a href="upload_multimedia.asp?<%=request.QueryString%>">upload 
    new images</a> <script language="javascript">
    		var selected_folder_name='<%=folder_name%>';
    		if (selected_folder_name.length>0) 
    		{
    			var oe = form1.folder_name;
    			for (var i=0; i<oe.length; i++)
    				if (oe[i].value == selected_folder_name) oe[i].selected = true;
    		}
    		</script> </span></td><td valign="top">&nbsp;</td></tr> <tr> <th valign="top" nowrap scope="row"><p class="style1 style4">Image 
    File(s):</p><p class="style8"><img src="../../images/pick-image.jpg" width="90" height="130"> 
    </p></th><td valign="top"><span class="style8"> <%
    dim fso, f, file1, s
    set fso= Server.CreateObject("Scripting.FileSystemObject")
    'response.write( Server.MapPath( "/" & session("brand") & "FILES/access_db/viki/images/" & imagetype & "/") & "\" & folder_name )
    set f = fso.GetFolder( Server.MapPath( "/" & session("brand") & "FILES/access_db/viki/images/" & imagetype & "/") & "\" & folder_name )
    'response.Write( typename(f) & "<br>")
    'thecount=imgfiles.count
    
    For Each file1 in f.files
    	if (instr(lcase(file1.name), ".jpg") > 0) and (includeJPG) then
    		s = s & "<a href=""javascript: previewImageFunc('" & lcase(file1.name) & "')"">" & lcase(file1.name) & "</a>"
    		s = s &   "<BR>"
    	end if
    	if (instr(lcase(file1.name), ".swf") > 0) and (includeSWF) then
    		s = s & "<a href=""javascript: previewFlash('" & lcase(file1.name) & "')"">" & lcase(file1.name) & "</a>"
    		s = s &   "<BR>"
    	end if
    Next
    
    response.Write(s)
    response.Write("<br>")
    
    %> </span></td><td align="center" valign="middle"><div id="imagePreview"></div></td></tr> 
    <tr> <td colspan="3" align="center"> <div id="buttonsDiv" style="display:none "> 
    <input name="btnSelectImage" type="button" id="btnSelectImage" value="Select Image" onClick="selectImage()"> 
    <input name="btnCancel" type="button" id="btnCancel" value="Cancel" onClick="window.close();"> 
    </div></td></tr> </table></form> 
    
    </body>
    </html>

  • #4
    Regular Coder
    Join Date
    Jan 2004
    Posts
    185
    Thanks
    2
    Thanked 1 Time in 1 Post
    firefox does support innerHTML, but you're using vbscript - visual basic script - i.e., propreitary MS code - which wont work in anything but IE.

    the translation is simple enough tho, assuming you can get the f.files into javascript as a real array - locally, it'd be something like this
    Code:
    var fso = new ActiveXObject("scripting.filesystemobject");
    var folder = fso.getfolder(".");
    var iterator = new Enumerator(folder.files);
    var list = [];
    for(;!iterator.atEnd();iterator.moveNext())list.push(iterator.item().path);
    but you'll find that the filesystemobject is effectively worthless online - there's similiar fuctionality serverside using ASP, but you'll have to make sure your server supports that first. anyways, assuming you can get the image list into js:
    Code:
    //For Each file1 in f.files
    var s = "";
    for(var i=0,l=f.files.length;i<l;i++){
    var file1 = f.files[i];
    var fname = file1.name.toLowerCase();
    if(fname.slice(0,-4)==".jpg" && includeJPG) s += "<a href=\"javascript:previewImageFunc('" + fname + "')\">" + fname + "</a>";};


  •  

    Posting Permissions

    • You may not post new threads
    • You may not post replies
    • You may not post attachments
    • You may not edit your posts
    •