MozillaZine

document.getElementById not working in FireFox

Discuss how to use and promote Web standards with the Mozilla Gecko engine.
fahadb
 
Posts: 12
Joined: April 1st, 2009, 4:41 am

Post Posted April 1st, 2009, 4:53 am

hi there

I am using one java script to recieve a value which i am pulling it in flash object. The script worked fine on IE and flash is displaying the value, but on Firefox its not retrieving the value means that document.getelementbyId is not working in FF.

Here is the code which is in the header:

Code: Select all
<script type="text/javascript">
function CountryCode(){
   var tempObj = document.getElementById('Spotlight_en_gb');
   if(tempObj)
   {
      tempObj.SetVariable('ccode', countryCode);
   }
}
</script>


Heres my Flash object tag:

Code: Select all
<div id="HighlightSectionHolder">

  <object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" width="770" height="276" [b]Id="Spotlight_en_gb"[/b] wmode="transparent" [b]name="Spotlight_en_gb"[/b]>
    <param name="movie" value="$Common/Data/HomePageData/Movies.swf" />
    <param name="wmode" value="transparent" />
    <param name="menu" value="false" />
    <!--[if !IE]>-->
    <object type="application/x-shockwave-flash" data="$Common/Data/HomePageData/Movies.swf" width="770" height="276" wmode="transparent">
    <!--<![endif]-->
                <!--Non Flash Content-->
                  <span class="topCorner"></span>
                  <%@ Register TagPrefix="uc1" TagName="TopHighlights" Src="~/$Common/Control/TopHighlights.ascx" %>
                  <uc1:TopHighlights id="TopHighlights1" runat="server"></uc1:TopHighlights>
                <!--Non Flash Content End-->
    <!--[if !IE]>-->
    </object>
    <!--<![endif]-->
  </object>

</div>
<script type="text/javascript">CountryCode();</script>


I have given the id plus the name to get the values in the flash dynamic text box wthe variable name 'ccode' where the given value gets in.

In IE everything works perfectly but in FF i am not getting the value at all.

Any help will be appreciated

Thanks
Fahad.

dickvl

User avatar
 
Posts: 51464
Joined: July 18th, 2005, 3:25 am

Post Posted April 1st, 2009, 10:17 am

The second object element doesn't have an ID, so Firefox won't find it:
Code: Select all
<object type="application/x-shockwave-flash" data="$Common/Data/HomePageData/Movies.swf" width="770" height="276" wmode="transparent">

See e.g. http://www.permadi.com/tutorial/flashGetObject/

fahadb
 
Posts: 12
Joined: April 1st, 2009, 4:41 am

Post Posted April 2nd, 2009, 12:03 am

Hi

I have tried applying the same id on the second object tag but even after that it didnt get the variable in flash, isnt it will be an issue if same id is assigned to both objects?

Mordwin
 
Posts: 653
Joined: June 8th, 2005, 6:10 am

Post Posted April 2nd, 2009, 12:35 am

Give then both the same name attribute and use getElementsByName()? In IE it'd always be the first (and presumably only) element returned, in FF, you'd get two returned and would be interested in the second one (can check the length property of the returned NodeList to see which scenario you have). Haven't tried it, but it would seem more likely to work than trying to (illegally) give two elements the same ID.

fahadb
 
Posts: 12
Joined: April 1st, 2009, 4:41 am

Post Posted April 4th, 2009, 11:40 pm

I have taken off the id from the first object tag, and given exclusively to the !IE tag specifically to check in FF, but even after that FF doesnt get the var value in the flash, does anyone have any working piece of code that supports the flash and alternate flash in it.

fahadb
 
Posts: 12
Joined: April 1st, 2009, 4:41 am

Post Posted April 5th, 2009, 12:02 am

@Mordwin

It doesnt work... I have given the name attribute to both, and call up as getelementbyname in JS, but didnt get the result in flash on FF.

jscher2000

User avatar
 
Posts: 9586
Joined: December 19th, 2004, 12:26 am
Location: Silicon Valley, CA USA

Post Posted April 5th, 2009, 9:59 am

Is there anything in the Error Console (Tools menu) that might indicate a syntax or permissions problem?

To determine whether your script successfully obtained an object reference to your <object>, try adding an alert to your code:

Code: Select all
alert(tempObj);

Does it show some kind of [object], or "undefined"?

fahadb
 
Posts: 12
Joined: April 1st, 2009, 4:41 am

Post Posted April 5th, 2009, 11:16 pm

The Error console says:

Error: tempObj.SetVariable is not a function
Source File: http://www.showtimearabia.com/$Common/J ... me_home.js
Line: 166

here is the JS script that we are calling:

function CountryCode(){
var tempObj = document.getElementById('Spotlight_en_gb');
if(tempObj)
{
tempObj.SetVariable('ccode', countryCode);
}
}

jscher2000

User avatar
 
Posts: 9586
Joined: December 19th, 2004, 12:26 am
Location: Silicon Valley, CA USA

Post Posted April 5th, 2009, 11:38 pm

Your object tag is not right:

Code: Select all
<!--[if !IE]>-->
    <object type="application/x-shockwave-flash" data="$Common/Data/HomePageData/Movies.swf?" + new Date().getTime(); +"" width="770" height="276" wmode="transparent">
    <!--<![endif]-->

It should not have raw JavaScript in it. And there is no id attribute.

fahadb
 
Posts: 12
Joined: April 1st, 2009, 4:41 am

Post Posted April 5th, 2009, 11:51 pm

Here is the correction which i just made:


<div id="HighlightSectionHolder">

<object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" width="770" height="276" Id="Spotlight_en_gb" wmode="transparent" name="Spotlight_en_gb">
<param name="movie" value="$Common/Data/HomePageData/Movies.swf?" />
<param name="wmode" value="transparent" />
<param name="menu" value="false" />
<!--[if !IE]>-->
<object type="application/x-shockwave-flash" data="$Common/Data/HomePageData/Movies.swf?" Id="Spotlight_en_gb" width="770" height="276" wmode="transparent">
<!--<![endif]-->
<!--Non Flash Content-->
<span class="topCorner"></span>
<%@ Register TagPrefix="uc1" TagName="TopHighlights" Src="~/TopHighlights.ascx" %>
<uc1:TopHighlights id="TopHighlights1" runat="server"></uc1:TopHighlights>
<!--Non Flash Content End-->
<!--[if !IE]>-->
</object>
<!--<![endif]-->
</object>

</div>
<script type="text/javascript">CountryCode();</script>


Does that seems ok now? I have tried giving both objects the same id but the results were the same, is it something related to my JS as the error console stated?

fahadb
 
Posts: 12
Joined: April 1st, 2009, 4:41 am

Post Posted April 6th, 2009, 12:06 am

As i am using SWFObject for flash, I modified my JS a bit:

function CountryCode(){
var tempObj = swfobject.getObjectById('Spotlight_en_gb');
if(tempObj)
{
tempObj.SetVariable('ccode', countryCode);
}
}

That still worked fine in IE but the FF error console says:

Error: swfobject.getObjectById("Spotlight_en_gb") is null

jscher2000

User avatar
 
Posts: 9586
Joined: December 19th, 2004, 12:26 am
Location: Silicon Valley, CA USA

Post Posted April 6th, 2009, 12:43 am

Can you post a link to a minimal test case demonstrating the problem, using the new HTML?

fahadb wrote:As i am using SWFObject for flash, I modified my JS a bit:

I'm not familiar with this library. (I've heard of it, but never used it.)

fahadb
 
Posts: 12
Joined: April 1st, 2009, 4:41 am

Post Posted April 6th, 2009, 1:02 am

I have created a diffrent html for minimizing the test case, and uploaded in a zip folder. Please download from:
http://www.showtimearabia.com/test/Var/2Objects1ID.zip

Thanks
Fahad.

jscher2000

User avatar
 
Posts: 9586
Joined: December 19th, 2004, 12:26 am
Location: Silicon Valley, CA USA

Post Posted April 6th, 2009, 1:42 am

I skimmed through the file vartest.html. The inner <object> has no id attribute. If you load that page and run the following from the address bar, what do you get?

Code: Select all
javascript:void(alert(document.getElementById('Spotlight_en_gb').getAttribute("width")));

If Firefox is instantiating the outer object, I would expect 550. Otherwise, I would expect a script error and no alert. If you get 770, that would indicate that the inner object is getting assigned the id of the outer object, and the problem is with something else.

fahadb
 
Posts: 12
Joined: April 1st, 2009, 4:41 am

Post Posted April 6th, 2009, 2:51 am

I have got 550 when i pasted the same code above the existing vartest.html url, does that mean the code and id assignment is correct?

Return to Web Development / Standards Evangelism


Who is online

Users browsing this forum: No registered users and 1 guest