View expert feedback to this tip.
The JS code below will highlight the keywords of a search inside the actual document(s) returned by the search. Let's talk about assumptions. First, this is an IE5+ solution only (should work in IE4, but not tested). Second, this is an R5 solution (not sure how it would work in ND6). Third, it is assumed that the data being presented to the user is in some kind of table using standard "td" tags.
In my forms, I use pass-thru HTML for everything, but this can also be applied through the HTML properties tab of the design element being used (in this case, a table). The first thing to do is go through your form and identify what table cells actually present data to your users. Once identified, add an "id=" attribute to the "td" tag. In my example I set the "id=" attribute to the string, "searchable". This makes sure that we only highlight data presented to the users instead of field labels, links, etc. Now, add to the "body" element an "onLoad=" statement with the name of the JS function that will highlight the search keywords. In this case, the function name is "highlightWordsInDocument()". Lastly, place the code below into the JSHeader section of your form (you could also paste it in as pass-thru HTML at the END of your form inside of "script" tags -- it must be the last thing on your form, and, in this case, you do not need the "onLoad=" in the "body" element -- or place it inside of the "$$HTMLHead" field).
When your users open the form from your search results view, the search keywords will be highlighted in you document (in read mode only -- i.e., ?OpenDocument). This method takes advantage of the "&Highlight=0,word1,word2,...wordN" string within the URL when opening a document from a search view. When placing the document in edit mode (i.e., ?EditDocument) through a simple button (@Command([EditDocument])), the code will not execute since the "&Highlight=" string is removed from the URL. If you manipulate the URL through JS to place your documents in edit mode, you will have to make sure that the "&Highlight=" string is removed from the URL.
Code
function highlightWordsInDocument(){
var wURL = window.location.href;
var patternToMatch = new RegExp();
if(wURL.indexOf('&') != -1){
var urlArgs = wURL.substring(wURL.
indexOf('&'),wURL.length);
if(urlArgs.indexOf(',') != -1){
var wordsToHighLight = urlArgs.
substring(urlArgs.indexOf(',') +
1,urlArgs.length).split(',');
var aTDs = document.body.
getElementsByTagName("td");
for(var k=0; k < wordsToHighLight
.length; k++){
patternToMatch.compile(words
ToHighLight[k],"gi");
for(var i=0; i < aTDs.length; i++){
if(aTDs[i].getAttribute('id') ==
'searchable'){
aTDs[i].innerHTML = aTDs[i].innerHTML
.replace(patternToMatch,"<span style=
"padding: 2px; background-color:
#CCCCCC">"
+ wordsToHighLight[k] +
"</span>");
}
}
}
}
}
}
EXPERT FEEDBACK TO THIS TIP
If I understand this correctly, the author acknowledges that Domino already highlights search terms in the document in read mode, based on the "&Highlight=" URL argument, and they want to modify this behavior so that only search terms that appear within certain defined areas are highlighted (i.e., just the data, not the static text on the form). It would be nice if that were brought out, because my first reaction on reading this was, "Why would I want to go to all that trouble to do something Domino already does?"
The author talks about using a great deal of pass-thru HTML on his forms. Many developers might rely much more on Domino rendering the form for them, so it would be nice to mention that in Notes 6 the ID attribute of a table cell can be set through the properties dialog in Domino Designer.
-- SearchDomino.com expert
Do you have comments of your own? Let us know.
