Bug Tracker

#1457 closed bug (worksforme)

Opened August 02, 2007 06:23PM UTC

Closed September 24, 2007 09:14PM UTC

Last modified March 15, 2012 05:09PM UTC

treeview does not display lastCollapsable

Reported by: jgriffin316 Owned by:
Priority: major Milestone: 1.1.4
Component: plugin Version: 1.1.3
Keywords: treeview Cc:
Blocked by: Blocking:
Description

If the last item in a sublist is another sublist the lastCollapsable icon is not displayed. This has been tested on Firefox 2.0 and IE 6.0. In the example listed below Item 2.2 should have lastCollapsable as a class, instead it has last. I am using jQuery 1.1.3 and treeview 1.2.

<!DOCTYPE html PUBLIC "-W3CDTD XHTML 1.0 StrictEN" "http:www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">

<head>

<title>Treeview Test</title>

<meta http-equiv="content-type" content="text/html; charset=iso-8859-1"/>

<script src="jquery.js" type="text/javascript"></script>

<script src="jquery.treeview.js" type="text/javascript"></script>

<script type="text/javascript">

$(document).ready(function(){

$("ul").Treeview();

});

</script>

<style type="text/css">

.treeview, .treeview ul {

padding: 0;

margin: 0;

list-style: none;

}

.treeview li {

margin: 0;

padding: 4px 0 3px 20px;

}

.treeview li { background: url(images/tv-item.gif) 0 0 no-repeat; }

.treeview .collapsable { background-image: url(images/tv-collapsable.gif); }

.treeview .expandable { background-image: url(images/tv-expandable.gif); }

.treeview .last { background-image: url(images/tv-item-last.gif); }

.treeview .lastCollapsable { background-image: url(images/tv-collapsable-last.gif); }

.treeview .lastExpandable { background-image: url(images/tv-expandable-last.gif); }

</style>

</head>

<body>

<ul>

<li>Item 1

<ul>

<li>Item 1.1</li>

</ul>

</li>

<li>Item 2

<ul>

<li>Item 2.1

<ul>

<li>Item 2.1.1</li>

<li>Item 2.1.2</li>

</ul>

</li>

<li>Item 2.2

<ul>

<li>Item 2.2.1</li>

<li>Item 2.2.2</li>

</ul>

</li>

</ul>

</li>

</ul>

</body>

</html>

Attachments (0)
Change History (4)

Changed August 30, 2007 08:17AM UTC by mbirth comment:1

This can be solved by removing these lastCollapsable and lastExpandable appearances (lines# 113, 114, 187, 196, 216 and 221) from the treeview source code so that all last elements have both classes, "last" and "collapsable", assigned. You just have to change the CSS code to:

.treeview .last.collapsable { background-image: url(img/treeview/tv-collapsable-last.gif); }
.treeview .last.expandable { background-image: url(img/treeview/tv-expandable-last.gif); }

Works fine for me. You can even replace the remaining few replaceClass() and swapClass()-calls by chained toggleClass() or removeClass().addClass() statements and then remove those two functions.

Changed August 30, 2007 08:33AM UTC by mbirth comment:2

Just for the curious ones:

0186: .swapClass( CLASSES.collapsable, CLASSES.expandable )

can be replaced by

0186: .toggleClass( CLASSES.collapsable ).toggleClass( CLASSES.expandable )

and

0195: .replaceclass( CLASSES.collapsable, CLASSES.expandable )

with

0195: .filter( CLASSES.collapsable ).removeClass( CLASSES.collapsable ).addClass( CLASSES.expandable ).end()

Then you can remove lines 138 through 153 (swapClass and replaceClass).

Changed September 03, 2007 11:32AM UTC by gnattali comment:3

this problem occurs when the target "ul" is not specified uniquely.

so in this example case

$(document).ready(function(){ $("ul").Treeview(); });

this part should be like following

$(document).ready(function(){ $("body > ul").Treeview(); });

or

if you don't like to care about these kind of trivial things,

change the source as follows

0216: .swapClass(CLASSES.last, CLASSES.lastExpandable)

to

0216: .replaceclass(CLASSES.last, CLASSES.lastExpandable)

and

221: .swapClass(CLASSES.last, CLASSES.lastCollapsable)

to

221: .replaceclass(CLASSES.last, CLASSES.lastCollapsable)

Changed September 24, 2007 09:14PM UTC by joern comment:4

resolution: → worksforme
status: new → closed

I can't replicate the initial issue.

From the suggested code improvements, only the last one actually works. Commited in revision [3471].