Unidad 25. Crear Filtros

Objetivo

Practicar la crear filtros en un dataset.

Ejercicio

  1. Si no tienes abierto Dreamweaver, ábrelo para realizar el ejercicio.
  2. Abre el sitio libreria.
  3. Abre el archivo catalogo.php.
  4. En la zona editable busca la tabla que acabamos de añadir en el ejercicio anterior desde la vista de Código.
  5. Justo encima de ella coloca este formulario, debe estar dentro de la región Spry:
    <form action="#" name="formulario">
    <input name="cajadetexto"  type="text" />
    <a href="#" onclick="misLibros.filter(miFiltro)">Buscar</a> | 
                <a href="#" onclick="misLibros.filter()">Mostrar todos</a>
    </form>
    Observa cómo hemos referenciado a una función que todavía no existe llamada miFiltro. Vamos a crearla.
  6. Ve a la parte superior de la página y localiza la zona donde hemos declarado el dataset.
  7. Añade la siguiente función:
    <script type="text/javascript">
    <!--
     var misLibros = new Spry.Data.XMLDataSet("libreria.xml", "biblioteca/libro");
     
     var miFiltro = function(dataSet, row, rowNumber) {
         if (row["autor"].search(document.formulario.cajadetexto.value) != -1
         || row["titulo"].search(document.formulario.cajadetexto.value) != -1
         || row["isbn"].search(document.formulario.cajadetexto.value) != -1) {
            return row;
        } else {
            return null;
        }
     }
    //-->
    </script>
    Con esta función evaluaremos el valor de la caja de texto del formulario y mostraremos únicamente aquellos registros que contengan la cadena escrita en ella en su título, autor o ISBN.
  8. Pulsa la tecla F12 para visualizar la página en el servidor de pruebas.
    Verás como aparece un listado con todos los registros del archivo XML. Si buscas alguna palabra, aparecerán sus coincidencias.
    Observa que la función es sensible a mayúsculas/minúsculas.
  9. Cierra el documento guardando los cambios.

   Inicio