Collapsable list where text is in columns with headers (like a forum for example)

On Sep 26, 4:26 pm, David Mark <dmark.cins...@gmail.comwrote:

Oops. Left out the memory leak cleanup.

global.onunload = function() {
i = 0;
l = anchors.length;
while (i < l) { anchors[i++].onclick = null; }
};

Goes right before this line:

el.style.visibility = 'visible';

Thanks Mark

I'll take a look today. I had given up on the idea of column alignment for
columns 2 and 3 as there were issues with overflow text etc.

Thanks for the memory cleanup bit as well. I've been programming for years
but rarely for the web so I would have missed that one till it bit me on the
backside.

Thanks again

Mark

"David Mark" <dm***********@gmail.comwrote in message
news:11**********************@d55g2000hsg.googlegr oups.com...

On Sep 26, 4:26 pm, David Mark <dmark.cins...@gmail.comwrote:

Oops. Left out the memory leak cleanup.

global.onunload = function() {
i = 0;
l = anchors.length;
while (i < l) { anchors[i++].onclick = null; }
};

Goes right before this line:

el.style.visibility = 'visible';

David Mark wrote:
[a sample application]

Good one.

Mark wrote:

This works great (thanks), the only issue I got though is that in firefox
long strings don't wrap, i.e. the cell height remains constant and the table
gets wider. I even tried fixing the widths of the table and cells (in
pixels), still doesn't wrap) and then dropped the whole table inside another
fixed width table and it still gets wider rather than wrapping.

Comment out or remove 'white-space:nowrap' from the 'table.posts td' CSS.

Excellent, thanks pr

"pr" <pr@porl.globalnet.co.ukwrote in message
news:JC******************@newsfe3-win.ntli.net...

Mark wrote:

>This works great (thanks), the only issue I got though is that in firefox
long strings don't wrap, i.e. the cell height remains constant and the
table gets wider. I even tried fixing the widths of the table and cells
(in pixels), still doesn't wrap) and then dropped the whole table inside
another fixed width table and it still gets wider rather than wrapping.

Comment out or remove 'white-space:nowrap' from the 'table.posts td' CSS.

On Sep 27, 3:10 am, "Mark" <Mr...@asdfgh.comwrote:

Hello again

This works great (thanks), the only issue I got though is that in firefox
long strings don't wrap, i.e. the cell height remains constant and the table
gets wider. I even tried fixing the widths of the table and

This was by design.

cells (in

pixels), still doesn't wrap) and then dropped the whole table inside another
fixed width table and it still gets wider rather than wrapping.

Work fine in IE6 though, will keep plugging at the firefox issue.

You mean the cells did wrap in IE6? That's surprising to me. I
didn't test it in IE6, but I thought the CSS I used would work the
same in IE6 as IE7 (except for the tr:hover rule.) I did just notice
that the headers are wrapping as I left out a white-space rule for
them.

On Sep 27, 7:31 am, pr <p...@porl.globalnet.co.ukwrote:

David Mark wrote:

[a sample application]

Good one.

Thanks. It turned out better than I thought it would.

Cool... I pulled out the white-space rule and everything wraps in FF and IE
now.

IE6 was ok before, not sure why. If I get time I'll put the white-space rule
back and see what happens.

Cheers

Mark

"David Mark" <dm***********@gmail.comwrote in message
news:11**********************@k79g2000hse.googlegr oups.com...

On Sep 27, 3:10 am, "Mark" <Mr...@asdfgh.comwrote:

>Hello again

This works great (thanks), the only issue I got though is that in firefox
long strings don't wrap, i.e. the cell height remains constant and the
table
gets wider. I even tried fixing the widths of the table and

This was by design.

cells (in

>pixels), still doesn't wrap) and then dropped the whole table inside
another
fixed width table and it still gets wider rather than wrapping.

Work fine in IE6 though, will keep plugging at the firefox issue.

You mean the cells did wrap in IE6? That's surprising to me. I
didn't test it in IE6, but I thought the CSS I used would work the
same in IE6 as IE7 (except for the tr:hover rule.) I did just notice
that the headers are wrapping as I left out a white-space rule for
them.

On Sep 27, 3:10 pm, "Mark" <Mr...@asdfgh.comwrote:

Cheers David

I wanted to allow wrapping as the string lengths can be quite long and I'm
not keen on horizontal scrollbars.

I don't care for horizontal scrollbars either. So for long-winded
table cell text, wrapping makes sense.

>
Top solution btw

Thanks.

On Sep 27, 3:10 pm, "Mark" <Mr...@asdfgh.comwrote:

Cheers David

[snip]

I went to turn this into an object, which required removing the hide-
while-loading logic and noticed a mistake. This line:

el.style.visibility = 'visible';

It's nested one level too deep. Move it out one level and change it
to:

if (el) { el.style.visibility = 'visible'; }

Also, this widget should be used with a print style sheet. Two
actually as it exposes yet another CSS bug in IE.

<style type="text/css" media="print">
tr.hidden { display:table-row }
a.open, a.closed { text-decoration:none;color:black;background-
color:inherit }
a.open:before { content: "" }
a.closed:before { content: "" }
</style>
<!--[if IE]>
<style type="text/css" media="print">
tr.hidden { display:block }
</style>
<![endif]-->

On Sep 26, 9:54 pm, David Mark <dmark.cins...@gmail.comwrote:

On Sep 26, 4:26 pm, David Mark <dmark.cins...@gmail.comwrote:

Oops. Left out the memory leak cleanup.

global.onunload = function() {
i = 0;
l = anchors.length;
while (i < l) { anchors[i++].onclick = null; }

};

Goes right before this line:

el.style.visibility = 'visible';

David, thanks to your sample code post I have now lowered my self
evaluation of my javascript skills by 2 points. ;) Could you tell me
what memory leak you're referring to? I thought garbage collection
would pick this stuff off.

Bob

On Sep 28, 10:09 am, beegee <bgul...@gmail.comwrote:

On Sep 26, 9:54 pm, David Mark <dmark.cins...@gmail.comwrote:

On Sep 26, 4:26 pm, David Mark <dmark.cins...@gmail.comwrote:

Oops. Left out the memory leak cleanup.

global.onunload = function() {
i = 0;
l = anchors.length;
while (i < l) { anchors[i++].onclick = null; }

};

Goes right before this line:

el.style.visibility = 'visible';

David, thanks to your sample code post I have now lowered my self
evaluation of my javascript skills by 2 points. ;) Could you

tell me

I've lowered my own several points based on the post from late last
night. I must have been really tired when I came up with that one.
Change the correction to:

if (el && el.style) { el.style.visibility = 'visible'; }

Moving the line out a level meant that the style property was not
assured.

what memory leak you're referring to? I thought garbage collection
would pick this stuff off.

IE has a bug where closures that create circular references involving
DOM objects are not garbage collected.

http://www.jibbering.com/faq/faq_notes/closures.html

Read this line carefully and you will see that every anchor will leak
the code in its onclick event. The solution is to break the circular
references when the page is unloaded.

elPost.onclick = anchors[i].onclick = (function(posts, el) { var b;
return function(e) { e = e || global.event; b = (el.className ==
'closed'); el.className = (b)?'open':'closed'; showPosts(posts, b); if
(e.stopPropagation) { e.stopPropagation(); } e.cancelBubble = true;
return false; }; })(posts, anchors[i]);

In short, the onclick property of anchors[i] is an anonymous function
which creates a closure referencing anchors[i] as el.