• Status: Solved
  • Priority: Medium
  • Security: Public
  • Views: 283
  • Last Modified:

Javascript IE error

Hi,


I have a function that toggles show or hide of particular divs. There are many that are named the same hence why i use a for loop.
unfortunately IE throws an error message and the function doesnt work . In firefox it is fine.
Any help much appreciated.

here is my function:

function toggle(id) {
                  x = document.getElementsByName(id);
                  for (key in x) {
                   if (x[key].style.display == 'block') {
                        x[key].style.display = 'none';
                   } else {
                        x[key].style.display = 'block';
                   }
                  }
            }

Thanks
0
coolispaul
Asked:
coolispaul
  • 3
  • 2
2 Solutions
 
Yury MerezhkovDevelopment Team LeadCommented:
Try this:

function toggle(id) {
   x = document.getElementById(id);
   for (key in x) {
      if (x[key].style.display == 'block') {
         x[key].style.display = 'none';
      } else {
         x[key].style.display = 'block';
      }
   }
}
0
 
Yury MerezhkovDevelopment Team LeadCommented:
or if you need to identify DIVs by name, change

x = document.getElementById(id);

to

x = document.getElementByName(id);

(Not document.getElementsByName(id) !)
0
 
coolispaulAuthor Commented:
document.getElementByName(id) doesnt work.

firefox does nothing and IE says "object not supported by this property or method"

Any other ideas?

Thanks
0
Cloud Class® Course: CompTIA Cloud+

The CompTIA Cloud+ Basic training course will teach you about cloud concepts and models, data storage, networking, and network infrastructure.

 
Yury MerezhkovDevelopment Team LeadCommented:
Well this code will work if you identify all DIVs using id ( <div id="div1"> ):

function toggle(id) {
   x = document.getElementById(id);
   for (key in x) {
      if (x[key].style.display == 'block') {
         x[key].style.display = 'none';
      } else {
         x[key].style.display = 'block';
      }
   }
}
0
 
coolispaulAuthor Commented:
it only works with name. i think because id is unique and only grabs one element.

However, im still having a problem with this in IE.
The error i get is : 'style.display' is null or not an object

0
 
HumbirCommented:
Hi coolispaul,

getElementsByName method works only for input elements in IE.
So we can slightly tweak the code to make it IE compatible:
<script language="javascript">
<!--
function toggle(id)
{
 var x = document.getElementsByTagName('div');
 for (key in x)
 {
 if (x[key].name == id)
  {
  if (x[key].style.display == 'none')
   {
   x[key].style.display = 'block';
   }
  else
   {
   x[key].style.display = 'none';
   }
  }
 }
 return false;
}
//-->
</script>

Please let me know if you are still facing problem with IE.
0
Question has a verified solution.

Are you are experiencing a similar issue? Get a personalized answer when you ask a related question.

Have a better answer? Share it in a comment.

Join & Write a Comment

Featured Post

Get your problem seen by more experts

Be seen. Boost your question’s priority for more expert views and faster solutions

  • 3
  • 2
Tackle projects and never again get stuck behind a technical roadblock.
Join Now