Automated tabbed navigation – Agent search results

When implementing the very nice DomGle solution available on OpenNTF I faced the problem that the results were presented in a very long list. Not really user-friendly. After implementing the ‘Ultimate Domino View Navigator‘ by Bob  Obringer which shows a sort of tabbed navigation on top of the view results I wondered if it would be possible to create a mixture, so that the DomGle approach would also contain tabbed navigation.

The DomGle presents the results as one big list. Therefor I needed an approach that would rewrite that list. After going to several searches on Google i found an approach called ‘Semantic tabs‘. 

Semantic tabs

Basically this approach uses a JavaScript libray that rewrites the list you present as tabbed tables when it is being presented to the screen. With a CSS file you define how the tabs will be presented.

After making some modifications in the CSS file my searchresults from the agent looks like this:

tabbed results

What do you need?

  • the JS file tabbed.js
  • the CSS file tabbed.css
  • a LotusScript code that brings the logic to the screen

The first two items you can find under the ‘Semantic tabs’ link. The LotusScript code I set is you find here:

  Set collection =,Nothing,0)
 Print “Content-Type:text/plain”
 Print “Content-Type:text/html” 
 Print |<html>|
 Print |<head>|
 Print |<title>Search Results</title>|
 Print |<script type=”text/javascript” src=”tabber.js”></script>|
 Print | <link rel=”stylesheet” href=”tabber.css” TYPE=”text/css” MEDIA=”screen”>|
 Print |</head>|
 Set doc = collection.GetFirstDocument 
 numberDocs = 50 ‘how many docs to be displayed, make this a variable 
 docCounter = 1 
 Print |<body>|
 Print | <div class=”tabber”>|  
 For x = 0 To collection.count  
  If x Mod numberDocs = 0  Then
   Print |<div class=”tabbertab”>|
   Print |<h2 style=”text-align:center;”>| & docCounter & |</h2>|
   Print |<div>| & “Created: ” & doc.Created  & ” , Article: ” & doc.Tx_ArtName(0)  & |</div>|   
   docCounter = docCounter + 1
   endCounter= endCounter +1
   Print |<div>| & “Created: ” & doc.Created  & ” , Article: ” & doc.Tx_ArtName(0)  & |</div>|   
   endCounter = endCounter+ 1
   If endCounter = numberDocs  Then
    Print |</div>|
   End If
  End If  
  Set doc = collection.GetNextDocument(doc)
 Print |</div>| 
 Print |</body>|
 Print |</html>|


One thought on “Automated tabbed navigation – Agent search results

  1. murugesan 2008-May-19 / 8:19 am

    I am unable to find

    the JS file tabbed.js
    the CSS file tabbed.css

    in ‘Semantic tabs‘. pls mail me the same.

Leave a Reply

Fill in your details below or click an icon to log in: Logo

You are commenting using your account. Log Out /  Change )

Google+ photo

You are commenting using your Google+ account. Log Out /  Change )

Twitter picture

You are commenting using your Twitter account. Log Out /  Change )

Facebook photo

You are commenting using your Facebook account. Log Out /  Change )


Connecting to %s