Using DHTML, you can have a categorized view where the categories can be expanded and collapsed on the client, which solves both problems. In this two-part series of articles, we'll look at how it's done.

Obviously, to use this solution you'll need to use a version 4 or higher browser because they support DHTML. You'll also need to have JavaScript enabled. Since Internet Explorer and Netscape handle things differently, I chose to focus my attention on one browser for this series of articles. I chose Internet Explorer because there's some browser event handling which can make the DHTML solution pretty slick. In a widely-fielded solution, you should probably check the browser version and feed a lower resolution set of pages for older and non-enabled browsers.

DHTML overview
First, I'll give the two-minute overview on DHTML. All I'm looking for here is to be able to show and hide parts of the page selectively. To do this, you set a <DIV> tag (division) with a style of "display:none" to hide everything between the <DIV> and </DIV> tags. The absence of the "none" value means everything will be shown. So, we want to have all the category lines shown when the page loads, and all the document lines hidden. Then, when the twisty icon is clicked, we want to show the document lines under that category. Sounds pretty simple, right?

In this article, we'll start with a view with only one category. We'll add a second category in part two of this series. Set up a form with fields called Category1 and Subject. Both are text fields. Then create some documents that'll fall into a couple different categories. You can create a Notes view with the first column categorized on Category1 and the second column with a value of Subject just to see what things will look like.

Build the DHTML view
Now, let's build the DHTML view. First, set up the view (call it DHTMLView1) to have the view contents be HTML on Web access (the beanie tab). This means Domino won't generate any HTML for us, which is what we're going to want. Otherwise, Domino would put links in for each twisty, but we want those to be controlled on the client. Next, make sure that the setting for "collapse all when view is opened" (on the info tab) is not checked. Otherwise, all the rows in the view won't be sent to the browser, and we need them all sent.