Notas de la Asignatura Desarrollo de Aplicaciones Web
Documento creado por: Ing. Julia Gabriela Nieva Paredes PTC TI UTT
Free Powerpoint Templates
Page 1
En Dreamweaver, crear una nueva pgina PHP en su sitio y guardarla como [Link] Escriba connTest como el nombre de la conexin. (Fig 2) Escriba la contrasea correspondiente al usuario (fig 2)
En el panel Databases (dentro de Windows-> Databases), haga click en el botn + y seleccione Conexin MySQL. (Fig. 1)
En el campo MySQL Server, escriba localhost (Fig 2)
En el campo User Name escriba phpUser (el nombre de usuario creado en MySQL) (fig 2)
En el campo DataBase, escriba el nombre de la bd creada para phpUser (fig 2) Si la conexin fue exitosa, presione OK. Esto mostrar la nueva conexin en el panel Databases. (fig 4)
Presione Test, en este momento, Dreamweaver tratar de conectar con la base de datos. (fig 3) Expanda la conexin connTest, y luego expanda la rama Tables. (fig 4)
Free Powerpoint Templates
De esta forma queda establecida la conexin MySQLDreamweaver
Page 2
Fig. 1
Fig. 2
Fig. 4
Fig. 3 Free Powerpoint Templates Page 3
En Dreamweaver, crear una nueva pgina PHP en su sitio y guardarla como [Link] Abrir el panel Server Behaviors (Figura 1), presiona sobre el botn + y selecciona Recordset.
Crea una tabla con dos renglones, en donde el primer rengln contenga los ttulos de los campos de la tabla Esto abre la caja de dilogo RecordSet (Fig. 2)
En el campo Name escriba el nombre del RecordSet (es una variable), y verifique que la conexin y la tabla sean las adecuadas.
Presione OK para cerrar esta ventana y OK para cerrar el cuadro de dilogo Recordset. Abre el panel Bindings para aadir objetos de datos de datos dinmicos a una pgina HTML.
Presione el botn Test, lo que genera que se muestren los resultados de la consulta de la base de datos (Fig 3).
El Recordset debe estar listado en el panel Server Behaviors. Guarda el archivo. Ah est listado el Recordset creado (getData). Expandelo al hacer click en el +.(Fig.4) Guarda el archivo y prubalo con F12
Arrastra cada uno de los elementos del Recordset a la pgina HTML, en el lugar donde quieres que sea mostrado el contenido del campo.
Free Powerpoint Templates
Page 4
Fig. 1
Fig. 3
Fig. 2
Free Powerpoint Templates
Fig. 4
Page 5
Selecciona la etiqueta <tr> de la tabla en donde se muestran los datos de la tabla. (Fig. 1) Abre el panel Server Behaviors y haz click en el botn +
Selecciona Repeat Region
Esto abre la caja de dilogo RepeatRegion (Fig. 2)
En el nombre del RecordSet ya se encuentra seleccionado el RecordSet creado anteriormente.
En la opcin Show, selecciona el nmero de registros que se quieren mostrar.
Presione OK para cerrar esta ventana y OK para cerrar el cuadro de dilogo Recordset.
Guarda el archivo y prubalo con F12.
El resultado se muestra en la Fig. 3.
Free Powerpoint Templates
Page 6
Fig. 1 Fig. 2
Fig. 3
Free Powerpoint Templates
Page 7
Selecciona Insert -> Data Objects -> Recordset Paging -> Recordset Navigation Bar (Fig 1)
Esto abre la caja de dilogo Recordset Navigation Bar (Fig. 2)
En el nombre del RecordSet ya se encuentra seleccionado el RecordSet creado anteriormente.
Selecciona el tipo de despliegue de los botones de la barra, ya sea en imgenes o en texto.
Presione OK para cerrar esta ventana. La barra de navegacin se muestra en la fig. 3.
Guarda el archivo y prubalo con F12. Free Powerpoint
Templates
Page 8
Fig. 1
Fig. 2
Fig. 3 Free Powerpoint Templates
Page 9
En Dreamweaver, crea una pgina nueva de tipo php.
Crea un formulario con los objetos necesarios para capturar los datos en la tabla alumnos (Fig. 1)
Abre el panel Server Behaviors, click en el botn + y selecciona Insert Record
La caja de dilogo Insert Record automticamente despliega los valores correctos.
En la opcin columna, se indican el tipo de datos para cada campo. Si dice que no hay valor, hay que revisar que los nombres de los objetos del formulario sean los mismos que los campos de la tabla
Presiona OK, guarda el archivo y prubalo con F12.
Free Powerpoint Templates
Page 10
Fig. 1
Fig. 2
Fig. 3 Free Powerpoint Templates
Page 11
En Dreamweaver, crea una pgina nueva de tipo php. ([Link]) Selecciona el texto Editar y haz click en el icono de carpeta de la seccin Link de la ventana de Propiedades (fig.2) Se abre la caja de dilogo Parameters. Escribe el nombre del campo llave de la tabla, en este caso, matricula, en la caja Name(fig.4) Abrir la pgina [Link], en la que se despleg el contenido de la tabla alumnos. Agregar dos columnas al final de la tabla (ver fig.1)
En la caja de dilogo, selecciona el archivo [Link] y haz click en el botn Parmetros (Parameters) (Ver fig. 3) Esto abre la caja Dynamic Data, con el RecordSet creado (getData). Expndelo y selecciona el campo matricula (fig.5)
En la caja Value, haz click en el rayo que est a la derecha (fig.4)
Presiona Presiona OK, la caja OK 2 veces Parameters ms para se muestra cerrar los ahora como dilogos en la fig. 6 Free Powerpoint abiertos
El texto Editar debe observarse como en la fig.7. El azul de la fuente es por que el texto es un hipervnculo, y el azul claro de fondo de la celda indica que contiene cdigo Templates PHP.
Guarda el archivo [Link]
Page 12
Fig. 1
Fig. 2
Free Powerpoint Templates
Page 13
Fig. 4
Fig. 3
Fig. 6 Fig. 7
Free Powerpoint Templates Fig. 5
Page 14
En Dreamweaver, abre la pgina [Link] Crea un formulario con los objetos necesarios para capturar los datos en la tabla alumnos (Fig. 1)
Asegrate que los nombres de las cajas de texto sean iguales que los campos de la tabla a leer. (Fig. 2)
Abre el panel Server Behaviors, click en el botn + y selecciona Recordset
La caja de dilogo RecordSet automticamente despliega los valores correctos. (Fig. 3)
En la opcin Filter, selecciona matricula de la lista desplegable. (Fig. 3)
En el panel Bindings se muestra el Recordset. Expndelo, y arrastra cada uno de los componentes del RecordSet hasta su correspondiente caja de texto del formulario. (Fig.4)
Presiona OK, guarda el archivo. Para probar, previsualiza el archivo [Link].
Free Powerpoint Templates
Page 15
Fig. 2
Fig. 1
Fig. 3 Free Powerpoint Templates
Fig. 4 Page 16
En Dreamweaver, abre la pgina [Link]
A la derecha del botn Guardar, inserta un campo oculto: Insert -> Form -> Hidden Field
Con el campo oculto seleccionado, cambia su nombre en el panel de Propiedades a matricula, y haz click sobre el rayo a la derecha de la caja Value. (Fig.1)
En el cuadro de dilogo Dynamic Data (fig 1) selecciona matricula del Recordset mostrado, y presiona Ok.
Este valor ser pasado al comportamiento Update Record.
Abre el panel Server Behaviors y selecciona Update Record (fig. 2)
Dreamweaver debe haber seleccionado los valores adecuadamente, por lo que presiona click. (Fig. 3)
Guarda el archivo. Para probar, previsualiza el archivo [Link], selecciona Editar del registro que desees modificar.
Free Powerpoint Templates
Page 17
Fig. 1
Fig. 2
Free Powerpoint Templates Fig. 3
Page 18
Para borrar un registro, crea la pgina [Link]
En la pgina [Link], edita el hipervnculo Borrar tal y como se hizo para Editar
En la pgina [Link], en el panel Server Behaviors, haz click en el botn + y aade un Delete Record (fig.1)
El cuadro de dilogo Delete Record (fig 2) ya est configurado, revisa que los datos sean correctos y presiona Ok.
Guarda el archivo. Para probar, previsualiza el archivo [Link], selecciona Borrar del registro que desees borrar.
Free Powerpoint Templates
Page 19
Fig. 1
Fig. 2
Free Powerpoint Templates
Page 20
Crea una nueva pgina PHP y gurdala como [Link]
En la pgina [Link], crea el formulario mostrado en la fig.1
En la base de datos ya debe existir una tabla llamada usuarios
Selecciona el campo password y en el panel de Propiedades selecciona la opcin Password para que Dw oculte lo que el usuario escriba en esa caja.
En el panel Server Behaviors, selecciona User Authentication > LogIn User
Configura este cuadro tal y como se muestra en la fig. 2., y presiona OK
Guarda la pgina y prueba con F12.
Free Powerpoint Templates
Page 21
Fig. 1
Fig. 2
Free Powerpoint Templates
Page 22
Antes de crear una pgina Web con PHP, deber estar corriendo el panel de control de XAMPP, con los servidores Apache y MySQL ejecutndose.
El sitio se debe crear dentro de la carpeta c:\xampp\htdocs\
Se debe configurar el servidor de prueba en Dreamweaver.
Para conectar con una base de datos, se debe crear una conexin y probarla.
Para trabajar con los datos de las tablas, el panel Server Behaviors tiene un tipo especifico de objeto dinmico, que depender de la accin requerida. (RecordSet, InsertRecord, UpdateRecord, etc)
Free Powerpoint Templates
Page 23
