Tutoriales Spry:
Filtrado no destructivo con Spry
En la primera parte creamos el documento básico que incluía una región deonde se listaban todos los productos. En este segundo paso vamos a añadir las funciones necesarias para ejecutar el filtrado.
El primer paso es crear la función principal. La añadiremos dentro de nuestro encabezado:
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>filtrado no destructivo</title>
<script language="JavaScript" type="text/javascript" src="xpath.js"></script>
<script language="JavaScript" type="text/javascript" src="SpryData.js"></script>
<script language="JavaScript" type="text/javascript">
var dsProductos = new Spry.Data.XMLDataSet("products.xml", "products/product")
var filtrarProductos = function(dataSet, row, rowNumber){
//capturamos el contenido del cuadro de texto
var elTexto=document.getElementById('filterTF').value;
//Creamos la expresion regular con el texto del campo
var miPattern=new RegExp(elTexto,"i");
//si el campo 'name' coincide con la expresion
if (row["name"].search(miPattern) != -1){
return row; //incluir fila en el listado
}else{
return null; //rechazar fila del listado
}
}
</script>
</head>
No es necesario preocuparse de los 3 parámetros definidos (dataSet, row, rowNumber), ya que Spry los enviará automáticamente a la función. Lo importante es el contenido de la misma y, sobre todo las 2 primeras lineas, ya que Spry se encarga del resto, incluido el bucle por todas las filas del dataset. No es necesario utilzar los
Finalmente, sólo nos queda llamar al método filter() de Spry.
Hola.
Gracias por el tutorial, es muy bueno esta bien explicado.
Me gustaría saber cómo se podría sustituir el “input text” del formulario por varios “checkbox” con sus correspondientes valores.
Muchas gracias.
Comentario Por antonio — 29/04/2007 @ 5:14 pm