Offline Search

Sarky78 · Apr 11, 2003

We are in the middle of developing a offline catalogue that is going to be run from a CD, and written using HTML and Javascript and is going to run in a web browser. This catalogue is not going to be installed onto the users machine, but run from the CD.

Due to the large number of products (over 3500 items) we want to provide a search facility, that will allow users to search all of the HTML pages on the CD. We used a java applet last time to do this and it worked fine, it just wasn't at all easy to change the look of it (font, colours, size etc).

Has anyone come across a application similar to this that allows for a lot of customization? Remebering that it has to work offline without an internet connection.

It doesn't have to be free, but the cheaper the better

Cheers

Tony

harmmeijer · Apr 11, 2003

This javascript should work up intill 8000 records. It only has 2 colums name and number, if you make more searchable columns it will take longer to find things and/or you have to use vieuwer recors.

The other way is to use applets that loads an xml file, I wrote something like that but never finished it. The result was displayed to the user by setting the innerHTML of a label tag using JSObject:

public class javaData extends java.applet.Applet {
JSObject win;
public void init() {
win = JSObject.getWindow(this);
JSObject outputLabel = (JSObject) win.eval("document.getElementById('lblResultList')&quot

;
outputLabel.setMember("innerHTML", strBufferOutPut.toString());

In both the applet and the javascript I use the showaddress function to show the data. It might be a good idea to use classes on the elements so you can quickly change the look (not implemented in the example)

<HTML>
<body id='thebody'>
<font id='myfont' errortext='nee'></font>
<input type=text id='txtsrc' onKeyUp='add.showaddress(document.getElementById("txtsrc&quot

,document.getElementById("divContent&quot

)'>
<div id='divContent'><h1><center>Loading...</center></h1></div><br>
<script>
function hidethings(){
document.getElementById('txtsrc').style.visibility="hidden";
}
function showthings(){
document.getElementById('txtsrc').style.visibility="visible";
}
window.onbeforeprint=hidethings;
window.onafterprint=showthings;
function addressbook(){
this.arrAddresses = new Array();
this.objDelay = new Object();
}
addressbook.prototype.addAddress =function(strName,strTelephone){
var arrTmp = new Array();
arrTmp[0] = strName;
arrTmp[1] = strTelephone;
this.arrAddresses[this.arrAddresses.length]=arrTmp
}
addressbook.prototype.getAddress =function(strName){
var i = 0;
var arrTmp = new Array();
strName = strName.toLowerCase();
for(i=0;i<this.arrAddresses.length;i++){
if(this.arrAddresses[ i ][0].toLowerCase().indexOf(strName)!=-1){
arrTmp[arrTmp.length] = this.arrAddresses[ i ];
}
}
return arrTmp;
}
addressbook.prototype.showaddress = function (objSearch,objDisplay,blnDelay) {
if(blnDelay==null){
clearTimeout(this.objDelay);
this.objDelay = setTimeout('add.showaddress(document.getElementById("' + objSearch.id + '&quot

,document.getElementById("' + objDisplay.id + '&quot

,false);',500);
}else{
var arrTmp = add.getAddress(objSearch.value);
var i = 0;
var arrContent = new Array();
if(arrTmp.length<400&&arrTmp.length!=0){
arrContent[arrContent.length] = "<table>";
for(i=0;i<arrTmp.length;i++){
arrContent[arrContent.length] = "<tr><td style=\"border-bottom:'1px solid'\">";
arrContent[arrContent.length] = arrTmp[ i ][0];
arrContent[arrContent.length] = "</td>";
arrContent[arrContent.length] = "<td style=\"border-bottom:'1px solid'\">";
arrContent[arrContent.length] = arrTmp[ i ][1];
arrContent[arrContent.length] = "</td>";
arrContent[arrContent.length] = "</tr>";
}
arrContent[arrContent.length] = "</table>";
objDisplay.innerHTML = arrContent.join("&quot

;
}else if(arrTmp.length!=0){
objDisplay.innerHTML = "<center>More than 400 addresses</center>";
}else {
objDisplay.innerHTML = "<center>No addresses.</center>";
}
}
}
addressbook.prototype.sortAddress = function (arrVal1,arrVal2) {
var intReturn = 0;
var j = 0;
while(intReturn==0&&j<arrVal1.length){
if(arrVal1[j]<arrVal2[j]){intReturn=-1;}
if(arrVal1[j]>arrVal2[j]){intReturn=1;}
j++;
}
return intReturn;
}

var add = new addressbook();

//************************************************************************************************************************************
//************************************************************************************************************************************
//************************************************************************************************************************************
//************************************************************************************************************************************
add.addAddress("some name","some number&quot

;
add.addAddress("some other name","some other number&quot

;
//************************************************************************************************************************************
//************************************************************************************************************************************
//************************************************************************************************************************************
//************************************************************************************************************************************

add.arrAddresses = add.arrAddresses.sort(add.sortAddress);
setTimeout("document.getElementById('txtsrc').onkeyup()",5);
setTimeout("document.getElementById('txtsrc').focus()",5);

</script>
</body>
</html>

Tek-Tips is the largest IT community on the Internet today!

Members share and learn making Tek-Tips Forums the best source of peer-reviewed technical information on the Internet!

Offline Search

Sarky78

Programmer

harmmeijer

Programmer

Similar threads

Part and Inventory Search

Sponsor