Ejercicio paso a paso. Unidad 20. Filtrar con Parámetros (II)


Ahora crearemos un archivo buscar.php.

1 Abre un archivo dinámico nuevo basado en la plantilla libreria.dwt.php (Archivo → Nuevo, pestaña Plantillas) y guárdalo como buscar.php.

2 En la zona donde puedes incluir contenido añade el siguiente párrafo:

Introduce en la siguiente caja de texto el nombre del título o el autor del libro y nosotros lo buscaremos por ti:

3 Inserta un formulario con nombre formulario a continuación (Insertar → Formulario → Formulario).

4 Coloca el cursor dentro del formulario.

5 Inserta un campo de texto desde el menú Insertar → Formulario → Campo de texto.

6 En el panel de Propiedades escribe buscar como id del Campo de texto.

Así le pasaremos su contenido a la URL en el parámetro buscar.

7 Seleciona el formulario haciendo clic en la etiqueta <form> y cambia el método de POST a GET.

Como ya hemos comentado es necesario hacerlo de esta forma para que el código generado por Dreamweaver funcione correctamente.

8 También establece como acción buscar.php, es decir, el mismo archivo.

9 Inserta un botón al lado del campo de texto desde el menú Insertar → Formulario → Botón.

10 En el panel Propiedades cambia su propiedad Value a Buscar.

11 Inserta dos saltos de línea (CTRL + ENTER).

12 Crea un bloque div con id listado (Insertar → Objetos de diseño → Etiqueta DIV).

13 Coloca el cursor dentro del bloque, y escribe:

Su búsqueda de ha devuelto resultados:

Vamos ahora a insertar el título pasado como parámetro.

14 Posiciona el cursor delante de la palabra ha.

15 Selecciona del menú Insertar → Objetos PHP → Variables de URL

Se creará el siguiente código:

<?php $_GET[]; ?>

16 Sólo nos falta indicar el nombre de la variable URL escribiendo 'buscar' dentro de los corchetes; no te olvides de las comillas simples.

17 Desde la vista Código encierra el código php entre etiquetas <i> para que el título aparezca en cursiva.

El código resultante deberá ser este:

Su b&uacute;squeda de <i>'<?php echo $_GET['buscar']; ?>'</i> ha devuelto resultados:

 

18 Vuelve a la vista de Diseño.

Ahora crearemos un juego de registros para esta página que se cree filtrándose por el texto introducido en la caja del formulario.

19 Haz clic en el botón Recordset para crear un nuevo juego de registros.

20 En el cuadro de diálogo que se abrirá rellena los datos de la siguiente forma: en Nombre escribe busqueda.

21 En Conexión selecciona libreria_aulaclic.

22 En Tabla selecciona libros.

23 Modifica la opción Filtro para que pueda leerse: Titulo = Parámetro URL buscar.

Hemos creado un filtro que tomará el valor del parámetro buscar en la URL y lo comparará con el valor del campo Titulo.

Ahora insertaremos el total de registros entre las palabras devuelto y resultados.

24 Posiciona el cursor entre las palabras devuelto y resultados.

25 Haz clic en la opción Total de registros de la barra Aplicación.

La línea quedará así:

Su b&uacute;squeda de <i>'<?php echo $_GET['buscar']; ?>'</i> ha devuelto <?php echo $totalRows_busqueda ?> resultados:

Vamos a crear el listado que se corresponda con el recordset que acabamos de crear.

26 Aún dentro del bloque que hemos creado, crea un bloque div con id item (Insertar → Objetos de diseño → Etiqueta DIV).

27 Dentro del bloque con id item inserta la imagen imagenes/item.gif.

28 A la imagen asígnale la clase img_item.

29 Arrastra el campo Usado desde el panel Vinculaciones sobre el cuadro origen de las propiedades de la imagen para que se pueda leer:

imagenes/item<?php echo $row_libros_mas_vendidos['usado']; ?>.gif

30 Luego arrastra desde el panel Vinculaciones el elemento Titulo y colócalo después de la imagen y ponlo en negrita.

31 Haz doble clic sobre él en el panel Comportamientos del Servidor para ponerlo en mayúscula seleccionando el formato Poner en mayúsculas.

32 Introduce un salto de línea (CTRL + ENTER).

33 Arrastra el elemento Autor desde el panel Vinculaciones y ponlo en cursiva.

34 Introduce un salto de línea (CTRL + ENTER).

35 Arrastra el elemento Editorial desde el panel Vinculaciones.

36 Introduce un salto de línea (CTRL + ENTER).

37 Escribe ISBN: y arrastra el elemento ISBN desde el panel Vinculaciones.

38 Introduce dos salto de línea (CTRL + ENTER).

39 Arrastra el elemento Precio desde el panel Vinculaciones y dale la clase precio.

40 A continuación escribe y añade la imagen imagenes/compra.gif.

41 La imagen que acabamos de añadir deberá tener la alineación a Texto superior.

42 Enlaza la imagen a comprar.php?id= desde el campo Vínculo del panel Propiedades.

43 Al enlace añadele al final el Id, arrastrándolo desde el panel Vinculaciones.

44 Inserta un bloque DIV (Insertar → Objetos de diseño → Etiqueta DIV), dale el id salto_linea desde el panel Propiedades.

Vamos a ahora hacer que se muestren cuatro libros por página.

45 Selecciona el bloque item y salto_linea.

46 Selecciona la opción Repetir Región en la barra de Aplicación.

47 Haz que se repita 4 veces.

Estamos repitiendo el bloque de la información del libro y añadiendo un bloque con un salto de línea para separarlo del siguiente.

 

48 Finalmente, y aún dentro del bloque con id listado, inserta una tabla de 3 columas y 1 fila de 100% de ancho.

Las tres columnas tienen que tener un 33% de ancho.

La celda central estará alineada al centro.

La celda de la derecha estará alineada a la derecha.

 

49 En la primera celda introduce un elemento de navegación Anterior, utiliza la opción Mover a la página anterior de la barra Aplicación.

50 Selecciona el elemento Anterior y haz que no se muestre en la primera página haciendo clic en la opción Mostrar si no es la primera página de la barra Aplicación.

51 En la tercera celda introduce un elemento de navegación Siguiente, utiliza la opción Mover a la página siguiente de la barra Aplicación.

52 Selecciona el elemento Siguiente y haz que no se muestre en la última página haciendo clic en la opción Mostrar si no es la última página de la barra Aplicación.

53 Para terminar en la celda central introduce un elemento Registro final seguido del texto " de " y un elemento Total de Registros.

Te quedará algo así:

<?php echo min($startRow_busqueda + $maxRows_busqueda, $totalRows_busqueda) ?> de <?php echo $totalRows_busqueda ?>

 

Ahora haremos que sólo se muestre la información si se han encontrado registros

54 Selecciona todo el contenido que hemos añadido hasta ahora, sin incluir el formulario .

55 Selecciona la opción Mostrar si el juego de registros no está vacío de la barra Aplicación.

 

56 Para comprobar que funciona correctamente pulsa la tecla F12 para copiar el archivo al servidor de pruebas.

Verás que el archivo sólo muestra el formulario.

57 Introduce el título de un libro en él.

De momento esta página sólo muestra los resultados para las entradas exactas de nombres de libros, más adelante cambiaremos eso.

Finalmente vamos a añadir una caja de búsqueda a nuestra plantilla.

1 Abre la plantilla libreria.dwt y en la barra de menú añade al final del todo el siguiente código:

<span class="item"><form action="buscar.php"><input type="text" name="buscar" /></form></span>

Hemos añadido un formulario que ejecutará el archivo buscar.php pasándole un parámetro buscar con el valor que escribamos en la caja de texto.

2 Guarda la plantilla y aplícala sobre todos los archivos anteriores.

3 Guarda todos los cambios en los archivos abiertos.

4 Selecciona todos los archivos PHP en el panel Archivos y haz clic derecho sobre cualquiera de ellos.

5 Selecciona la opción Vista previa en el Navegador para que se copien al servidor de pruebas.

6 Prueba cómo funciona el formulario del menú.

Recuerda que deberás escribir un título de un libro exacto.

 




Anterior... Ir a la página anterior Índice del curso  



Página inicial  Cursos Informática Gratuitos

Síguenos en:   Facebook       Sobre aulaClic            Política de Cookies


© aulaClic. Todos los derechos reservados. Prohibida la reproducción por cualquier medio.