Solved

firefox - [object] has no properties

Posted on 2006-11-17
8
356 Views
Last Modified: 2012-05-05
i am trying to make this function work with both ie and firefox, but i keep getting "has no properties" error in firefox.  it didnt like the "inner" variable until i added a line that concatinates a space to the end of it.  i dont know how to get it to work with the style lines at the end.

function addFilter() {
  var createbutton = true;
  var intext = document.getElementById('txtFilter').value;
  var objFil = document.getElementById('filterParent');
  for( i = 0; i < objFil.childNodes.length; i++ ) {
    if (objFil.childNodes[i].id == intext)
        createbutton = false;
  }
  if (createbutton)
    addFilterBtn(intext);
  var objDiv = document.getElementById('divParent');
  for( i = 0; i < objDiv.childNodes.length; i++ ) {
    var inner = objDiv.childNodes[i].innerHTML;
      inner += " ";                     <---------------------------------   error fix
      //alert(inner.indexOf(intext));
      if (inner.indexOf(intext) == -1) {
        var child = objDiv.childNodes[i].id;
        var childdiv = document.getElementById(child);
        childdiv.style.display = 'none';           <------------------------    error line
      }
  }
}


error:
childdiv has no properties.
0
Comment
Question by:WMIF
  • 5
  • 2
8 Comments
 
LVL 22

Author Comment

by:WMIF
ID: 17969970
oh, firefox version 1.5.0.8
0
 
LVL 12

Assisted Solution

by:jessegivy
jessegivy earned 125 total points
ID: 17970218
HI WMIF,

Well first of all what I've gotta ask is if your sure that all your nodes have attributes within this divParent?  For instance a <br> has no properties, but could easily be a child node.  What I would reccomend is alerting the id of each element as you iterate through the loop and alert the child var which would tell you all the id's of the elements you are trying to access the style attribute.  In order to change the style it has to have a style attribute.

Another idea is to set the style object instead of setting the display itself like this:

childdiv.style="display:none;";

...seems rediculous I know but ce la vie, more likely that there's a problem with one of the elements you're referencing (i.e. it's got no style attributes)

~Jesse
0
 
LVL 22

Author Comment

by:WMIF
ID: 17970602
hmm, that is starting to make some sense now.  i had started working on this page in IE and wanted to make sure it would work with firefox as well.  when i ran another function that just alerted the childnodes, in IE it displayed just the first level of tags, but in firefox i was getting undefined's.  the weird thing though is that there is actually only one level of tags, but firefox was displaying 7 alerts:  [undefined], f1, [undefined], f2, [undefined], f3, [undefined]

im not sure where the undefined's were coming from.

<div id="divParent">
  <div id="f1">content for f1</div>
  <div id="f2">content for f2</div>
  <div id="f3">content for f3</div>
</div>
0
Free Tool: Subnet Calculator

The subnet calculator helps you design networks by taking an IP address and network mask and returning information such as network, broadcast address, and host range.

One of a set of tools we're offering as a way of saying thank you for being a part of the community.

 
LVL 6

Expert Comment

by:aescnt
ID: 17975358
I'm not sure on jessegivy's suggestion of using .style = "" because .style is nto a string.
I didn't check your code thoroughly but my eyes stopped at these lines:

       var child = objDiv.childNodes[i].id;
       var childdiv = document.getElementById(child);
       childdiv.style.display = 'none';           <------------------------    error line

Seems like you can instead substitude these with:
      objDiv.childNodes[i].style.display = 'none';
0
 
LVL 22

Author Comment

by:WMIF
ID: 17975422
that is how i started out in IE, but firefox didnt like it.  i thought by spreading stuff out it would work, but it didnt.  i think the problem is with the undefined showing for a loop of the child objects of divParent.

var objDiv = document.getElementById('divParent');
for( i = 0; i < objDiv.childNodes.length; i++ ) {
  alert(document.getElementById(child).id);

[undefined], f1, [undefined], f2, [undefined], f3, [undefined]
0
 
LVL 22

Author Comment

by:WMIF
ID: 17975664
even this gets one [undefined] in the alert.

function loopDIVs() {
  var objDiv = document.getElementById('divParent2');
  for( i = 0; i < objDiv.childNodes.length; i++ ) {
    alert( objDiv.childNodes[i].id );
  }
}

<div id="divParent2">
</div>
0
 
LVL 6

Accepted Solution

by:
aescnt earned 125 total points
ID: 17975728
"childNodes" lists all child nodes -- that means: text nodes, comments, elements, doctypes, attributes, everything. Your code gives you undefined because the childNodes[i] is stopping at a *text* child node or a *comment* child node, or any other node which otherwise can't have an ID. For instance:
      <div id="divParent2">the <i>quick</i> brown <span>fox</span> <b id="WHEE">jumps!</b></div>

This has 6 child nodes.

  1. "the " (text node) -- id is [undefined]
  2. <i> (element) -- id is ""
  3. " brown " (text node) -- id is [undefined]
  4. <span> (element) -- id is ""
  5. " " (text node) -- id is [undefined]
  6. <b> (element) -- id is "WHEE"

Looping with your loop on these will alert those values.

Btw, the same reason why Firefox will stumble on the code I gave.
      objDiv.childNodes[i].style.display = 'none';

Doing that on a non-element node (like a text node) will give an error in Firefox (which is the right behavior.)

It might be helpful to check on "nodeType", so you skip those that aren't elements. (elements have a nodeType of 3.) This means changing:
    for( i = 0; i < objDiv.childNodes.length; i++ ) {
to:
    for( i = 0; i < objDiv.childNodes.length; i++ )
       if (objDiv.childNodes[i].nodeType == 3) {
0
 
LVL 22

Author Comment

by:WMIF
ID: 17976205
actually i was getting undefined still with a nodetype of 3.  the div tags were returning a nodetype of 1.  thanks for the help though guys.  i think this will get me going again.
0

Featured Post

Free Tool: Site Down Detector

Helpful to verify reports of your own downtime, or to double check a downed website you are trying to access.

One of a set of tools we are providing to everyone as a way of saying thank you for being a part of the community.

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

Suggested Solutions

JavaScript can be used in a browser to change parts of a webpage dynamically. It begins with the following pattern: If condition W is true, do thing X to target Y after event Z. Below are some tips and tricks to help you get started with JavaScript …
Nothing in an HTTP request can be trusted, including HTTP headers and form data.  A form token is a tool that can be used to guard against request forgeries (CSRF).  This article shows an improved approach to form tokens, making it more difficult to…
The viewer will learn the basics of jQuery, including how to invoke it on a web page. Reference your jQuery libraries: (CODE) Include your new external js/jQuery file: (CODE) Write your first lines of code to setup your site for jQuery.: (CODE)
The viewer will learn the basics of jQuery including how to code hide show and toggles. Reference your jQuery libraries: (CODE) Include your new external js/jQuery file: (CODE) Write your first lines of code to setup your site for jQuery…

828 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question