• Post Reply
  • Bookmark Topic Watch Topic
  • New Topic

reading a nested list with javascript

 
Stuart Rogers
Ranch Hand
Posts: 141
  • Mark post as helpful
  • send pies
  • Quote
  • Report post to moderator
I have a servlet that creates a HTML unordered list with many nested levels and dynamically loads into my .jsp . Each list element has a checkbox.

Questions: how would I use javascript to iterate through the list top->bottom? could this hypothetical iterator tell when it's descended into/ascended from a deeper level? The object here is to collect all lowest-level elements checked AND all elements under a checked higher-level element.

Can this be done? Has it already been done? Pointers/suggestions/ideas/examples/links are all welcome and appreciated.

TIA,

Still-learning Stuart

 
Eric Pascarello
author
Rancher
Posts: 15385
6
  • Mark post as helpful
  • send pies
  • Quote
  • Report post to moderator
basic idea:



Eric
 
Stuart Rogers
Ranch Hand
Posts: 141
  • Mark post as helpful
  • send pies
  • Quote
  • Report post to moderator
Thank You Eric, I will be trying your method out soon!

Regards,

Still-learning Stuart
 
Stuart Rogers
Ranch Hand
Posts: 141
  • Mark post as helpful
  • send pies
  • Quote
  • Report post to moderator
Hmmm, this didn't quite work out. The getElementsByTagName("li") method works for loading all the list items into a javascript array, but I lose all depth information. I need something to walk the list in exact order while keeping track of the depth , like

var llist = document.getElementById('myulist');
for( ii = 0 ; ii < llist.length ; ii++ ) {
if( llist[ii].elem == "ul") {
cntr++
} else {
if( llist[ii].elem == "/ul") {
cntr--
}
}
}


The overall idea here is when I come to a <li> whose checkbox has been clicked, gather all inner-nested <li> values.



Now what?

Still-learning Stuart
 
Eric Pascarello
author
Rancher
Posts: 15385
6
  • Mark post as helpful
  • send pies
  • Quote
  • Report post to moderator
Not sure what that code you posted does since you are using getElementById and it only pulls in one node.

And if you do getElementsByTagName, it does not pull in /ul so that is not necessary.

I am not sure what you are trying to do exactly, but I will write some code here and see if it helps:


The above is untested, just wrote it in this wonderful textbox on the forum.

Eric
 
Stuart Rogers
Ranch Hand
Posts: 141
  • Mark post as helpful
  • send pies
  • Quote
  • Report post to moderator
I decided to dumb-down my javascript and do the heavy lifting on the server side so now only need to grab the values of checked boxes from the unordered list. Given this list:



and this function:



the function never finds any checked boxes. I've pored over some very similar examples on the 'net so I must be doing something boneheaded again.
Can anyone spot what I'm doing wrong/not doing right?

TIA,

Still-learning Stuart
 
Eric Pascarello
author
Rancher
Posts: 15385
6
  • Mark post as helpful
  • send pies
  • Quote
  • Report post to moderator
Did you debug and see what the first child is?

Why are you pulling lis and not inputs?

Eric
 
Stuart Rogers
Ranch Hand
Posts: 141
  • Mark post as helpful
  • send pies
  • Quote
  • Report post to moderator
I'm using this as my primary template:

http://www.sitepoint.com/blogs/2008/09/16/a-free-javascript-speed-boost-for-everyone/

so collecting the li's should work.

But changing my code to collect the input tags and removing references to firstChild does the trick. Maybe I should quit while I'm (finally) ahead.

Thanks for your continued help Eric!

CASE CLOSED

Still-learning Stuart
 
  • Post Reply
  • Bookmark Topic Watch Topic
  • New Topic