Unidad 23. Ejercicio: Uso del Widget de jQuery Autocomplete


Objetivo

Practicar el uso del Widget de jQuery Autocomplete para presentar insertar un campo en un formulario.

Ejercicio

  1. Si no tienes abierto Dreamweaver, ábrelo para realizar el ejercicio.
  2. Si no aparece el panel Archivos, ábrelo a través del menú Ventana, opción Archivos.
  3. Selecciona el sitio Parquenatural de la carpeta ejercicios en el panel Archivos.
  4. Haz doble clic sobre el documento reservas.htm, que aparece en el panel Archivos.
  5. Se abrirá el documento en Dreamweaver.
  6. Graba el archivo como reservas_alternativa.htm
  7. Busca en la página el formulario de contacto y haz clic a la derecha del campo Número de personas.
  8. Escribe Provincia de origen.
  9. Abre el panel Insertar y despliega la categoría jQuery UI.
  10. Haz clic en la opción Autocomplete.
  11. En la carpeta parquenatural hay un archivo de texto llamado provincias.txt, ábrelo con Notepad de Windows y copia el listado de provincias.
  12. Haz clic en el campo Autocomplete para que veas sus propiedades en el Inspector de propiedades.
  13. Copia la lista de provincias en el campo Source.
  14. Abre el panel Diseñador de CSS y pulsa el botón del subpanel Fuentes y elige la opción Definir en página.
  15. Haz clic en el botón del subpanel Selectores y escribe #Autocomplete1, luego Enter, para crear una regla de estilo que modifique el ancho del widget.
  16. Pulsa el botón Diseño del subpanel Propiedades y modifica la propiedad width a 100px.
  17. Guarda la página y pruébala en tu navegador.

Marzo-2015
Volver






Página inicial  Cursos Informática Gratuitos

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


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