BizzyBee’s BizzyThoughts

Expand/collapse sections - a clientside cross-browser solution

In this article I posted a solution to collapse/expand all sections on a Domino web page. However, there was one issue with it: it doesn’t work in Firefox, because Domino renders different html for sections in non-IE browsers.

In non-IE environments, expanding a section means that a request is send to the server to retrieve the section data. This is silly, because the code for this to happen clientside shouldn’t be that different from the IE javascript.

This post is about how to create collapse/expand sections that work in all browsers (as long as JavaScript is enabled). It’s an alternative for this solution, for people who are wanting to put a little more effort in it.

Let’s start with a demonstration before explanation.

A little warning: the little twisty icons don’t show up in my demo page, because I cannot put the default Domino twisties where they should belong. This shouldn’t be a concern for you: if you copy/paste the source of that page in a Domino page and mark the page as html, this should work for you.

Why I made it

Apart from the IE-only restriction, it happens to be that yesterday I read another post on Notes.Net where somebody also had a problem with sections: (with his version of Domino) he couldn’t manage to create a section with a pass-thru table in it: the content of the section couldn’t be pass-thru-milized (is that a word? :-)).

At first, I wanted to help him by trying to reproduce the problem, but I didn’t have the issue overhere. So, as an alternative, I suggested to create his own pass-thru sections. And it perfectly matches the article of yesterday, so yesterday evening I started coding a cross-browser solution for it.

How to use it

You’ll need the source of the demo page for the following procedure.

1. Paste the expandCollapseSection function to your JS Header. Detection if a section is expanded is by looking at the used source file for the twisty. The expand twisty means the section is collapsed (Domino can be funny - they probably meant with the naming: with this icon you can expand stuff) and vice versa.
2. Optionally also paste the expandAllSections and collapseAllSections functions if you want to be able to expand or collapse all sections with a button.
3. Your content must be included in divs with “secx” as id, where x stands for number 1,2,3,… and an initial style=”display: none;” to hide the content.
4. If you want the “expand/collapse all” buttons to work, the images require “twistyiconx” as id.
5. I also used some make-up (styles) to put everything in the right position and style the divs, see for yourself if this suits your needs or change it.

Pfjew! This started as a little comment in a Notes.Net post and ended up to be a lot bigger. I hope you do the cross-browser twist from now one!

(1 votes, average: 5 out of 5)

 Loading ...

6 Responses to “Expand/collapse sections - a clientside cross-browser solution”

1. Benjamin says:
   June 9th, 2008 at 1:09 pm

   >>In non-IE environments, expanding a section means that a request is send to the server to retrieve the section data.

   The behavior for non-IE browser can be controlled through the browser.cnf file at your Domino Data directory. Just remove the hash for the firefox browser:

   Rule Legacy MSIE [4-9]
   Rule Legacy Mozilla/5

2. Martin Vereecken says:
   June 9th, 2008 at 7:39 pm

   Thanks Benjamin,

   A hell of a useful tip!

3. Adam says:
   June 9th, 2008 at 10:49 pm

   Wow - I didn’t realise people still used Domino server!

4. Martin Vereecken says:
   June 10th, 2008 at 7:32 am

   I think you might be surprised if you see the number of people that still use it…

5. Adam says:
   June 10th, 2008 at 10:05 am

   Martin,

   I had a look at the numbers. They are what I expected.
   http://www.thewhir.com/marketwatch/mic032604.cfm
   Based on the Fortune 1000 (enterprise users, surely Domino’s primary market), we get these figures:
   “According to the survey’s results, 53.4 percent of the sites surveyed ran Microsoft IIS, just slightly above last month’s 53.3 percent. The percentage of sites running Apache was 19.5 percent, up 0.2 percent from February. Netscape Enterprise ran 16.5 percent of the sites while the remaining 10.6 percent ran Lotus Domino, Weblogic, Websphere, IBM, SunOne, Zeus and others.”
   Domino is right down in the ‘others’ section

   If you look at Netcraft’s April 2008 survey, which looks at all web servers (not just enterprise), it’s even worse.
   http://survey.netcraft.com/Reports/200804/
   Domino comes in with just 0.052% of web sites.

   You said I might be surprised - I’m not.

   Regards

   Adam

6. Martin Vereecken says:
   June 10th, 2008 at 10:19 am

   Adam,
   You’re right, Domino is almost not used as a web platform on the internet. On the other hand, the companies that use Domino as their mail platform often use it as a web platform for intranet/extranet applications. But I’m sure now you’re gonna throw some extra figures at my head and I’m not good at that kind of debates. I can only say I like Domino as a webform, but I’m sure there are other interesting platforms as well. It’s all a matter of where to use what.

   Regards,
   Martin

Leave a Reply