 |
BUSCADOR JAVASCRIPT [VIEW ENGLISH].
| TEMARIO ANTERIOR | Principal|
| TEMARIO ANTERIOR | Principal|
|
| TEMARIO ANTERIOR | Principal| |
Es interesante este Buscador JavaSscript por varios motivos, el primero, porque puede ayudar a quienes no tienen la capacidad para poner un motor de bases de datos en el servidor de su proveedor, tienen un servicio gratuito, o simplemente estamos haciendo un select bastante grande con PHP y deseamos que el usuario pueda hacer busquedas en el, evitando así sobrecargar el servidor con código y consultas a la base de datos, de esta manera colabora un poco más el navegador web con el servidor. El script fue probado con Firefox, Mozilla y Konqueror, no fue probado con Internet Explorer porque ya no se usa por cuestiones de seguridad (alomejor funciona, sólo que ya no tengo IE desde hace años)
IDEA Y MOTIVOS EN QUE SE BASAErase una vez una época en la que Internet era algo costoso y temporal, entonces no se podía proveer contenidos offline dinámicos tan fácilmente, algunas empresas utilizaban en los CD-ROMs que entregaban un Servidor Proxy que corria en la PC cliente y falseaban un dominio existía un producto con todo y nombre que hacía eso, aún no recuerdo el nombre pero yo tuve que hacer el mío basado en Java, de esa manera un pequeño webserver ejecutaba las busquedas de catálogos y demás artículos de la base de datos usando CGI. Una vez de tanto ver ingenio en los catálogos HTML, me encontré con una idea original, poner el texto en un arreglo monstruoso, y con JavaScript ocultar y aparecer Layers. Bueno de tantas ideas, volvemos a esta, se crea un objeto de ciertas claves y se añaden a un arreglo grande, pero no existen layers que se ocultan y aparecen sino que es 1 sólo layer que se vacía o regenera con una tabla, de esa manera podemos posicionar la búsqueda en cualquier parte de la hoja web como en este ejemplo a la derecha, y modificando el código, en 2 columnas en vez de 5:).
DESCARGA DEL ZIP CON LOS 3 ARCHIVOS de EJEMPLO y LAS FOTOS ~ 500k |
CONSULTAR BUSCADORPrueba [recamara] y adivina los demás. |
/* This version of JavaScript Calendar can be used by anyone who is not intented
to do profit directly with this code, it means you can not sale the code as is,
you can use it ont your web or php project, or put in a CD Magazine, if you really
do profit with your project and my code consider sharing them :P.
If you want to include the calendar in some web editor, do not remove this legend.
The lastest version can be found at
http://www.compunauta.com/forums/linux/programacion/java/gus_browser.html
This is Open and Free Software, madgus@gmail.com, gustavo@compunauta.com
*/
var CLAVE=0;
var DESCR=1;
var COMEN=2;
var PRICE=3;
var gus_Listado = new Array();
var array_pointer = 0;
function addObject(Clave,Descripcion,Comentario,Precio){
var newObject=new Array(3);
newObject[CLAVE]=Clave;
newObject[DESCR]=Descripcion;
newObject[COMEN]=Comentario;
//newObject[PRICE]=Precio;
gus_Listado[array_pointer++]=newObject;
}
function doSearch(FormName,LayerName,FieldName){
var innerTMP="";
var layer = document.getElementById(LayerName);
var query = document.forms[FormName].elements[FieldName].value.toUpperCase();
layer.innerHTML="";
if (query.length==0){
layer.innerHTML+="<H3>BUSQUEDA VACIA</H3>";
return false;}
var items=0;
var mcols=5;
var pcols=(Math.round(100/mcols));
var cols=0;
var res=0;
innerTMP+="<table align=\"center\" cellpadding=\"5\" width=\"95%\">";
for (var i=0; i<array_pointer; i++){
if((gus_Listado[i][DESCR].toUpperCase().indexOf(query)!=-1) || (gus_Listado[i][CLAVE].toUpperCase().indexOf(query)!=-1) ||
(gus_Listado[i][COMEN].toUpperCase().indexOf(query)!=-1)){
res++;
if(cols==0){innerTMP+="<tr>";}
if(cols==mcols){cols=0;innerTMP+="</tr>\n";}
cols++;
innerTMP+="<td width=\""+pcols+"%\" align=\"center\" border='2'>";
innerTMP+="<b><H3>"+gus_Listado[i][COMEN]+"</H3></b>";
innerTMP+="<A href='img/"+gus_Listado[i][CLAVE].toLowerCase()+".jpg' target='_blank'><IMG SRC='img/"+gus_Listado[i][CLAVE].toLowerCase()+".jpg' width='50' height='50' border='1' alt='"+gus_Listado[i][CLAVE].toLowerCase()+".jpg'></A><br>";
innerTMP+="<i>"+gus_Listado[i][DESCR]+"</i><br>";
innerTMP+="C:<b>"+gus_Listado[i][CLAVE]+"</b>";
innerTMP+="</td>";
}
}
innerTMP+="</table>";
if(res>0){layer.innerHTML=innerTMP;}
else{layer.innerHTML="<H3>BUSQUEDA SIN RESULTADOS</H3>";}
return false;
}