...

View Full Version : Firefox and getElementById Problem



pootlecat
08-25-2006, 07:47 PM
Hi,

I think from what I have been reading that Firefox has quite a problem with some Javascript. We had this little script written for us which works great in IE but I have no clue how to get it to work with Firefox. Any ideas would be greatly appreciated! :)


<script type="text/javascript">
<!--
function getObject(obj) {
var theObj;
if(document.all) {
if(typeof obj=="string") {
return document.all(obj);
} else {
return obj.style;
}
}
if(document.getElementById) {
if(typeof obj=="string") {
return document.getElementById(obj);
} else {
return obj.style;
}
}
return null;
}

function checkqty(item1,item2) {
var item1Obj=getObject(item1);
var item2Obj=getObject(item2);
if (item1Obj.checked == true) {
item2Obj.value = "1";
}
else if (item1Obj.checked == false) {
item2Obj.value = "0";
}
}
//-->
</script>

<input type="checkbox" name="item2" value="012345" onClick="checkqty('item2','quantity2');">
<input type="hidden" name="quantity2" value="0">

_Aerospace_Eng_
08-25-2006, 09:01 PM
Hi,

I think from what I have been reading that Firefox has quite a problem with some Javascript. We had this little script written for us which works great in IE but I have no clue how to get it to work with Firefox. Any ideas would be greatly appreciated! :)


Fx actually IMO has better support for most javascript than IE does. Of course users saying Firefox doesn't support something when their script doesn't work when in actuallity its their coding that is wrong in the first place. You currently are passing a name to the getObject function. Since Fx supports document.getElementById() its looking for an id not a name which is why it doesn't work. IE thinks a name is the same as an id but it also understands document.all in which case it will use the name. Add the stuff in bold and your script should work.

<input type="checkbox" name="item2" id="item2" value="012345" onClick="checkqty('item2','quantity2');">
<input type="hidden" name="quantity2" id="quantity2" value="0">

pootlecat
08-25-2006, 09:19 PM
Thanks so much worked like a charm - I will never malign it's good name again ;P

PSampras
05-18-2010, 01:31 PM
Hi,
I have a problem with the following Javascript that works in localhost but doesn't work in FF and in IE



<span class="ghost" id="infoPro[98]"><?=$image->fields["cprownum"]?></span>
<span class="ghost" id="infoPro[99]"><?=$row->fields["cod_dat"]?></span>




<div class="button">
<form method="POST" id="prenota" action="javascript:cat_changeurl()">
<input type="submit" class="go" value="prenota" name="prenota">
</form>
</div>




<script type="text/javascript">
function cat_changeurl(){
var img = document.getElementById('infoPro[99]').innerHTML;
var num = document.getElementById('infoPro[98]').innerHTML;
window.location.href = "index.php?cp=<?=$_CONFIG["cms_prenota"]?>&img="+img+"&num="+num+"&off="+"n";
}
<script>


When i click on submit button, the new URL doesn't read img and num values.

Thanks in advance

Dormilich
05-18-2010, 01:48 PM
anything in the error console?

PSampras
05-18-2010, 02:40 PM
anything in the error console?

No :(

I want: ../index.php?cp=238&img=117&num=1&off=n

but i have: ../index.php?cp=238&img=&num=&off=n

PSampras
05-18-2010, 02:57 PM
Ok, i resolved using tag <name> in the html code and getAttribute function, as follows:



<span class="ghost" name="<?=$image->fields["cprownum"]?>" id="infoPro[98]"><?=$image->fields["cprownum"]?></span>
<span class="ghost" name="<?=$row->fields["cod_dat"]?>" id="infoPro[99]"><?=$row->fields["cod_dat"]?></span>





<script type="text/javascript">
function cat_changeurl(){
var img = document.getElementById('infoPro[99]').getAttribute('name');
var num = document.getElementById('infoPro[98]').getAttribute('name');
window.location.href = "index.php?cp=<?=$_CONFIG["cms_prenota"]?>&img="+img+"&num="+num+"&off="+"n";
}

Dormilich
05-18-2010, 03:31 PM
does it work if you use .textContent?

PSampras
05-18-2010, 04:55 PM
does it work if you use .textContent?

No, if i use .textContent and not .GetAttribute('name') it doesn't work.
In local it works... :confused:

PSampras
05-18-2010, 06:17 PM
No, if i use .textContent and not .GetAttribute('name') it doesn't work.
In local it works... :confused:

I'm sorry, i have to correct myself...
.innerHTML and .textContent work in local but don't work on web.

.getAttribute('name') doesn't work nor in local nor on web.

Please help me...

Dormilich
05-19-2010, 08:04 AM
do you have a test page?

PSampras
05-19-2010, 11:30 AM
do you have a test page?

I have this page (http://www.topcarpet.it/176-Catalogo.html).

If user is logged, he views a button and he can reserved the carpet.
I need to pass two parameters (infoPro[98] and infoPro[99]) that are "hidden" in this page (you can easily view them in the html code).

Thanks!

Dormilich
05-19-2010, 11:42 AM
tested it in FF 3.6 and it worked.

PSampras
05-19-2010, 12:29 PM
tested it in FF 3.6 and it worked.

I have also FF 3.6.3.
The information on the left box change correctly, if you click on other image.
But, if you click on button "prenota" (visibile after login) new page doesn't read the info needed to view the correct carpet.
Try please using
user: testjs
pwd: test_js

Thanks!

Kor
05-19-2010, 12:29 PM
Ok, i resolved using tag <name> in the html code and getAttribute function, as follows:
Wrong. A SPAN element can not bear a name attribute. On the other hand it is impossible that innerHTML not to work.

The problem is that you have not isolated that piece of code within a CDATA island. Under a XHTML Doctype some Javascript special characters are interpreted in an XML way if they are not isolated. Your code will simply be blocked when the interpreter meets the & character. Add the blue:


<script type="text/javascript">
/*<![CDATA[*/
function cat_changeurl(){
var img = document.getElementById('infoPro[99]').innerHTML;
var num = document.getElementById('infoPro[98]').innerHTML;
window.location.href = "index.php?cp=238&img="+img+"&num="+num+"&off="+"n";
}

function off_changeurl(){
var img = document.getElementById('infoPro[99]').innerHTML;
var num = document.getElementById('infoPro[98]').innerHTML;
window.location.href = "index.php?cp=238&img="+img+"&num="+num+"&off="+"y";
}
/*]]>*/
</script>

PSampras
05-19-2010, 12:47 PM
You're right, i have to isolate the code.
But it doesn't work yet :(
Repeat, all works fine in localhost, nothing on web... :confused:

Dormilich
05-19-2010, 12:50 PM
The problem is that you have not isolated that piece of code within a CDATA island. Under a XHTML Doctype some Javascript special characters are interpreted in an XML way if they are not isolated. Your code will simply be blocked when the interpreter meets the & character.

thatís only true if the document would be *served* as XHTML. if it were real XHTML, the parser would have quit with an error message.

besides, the original code did work outside CDATA (I only inserted a trigger via Firebug to get it running)

Kor
05-19-2010, 12:51 PM
You're right, i have to isolate the code.
But it doesn't work yet :(
Repeat, all works fine in localhost, nothing on web... :confused:
Impossible.

Note: I see no "prenota" button after login.

abduraooft
05-19-2010, 01:03 PM
btw, check the errors given by validator, at http://validator.w3.org/check?uri=http%3A%2F%2Fwww.topcarpet.it%2F176-Catalogo.html&charset=%28detect+automatically%29&doctype=Inline&group=0

Line 113, Column 89: character "[" is not allowed in the value of attribute "id"

…<span class="label">provenienza:</span><span id="infoPro[0]">CAUCASO</span></p>

PSampras
05-19-2010, 01:04 PM
Impossible.

Note: I see no "prenota" button after login.

Unfortunately it's possible...:(

You have to login, then come back to page "catalogo", there is button "prenota"...

PSampras
05-20-2010, 09:13 AM
Unfortunately it's possible...:(

You're right, it was impossibile.
I'm sorry guys, the code is right and all works fine, i forgot to publish a critical php file... :o

However, i choose to use the following code:


<form method="post" id="frmPrenota" action="">
<input type="hidden" name="cp" value="<?=$_CONFIG["cms_prenota"]?>" />
<input type="hidden" name="img" id="prenotaImg" value="<?= $row->fields["cod_dat"] ?>" />
<input type="hidden" name="num" id="prenotaNum" value="<?= $image->fields["cprownum"] ?>" />
<input type="hidden" name="off" value="" />
<?
if($_cms_page == $_CONFIG["cms_offerte"]) {
?>
<p class="infoPro"><span class="label">prezzo speciale:</span>&euro; <span id="infoPro[5]"><?=$row->fields["spepre_dat"]?></span></p>
<div class="button">
<input type="submit" class="go" value="prenota" name="prenota" onclick="off_changeurl()" />
</div>
<?
} else if ($_cms_page == $_CONFIG["cms_catalogo"]) {
?>
<div class="button">
<input type="submit" class="go" value="prenota" name="prenota" onclick="cat_changeurl()" />
</div>
<?
}
?>
</form>
<?
}
?>
<script type="text/javascript">
/*<![CDATA[*/
function cat_changeurl(){
var frm = document.getElementById("frmPrenota");
frm.off.value = "n";
frm.submit();
}

function off_changeurl(){
var frm = document.getElementById("frmPrenota");
frm.off.value = "y";
frm.submit();
}
/*]]>*/
</script>

cweb
01-10-2012, 09:43 PM
Hi! I have a question!
Im usuing a script found on
http://webdesign.about.com/od/dhtml/a/aa101507.htm
"Show and Hide Blocks of Text (or Images) with CSS and JavaScript"

Im using the javascript;
<script type="text/javascript">
function unhide(divID) {
var item = document.getElementById(divID);
if (item) {
item.className=(item.className=='hidden')?'unhidden':'hidden';
}
}
</script>

This I put in my CSS-file:
.hidden { display: none; }
.unhidden { display: block; }

These two on the page
<div id="learnHTML">

and

<div id="learnHTML" class="hidden">

And it works fine in IE 8 and Google Chrome - but not in Firefox.
Is there any way to get around this problem, to make it work in all three browsers?

If my english is not perfect it's becuase I'm swedish :-)

Old Pedant
01-11-2012, 02:04 AM
First of all, don't post in old threads. Start a new one.

Secondly, show us your full code.

But if you mean what you wrote:


These two on the page
<div id="learnHTML">
and
<div id="learnHTML" class="hidden">
then your HTML is illegal. id's must be UNIQUE on each page. Two or more of the same ID will, in general, not work at all and/or will work differently in different browsers.

Old Pedant
01-11-2012, 02:07 AM
A working demo:


<html>
<head>
<script type="text/javascript">
function unhide(divID) {
var item = document.getElementById(divID);
if (item) {
item.className=(item.className=='hidden')?'unhidden':'hidden';
}
}
</script>
<style type="text/css">
.hidden { display: none; }
.unhidden { display: block; }
</style>
</head>
<body>
<div id="learnHTML">Click the button to hide this</div>
<hr/>
<form>
<input type="button" value="Hide/Show" onclick="unhide('learnHTML');"/>
</form>
</body>
</html>



EZ Archive Ads Plugin for vBulletin Copyright 2006 Computer Help Forum