Search DominoPower's 11,323 Lotus-related article archive 
Home
EasyPrint
News details Click here for the RSS feed's XML code. This is not a browser URL.
Articles-only Click here for the RSS feed's XML code. This is not a browser URL.
Twitter Feed Click here for the Twitter feed.
PROGRAMMING POWER
Give your Domino views life with DHTML
By Colin Neale

Have you ever wanted to be able to expand and collapse documents in a Notes view from a browser but the view's contents are being treated as HTML and are not being translated by the Domino engine itself?

In this article, I will show you how you can achieve this with a very simple piece of JavaScript that manipulates the HTML elements on your Web page.

The techniques shown below form the basis of the search results views of our C-Search products to allow users to turn document descriptions on an off without the intervention of the Domino server. Figure A shows C-Search results collapsed.

FIGURE A


Here are the results, collapsed. Roll over picture for a larger image.

Figure B shows those same results expanded.

FIGURE B


And here are the expanded results. Roll over picture for a larger image.

Create a simple database
I started by creating a simple database. I added a form with two fields: "Title" and "Description". I also added a categorized view to display the document values. I added a few documents with information taken from one of the Notes help databases. Figure C shows a collapsed view of this document in the Notes client.

FIGURE C


Here's the collapsed view. Roll over picture for a larger image.

If you want to see more detail, Figure D shows the expanded view.

FIGURE D


Here's the expanded view. Roll over picture for a larger image.

I'll now explain how to build a Web view to emulate the Notes Expand-All and Collapse-All features.

Create a Web view
Once I had some documents in my database I created a view for the web. I added the following formula to the first column.

db := "/" + @ReplaceSubstring(@Subset(@DbName;-1);"\\";"/");
url := db + "/0/" + @Text(@DocumentUniqueID) + "?OpenDocument";
"<tr><td><a href =\"" + url + "\">" + Title + "</a>" + "<span class=\"description\" style=\"display:none\">" + Description + "</span></td></tr>"

The formula above builds a link to each document. The output is an HTML table row for each document showing the Title of the document as a hypertext link.

The link is followed by a "span" block-level element assigned to the "description" class. The block's content is taken from the Description field on the document. Note that when the view first loads, the description block will not be seen as the style's display property of the element is set to "none".


1  ·  2  ·  3  ·  Next »
Other articles you might like
Home > Internet Technologies > JavaScript (13 articles)
   Sorting your Domino views with JavaScript
   Using dynamically generated HTML to thwart spam email address harvesting
   Implementing dynamic drop-down menus using Domino and Internet Explorer
Home > Tips & Techniques (102 articles)
   More about Domino log files
   Why your log.nsf might not be purging properly
   A faster way to repair corrupted server files
Get Weekly Email Updates
Subscribe to our regular weekly email newsletter. It's packed with tips, reviews, deep analysis, and the latest news.
 
Recent DominoPower Articles
Lotusphere 2010: mobility and collaboration
2010: A Lotusphere of change
Five trends for 2010
DominoPower TV Episode 1: Inside a strategy session with Teamstudio
More about Domino log files
Say goodbye to the Uh-Ohs. Long live the Tens.
Why your log.nsf might not be purging properly
Latest Lotus Headlines
Recommended Maintenance - Lotus Notes Traveler
Here are the slides and other materials from our Lotusphere session
Microsoft OCS awareness in Lotus Connections and Websphere Portal?
SnTT: XPages Blank Calendar Control (Part 2), adding data
Have your Lotus Notes calendar display multiple time zones
Sample Database for Microsoft Office and Lotus Symphony Integration
Symphony 3.0 beta signals another attack on Office
>> Read all the news
More from the ZATZ journals
Computing Unplugged: The iPad: Apple's latest heartbreaker
David Gewirtz Online: CNN commentary and analysis
OutlookPower: Running auto-respond rules when Outlook is closed
-- Advertisement --

Sophisticated Meets Simple For Document Management
Share. Control. Manage.
Documents, emails, and content in the context of how work is done. Native to Lotus Domino. The User Experience unseen for Lotus Domino. Do more with less. Really.

See the possibilities Docova unleashes for Lotus Domino.
-- Advertisement --

Teamstudio announces the 2010 spotlight awards winners!
We had some extraordinary submissions for the 3rd annual Teamstudio Spotlight Awards, and choosing the winners was no easy task for our judges! Click here to find out who won, and to learn more about these remarkable applications and the genius developers behind them!

Tap here for more information.
ZATZ Home  ·  News  ·  Back Issues  ·  Credits/Trademarks ·  Link To Us
Copyright © 1998-2010, ZATZ Publishing. All rights reserved worldwide.
Editor's Login