Fix for Forum Post Expand/Contract Links

We know you have an opinion on how things should be run around here. These are suggestions for the forums, and the website.This forum is not a place to ask for suggestions to your own coding (or otherwise) problems.

Moderator: General Moderators

Post Reply
User avatar
McInfo
DevNet Resident
Posts: 1532
Joined: Wed Apr 01, 2009 1:31 pm

Fix for Forum Post Expand/Contract Links

Post by McInfo »

Edit: This issue has been resolved with recent forum software updates.

I noticed that the Expand/Contract links above code blocks in posts do not work (subsilver2 theme), so I tracked down the problem.

The HTML for posts has this structure. As you can see, the max-height style is applied to the "codeholder" div.

Code: Select all

<div class="postbody">
    <div class="codebox">
        <div class="codeheader"></div>
        <div class="codeholder" style="max-height: 300px;">
            <div id="cb99999" class="php"></div>
        </div>
    </div>
</div>
The Expand/Contract link calls the expandCode() Javascript function.

Code: Select all

<a onclick="expandCode('cb99999'); return false;" href="#">Expand/Contract</a>
And the expandCode() function is defined as

Code: Select all

function expandCode(id){
    var parent = document.getElementById(id);
 
    if ((typeof parent.style.maxHeight != 'undefined') && parent.style.maxHeight == ''){
        parent.style.maxHeight = '300px';
    } else {
        parent.style.maxHeight = '';
    }
}
As it is currently defined, the expandCode() function tries to change the max-height style of

Code: Select all

<div id="cb99999" class="php">
instead of its parent

Code: Select all

<div class="codeholder" style="max-height: 300px;">
Because the code block is still restrained by its parent which has a max-height of 300px, the Expand/Contract button is non-functional.

This can be fixed by adding ".parentNode" to the expandCode() function (line 2).

Code: Select all

function expandCode(id){
    var parent = document.getElementById(id).parentNode;
 
    if ((typeof parent.style.maxHeight != 'undefined') && parent.style.maxHeight == ''){
        parent.style.maxHeight = '300px';
    } else {
        parent.style.maxHeight = '';
    }
}
Edit: This post was recovered from search engine cache.
Last edited by McInfo on Tue Jun 15, 2010 10:38 pm, edited 1 time in total.
User avatar
Benjamin
Site Administrator
Posts: 6935
Joined: Sun May 19, 2002 10:24 pm

Re: Fix for Forum Post Expand/Contract Links

Post by Benjamin »

We are working on getting the code base into SVN. Once that's done we will be able to start working on changes.
User avatar
McInfo
DevNet Resident
Posts: 1532
Joined: Wed Apr 01, 2009 1:31 pm

Re: Fix for Forum Post Expand/Contract Links

Post by McInfo »

Until then, for a temporary fix, I will be using my Greasemonkey script.

Edit: This post was recovered from search engine cache.
Post Reply