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

document.getElementById not working in FireFox

Post by fahadb »

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.
User avatar
dickvl
Posts: 54146
Joined: July 18th, 2005, 3:25 am

Re: document.getElementById not working in FireFox

Post by dickvl »

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

Re: document.getElementById not working in FireFox

Post by fahadb »

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

Re: document.getElementById not working in FireFox

Post by Mordwin »

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

Re: document.getElementById not working in FireFox

Post by fahadb »

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

Re: document.getElementById not working in FireFox

Post by fahadb »

@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.
User avatar
jscher2000
Posts: 11743
Joined: December 19th, 2004, 12:26 am
Location: Silicon Valley, CA USA
Contact:

Re: document.getElementById not working in FireFox

Post by jscher2000 »

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

Re: document.getElementById not working in FireFox

Post by fahadb »

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);
}
}
User avatar
jscher2000
Posts: 11743
Joined: December 19th, 2004, 12:26 am
Location: Silicon Valley, CA USA
Contact:

Re: document.getElementById not working in FireFox

Post by jscher2000 »

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

Re: document.getElementById not working in FireFox

Post by fahadb »

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

Re: document.getElementById not working in FireFox

Post by fahadb »

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
User avatar
jscher2000
Posts: 11743
Joined: December 19th, 2004, 12:26 am
Location: Silicon Valley, CA USA
Contact:

Re: document.getElementById not working in FireFox

Post by jscher2000 »

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

Re: document.getElementById not working in FireFox

Post by fahadb »

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.
User avatar
jscher2000
Posts: 11743
Joined: December 19th, 2004, 12:26 am
Location: Silicon Valley, CA USA
Contact:

Re: document.getElementById not working in FireFox

Post by jscher2000 »

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

Re: document.getElementById not working in FireFox

Post by fahadb »

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?
Post Reply