I've come up with a solution to make the nested lists. I'd be happy
for any comments or pointers on the code as this is still all a bit
new for me and I think that I should be able to avoid the first
enumerate through.
Thanks
ul id=header
li id=green class=groupheader
ul
li class=greengrass/li
li class=greentrees/li
/ul
li id=blue class=groupheader
ul
li class=bluesky/li
li class=bluesea/li
/ul
li id=yellow class=groupheader
ul
li class=yellowsun/li
li class=yellowbanana/li
/ul
/ul
var savedClass=;
var groups=new Array;
/* For each list item*/
jQuery(ul#header li).each(function(){
/*Identify each distinct class (or group)*/
if (jQuery(this).attr(class)!=savedClass) {
savedClass=jQuery(this).attr(class);
/*Create an array of the group/class titles*/
groups.push(savedClass);
}
});
/*Loop through all class/groups*/
for( var i = 0; i groups.length; i++ ) {
/*Create the group header*/
jQuery('ul#header').append('li class=groupheader id=' +
groups[i] + '');
/*Add all the group members to the header and wrap them in a
nested
list**/
jQuery('ul#map_header li.' + groups[i]).appendTo(# +
groups[i]).wrapAll(ul/ul);
}
On Feb 20, 9:10 pm, caroig [EMAIL PROTECTED] wrote:
Thanks,
I've used it a few time. What I'm not sure about is how to identify
the first item in each class, create a ul header for it and then add
all the items in the class below that. I can see how I could do it if
I had an array of the distinct classes, but I'm not sure with jQuery
if there is a quick way of getting hold of this, without enumerating
through all items explicitly.
On Feb 20, 8:36 pm, tlphipps [EMAIL PROTECTED] wrote:
Might want to look at the treeview
plugin:http://plugins.jquery.com/project/treeview
On Feb 20, 12:11 pm, caroig [EMAIL PROTECTED] wrote:
I have an app which is producing a ul something like this:-
ul
li class=greengrass/li
li class=greentrees/li
li class=bluesky/li
li class=bluesea/li
li class=yellowsun/li
li class=yellowbanana/li
/ul
I want to create a group the items by the class and then enable
toggling of the group along the lines of:-
+ green
- blue
sky
sea
+ yellow
I guess my best solution is to create a nested list for each class. I
have some javascript that does more or less the same thing, but I'm
not sure how to identify each of the classes without iterating through
the whole lot in jQuery.