I've a perfect working code in IE but for some reason its not working in Fire fox...can anyone suggest why?
javascript code not workign in firefox
0
kg_ally I've a perfect working code in IE but for some reason its not working in Fire fox...can anyone suggest why?
<div id="rBookAddress">
<h5 class="instructions"><input type="checkbox" name="chkRecipeBook" id="chkRecipeBook" onclick="javascript:disableAddressBook();" />Please enter your address details to receive your Free Recipe Book:</h5>
<div class="extensiondatacapture" id="addBook">
<cfinclude template="#cf_mapping#/#memberPATH#/recipeBook/includes/addressForm.inc">
</div>
</div>
<script language="JavaScript" type="text/javascript">
function disableAddressBook()
{
toggleAddBook(document.getElementById("addBook"));
}
function toggleAddBook(abc)
{ //var abc.childNodes[0];
if ((document.getElementById("chkRecipeBook").checked == false)&&(abc.disabled == false))
{
abc.disabled = true;
alert(abc.childNodes.length);
if (abc.childNodes && abc.childNodes.length > 0)
{
for (var x = 0; x < abc.childNodes.length; x++)
{
toggleAddBook(abc.childNodes[x]);
}
}
}
else if ((document.getElementById("chkRecipeBook").checked == true)&&(abc.disabled == true))
{
abc.disabled = false;
if (abc.childNodes && abc.childNodes.length > 0)
{
for (var x = 0; x < abc.childNodes.length; x++)
{
toggleAddBook(abc.childNodes[x]);
}
}
}
}
</script>0
almostbob 866 because IE and firefox/mozilla use a different DOM (document object model)
there are many scripts that only work in one or the other
and on the sites that offer them for download they usually state things like IE only, or "degrades gracefully in other browsers"
I do not know enough Javascript for the mozilla DOM to be able to fix it but to point you at a possibility IBM.com Migrate javascript apps from IE to Mozilla
0
kg_ally I've a checkbox above the div which is checked by default.
I want to disable the div n its chiild nodes when the check box in unticked.
0
mschroeder 251 Before i propose any other solutions, did you try removing the <b></b> tags from this line: <input type="checkbox" name="chkRecipeBook" id="chkRecipeBook" onclick="javascript<b></b>:disableAddressBook();" /> ?
0
nav33n 472 Before i propose any other solutions, did you try removing the
<b></b>tags from this line:<input type="checkbox" name="chkRecipeBook" id="chkRecipeBook" onclick="javascript<b></b>:disableAddressBook();" />?
mschroeder, That is a bug with code-tags. I have even posted a thread for the same (<b></b>) here.
Edited by mike_2000_17: Fixed formatting
0
nav33n 472 @OP, Is it even possible to disable/enable a div tag ?
<div class="extensiondatacapture" id="addBook">
toggleAddBook(document.getElementById("addBook"));
if ((document.getElementById("chkRecipeBook").checked == false)&&(abc.disabled == false))
0
mschroeder 251 nav33n: well that rules out the <b></b> tags then. haha. i've had issues with IE and FF going from one to the other and having broken functionality when I have a broken tag in the javascript. When I saw the <b>'s I figured it was worth a shot.
I also assume the OP means showing and hiding of the div, but based upon the status of the checkbox. I also made the assumption that the child nodes contained in that div were form elements in which case you could hide the div and disable the form and its fields... but not sure what additional benefit that would carry.
0
kg_ally there's no <b> in my code
<div id="rBookAddress">
<h5 class="instructions"><input type="checkbox" name="chkRecipeBook" id="chkRecipeBook" onclick="javascript:disableAddressBook();" />Please enter your address details to receive your Free Recipe Book:</h5>
<div class="extensiondatacapture" id="addBook">
<cfinclude template="#cf_mapping#/#memberPATH#/recipeBook/includes/addressForm.inc">
</div>
</div>
0
nav33n 472 I also assume the OP means showing and hiding of the div, but based upon the status of the checkbox.
I figured out that much though! And also I managed to make some quick changes to his existing script. It works on both IE and firefox! @OP, Is this what you were looking for ?
<html>
<head>
<script type="text/javascript">
function disableAddressBook()
{
toggleAddBook(document.getElementById("addBook"));
}
function toggleAddBook(abc)
{ //var abc.childNodes[0];
if ((document.getElementById("chkRecipeBook").checked)&&(abc.style.display == 'none'))
{
abc.style.display = 'block';
if (abc.childNodes && abc.childNodes.length > 0)
{
for (var x = 0; x < abc.childNodes.length; x++)
{
toggleAddBook(abc.childNodes[x]);
}
}
}
else if (!(document.getElementById("chkRecipeBook").checked)&&(abc.style.display == 'block'))
{
abc.style.display = 'none';
if (abc.childNodes && abc.childNodes.length > 0)
{
for (var x = 0; x < abc.childNodes.length; x++)
{
toggleAddBook(abc.childNodes[x]);
}
}
}
}
</script>
</head>
<body>
<div id="rBookAddress">
<h5 class="instructions">
<input type="checkbox" name="chkRecipeBook" id="chkRecipeBook" onclick="javascript:disableAddressBook();" />Please enter your address details to receive your Free Recipe Book:
</h5>
<div style='display: none;' id="addBook">
<p>Something here!!!</p>
</div>
</div>
</body>
</html>P.S. I didn't bother to look at what those loops do in that function.
0
kg_ally I don't need to show or hide the div but to enable and disable the div.
Show and hide of this div is controlled by an outer div whose show an hide is controlled by clicking of a radio button...its a lil' complicated and my graphic designer who did the initial show n hide is on leave until march end ...hard luck
and this has to be done exclusively for the child nodes else it will show the div disabled still I could enter text in child nodes.
0
kg_ally well....I could do it..as you can see in my code
but
its not working in Firefox...
0
nav33n 472 well....I could do it..as you can see in my code
but
its not working in Firefox...
I can't. Your code doesn't seem to work on FF as well as IE on my computer. :-/ What do you mean by its working btw ?What is the script intended to do ?
0
almostbob 866 (document.getElementById) ? dom = true : dom = false; //test if IE
function hideit(id) {
if (dom) {document.getElementById(id).style.visibility='hidden';} //ie
else {document.layers[id].visibility='hide';} } //firefox
function showit(id) {
if (dom) {document.getElementById(id).style.visibility='visible';}//ie
else {document.layers[id].visibility='show';} }//firefoxgeneric show/hide script works in firefox opera ie
usage
hideit('addbook')
showit('addbook')
0
Troy III 272 @OP, Is it even possible to disable/enable a div tag ?
Yes!
Try this:
<div disabled onclick="this.disabled='';alert('thank you!')">Click to Enable</div>This property is defined in HTML 4.0 and is defined in: World Wide Web Consortium (W3C) Document Object Model (DOM) Level 1 .
Applies To:
BODY, CAPTION, DD, DIV, DT, FONT, FORM, ISINDEX, LABEL, LEGEND, LI, MARQUEE, OL, P, UL
! This property is inheritable
Try this:
<div onclick="if(this.disabled==''){this.disabled='true';}else{this.disabled='';alert('thanks for enabling us back!')}">Click: Disable/Enable <input type="button" name="button" value="button" /></div>0
mschroeder 251 Can you link to the W3C DOM Specs where you found that?
Dom Model 1
http://www.w3.org/TR/2000/WD-DOM-Level-1-20000929/level-one-html.html#ID-22445964
http://www.w3.org/TR/REC-DOM-Level-1/level-one-html.html#ID-011100101 <== Search for "Interface HTMLDivElement"
HTML 4.0 DIV Definition
http://www.w3.org/TR/REC-html40/struct/global.html#edef-DIV
HTML 4.0 "disbaled" definition
http://www.w3.org/TR/REC-html40/interact/forms.html#adef-disabled -- It does say it is inheritable, but it is not valid in any of the elements you provided: http://www.w3.org/TR/REC-html40/index/elements.html
Its not on any of the elements in the 4.01 spec either
http://www.w3.org/TR/html401/struct/global.html#edef-DIV
http://www.w3.org/TR/html401/interact/forms.html#adef-disabled
This topic has been dead for over six months. Start a new discussion instead.
Recommended Topics
