Buscador sencillo para páginas web

Cortesía de iwebcode.

Una de las funcionalidades más imprescindibles en cualquier página web es la posibilidad de realizar búsquedas sencillas. En este recurso se mostrará un procedimiento para crear una caja de búsquedas que permita mostrar los documentos contenidos en la base de datos mediante una búsqueda sencilla.

Para la consecución de este artículo se utilizará la vista de libros ya utilizada en otros (Mejora del aspecto de las vistas de Lotus Notes en la web - 26/6/2002) y que se muestra a continuación:

Vamos a ello:

1. Crear una vista (o modificar una existente) que muestre los documentos que queramos (en este caso libros). Esta vista la llamaremos LibrosBuscar.
2. Crear un nuevo formulario llamado $$SearchTemplate for LibrosBuscar. Es muy importante respetar el nombre ya que este formulario será el utilizado por el sistema para mostrar los resultados de las búsquedas que se realizarán sobre la vista LibrosBuscar. El nombre del formulario siempre se debe construir de la misma forma y tiene dos partes, una parte fija: $$SearchTemplate for, y una parte variable que debe coincidir con el nombre de la vista a utilizar para las búsquedas, en este ejemplo: LibrosBuscar.
3. Dentro del formulario anterior crearemos un campo llamado TotalHits. Este campo debe ser de tipo "Texto" y "Calculado al visualizar". Como valor por defecto pondremos el mismo nombre del campo. Este campo es un campo del sistema y sirve para mostrar el número de coincidencias dentro de la búsqueda, por tanto lo podemos acompañar de un texto aclaratorio como por ejemplo "Se han encontrado xxxxx resultados".
4. Añadiremos otro campo al formulario anterior llamado $$ViewBody. Este campo debe ser de tipo "Texto" y "Editable". No pondremos valor por defecto al campo. A continuación guardaremos el formulario. Podemos ver el aspecto del mismo en la siguiente imagen:

5. Crear un nuevo formulario llamado BuscarLibro. Este formulario contendrá el campo para realizar búsquedas.
6. Dentro de este último formulario crearemos un campo llamado Query. Este campo debe ser de tipo "Texto" y "Calculado al visualizar". Como valor por defecto pondremos el mismo nombre del campo.
7. A continuación del campo anterior escribiremos el siguiente texto HTML. Una vez escrito deberemos marcarlo con la opción Texto HTML del menú Texto para hacer que el servidor interprete dicho texto como HTML puro:

<table width="150" border="0" cellspacing="0" cellpadding="3">
  <tr>
    <td colspan="2"><b>Buscar:</b></td>
  </tr>
  <tr>
    <td><input type="text" name="Query" size="25" /></td>
    <td><input type="button" name="Search" value="Ir"
       onclick="doSearch(this.form.Query);" /></td>
  </tr>
</table>

8. A continuación del texto HTML crearemos otro campo llamado SaveOptions. Este campo debe ser de tipo "Texto", "Editable" y debe estar oculto. Como valor por defecto pondremos el valor "0" (incluyendo las comillas dobles). El formulario debe tener un aspecto parecido al siguiente:

9. Dentro del apartado Encabezado de JS (JavaScript) escribiremos el siguiente código:

function doSearch ( s ) {

  var regExp1 = /field/;
  var regExp2 = /[(,),<,>,[,]]/;
  var str = s.value;
  if ( str == "" ){
    alert("El campo de búsqueda debe contener un valor.");
    s.focus(); }
  else {
    if ( typeof regExp1.source != 'undefined' )
      if ( regExp1.test( str ) || regExp2.test( str ) ){
        var alrt =
          "Algunos de los caracteres introducidos no están admitidos.";
        s.focus();
        return alert( alrt ); }
    openDbRelativeURL("LibrosBuscar?SearchView&Query=" +
      escape( str ) + "&start=1&count=10"); }

}


function openDbRelativeURL( url, target ){

  target = (target == null ) ? window : target;
  path = location.pathname.split('.nsf')[0] + '.nsf/';
  target.location.href = path + url;

}

A continuación guardaremos el fórmulario.

10. Deberéis indexar la base de datos ya que si no las búsquedas no funcionarán.

Si visualizamos el formulario BuscarLibro en el navegador web nos tiene que aparecer algo parecido a esto:

Si ponemos algo en el campo de búsqueda y pulsamos el botón Ir entonces el sistema debería mostrar algo parecido a esto:

Podéis ver un ejemplo práctico pulsando aquí.

Explicación: Existen otros sistemas más sofisticados pero este me ha parecido de lo más sencillo. Quizás la única curiosidad resida en que el campo de búsquedas se crea mediante HTML puro en lugar de utilizar un campo de Notes (Paso 7), esto es debido a que el servidor Domino añade muchas instrucciones propias a los formularios cuando los genera para la web y de este modo se consigue crear un campo que no se vea afectado por dichas intrucciones añadidas. Además el campo SaveOptions evita que un hipotético documento generado a partir del formulario se guarde en la base de datos.