I write online help and a customer has asked for a customised frameset template with search functionality available in a toolbar. The authoring software I use does part of the work for me, creating a file dhtml_search.js which includes an array containing all of the words used in the help and two functions to display a search field and another to display results in a right-hand frame.
My problem is that I when a user clicks a search result, I want the topics text to display in the same frame as the results but it doesn't.
I get an error that I can't fix.
Page=new Array();Page[0]=new Array("The quick brown fox jumps over the lazy dog","4467.htm");
var PageCount=1;
function search(SearchWord){
var The_form="";
The_form='<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">\n';
The_form+="<html>\n";
The_form+="<head>\n";
The_form+="<meta http-equiv='Content-Type' content='text/html; charset=UTF-8'>\n";
The_form+="<title>Search Results</title>\n";
The_form+='<script language="javascript" type="text/javascript" charset="UTF-8" src="dhtml_search.js"></script>\n';
The_form+='<link rel="stylesheet" type="text/css" href="stylesheet.css">\n';
The_form+="<style type='text/css'>\n";
The_form+=".searchDetails {font-family:tahoma; background-color:white; font-size:7pt; font-weight:normal}\n";
The_form+=".searchResults {font-family:tahoma; font-size:8pt}\n";
The_form+="</style>\n";
The_form+="</head>\n";
The_form+="<body onload='javascript:document.SearchForm.SearchText. focus()'>\n";
The_form+='<table class="searchDetails" border="0" cellspacing="0" cellpadding="2" width="100%">\n';
The_form+='<tr><td></td></tr>';
The_form+='<tr><td>';
The_form+='<form name="SearchForm" action="javascript:show_results(document.SearchFor m.SearchText.value)">';
The_form+='<input type="text" name="SearchText" size="25" value="' + SearchWord + '" />';
The_form+=' <input type="image" src="./search.gif" value="Submit" alt="Submit"/></form>'
The_form+='</td></tr></table>\n';
The_form+="</body></html>";
this.status="";
this.document.open();
this.document.write(The_form);
this.document.close();
}
function show_results(SearchWord) {
var Result="";
var NrRes=0;
if(SearchWord.length>=1){
while(SearchWord.indexOf("<")>-1 || SearchWord.indexOf(">")>-1 || SearchWord.indexOf('"')>-1){
SearchWord=SearchWord.replace("<","<").replace( ">",">").replace('"',""");
}
}
if(SearchWord.length>=1){
SearchWord=SearchWord.toLowerCase();
this.status="Searching, please wait...";
Result+="<table border='0' cellpadding='5' class='searchResults' width='100%'>";
for(j=0;j<PageCount;j++){
k=Page[j].length-1;
for(i=0;i<k;i++){
WordPos=Page[j][i].toLowerCase().indexOf(SearchWord);
if(WordPos>-1){
FoundWord=Page[j][i].substr(WordPos,SearchWord.length);
NrRes++;
Result+="<tr><td>";
Result+="<a href='"+Page[j][k]+"'>"+Page[j][k-1].replace(FoundWord,FoundWord.bold())+"</a><br/>\n";
if(i<k-1){
if(Page[j][i].length>350){
Result+="..."+Page[j][i].substr(WordPos-100,200+FoundWord.length).replace(FoundWord,FoundW ord.bold())+"...\n";
}
else{
Result+=Page[j][i].replace(FoundWord,FoundWord.bold())+"\n";
}
}
Result+="</td></tr>";
break;
}
}
}
Result+="</table>";
Result+="<p class='searchDetails'> " + NrRes + " Resultat(en) gefunden.</p>";
}
var all_content = "<iframe name='BODY' id='myIframe' style='width:100%; height:100%' scrolling='auto' marginwidth='5' marginheight='0' frameborder='0'></iframe>";
var myDiv = window.top.body_right;
myDiv.innerHTML = all_content;
var x=window.top.document.getElementById("myIframe");
var y=x.contentDocument;
y.BODY.innerHTML=Result;
}