Elaboracion de una bd con dreawever

30
UNIVERSIDAD TECNONOLÓGICA DEL ESTADO DE ZACATECAS UNIDAD ACADÉMICA DE PINOS TECNOLOGÍAS DE LA INFORMACIÓN Y COMUNICACIÓN MONICA DE LOS ANGELES RAMIREZ MORENO TECNOLOGIAS DE LA INFORMACION Y COMUNICACIÓN(Tics) ELOY CONTRERAS DELIRA 4°”A” 08/Nov/13 Desarrollo De Aplicaciones II MANUAL DE CÓMO GUARDAR Y HACER LISTAS CON REGISTROS EN DREAMWEAVER CON CONEXIÓN XAMPP

Transcript of Elaboracion de una bd con dreawever

Page 1: Elaboracion de una bd con dreawever

UNIVERSIDAD TECNONOLÓGICA DEL ESTADO DE ZACATECAS UNIDAD ACADÉMICA DE PINOS

TECNOLOGÍAS DE LA INFORMACIÓN Y COMUNICACIÓN

MONICA DE LOS ANGELES RAMIREZ MORENO

TECNOLOGIAS DE LA INFORMACION Y COMUNICACIÓN(Tics)

ELOY CONTRERAS DELIRA

4°”A”

08/Nov/13

Desarrollo De Aplicaciones II

MANUAL DE CÓMO GUARDAR Y HACER LISTAS CON REGISTROS EN DREAMWEAVER CON

CONEXIÓN XAMPP

Page 2: Elaboracion de una bd con dreawever

UNIVERSIDAD TECNONOLÓGICA DEL ESTADO DE ZACATECAS UNIDAD ACADÉMICA DE PINOS

TECNOLOGÍAS DE LA INFORMACIÓN Y COMUNICACIÓN

Primeramente abrimos xampp para prender mysql y el apache para crear la

base de datos y tener conexión con el dreawever y la base de datos

Después abrimos un navegador de nuestra preferencia y le ponemos html:

//localhost/ en la barra de direcciones

Page 3: Elaboracion de una bd con dreawever

UNIVERSIDAD TECNONOLÓGICA DEL ESTADO DE ZACATECAS UNIDAD ACADÉMICA DE PINOS

TECNOLOGÍAS DE LA INFORMACIÓN Y COMUNICACIÓN

Luego le damos clic a phpmyadmin

Luego ponemos el nombre de la base de datos que vamos a necesitar y

luego le damos crear

Page 4: Elaboracion de una bd con dreawever

UNIVERSIDAD TECNONOLÓGICA DEL ESTADO DE ZACATECAS UNIDAD ACADÉMICA DE PINOS

TECNOLOGÍAS DE LA INFORMACIÓN Y COMUNICACIÓN

Y nos dice que nuestra base de datos fue creada con éxito a bajo de este

mensaje nos muestra dos cuadros de texto en los cuales vamos a introducir

el nombre de la tabla que vamos a ocupar en la base de datos y el numero

de campos que utilizaremos. Y le damos continuar y nos muestra la

siguiente imagen

En los cuales vamos a poner el id del alumno, tipo int(entero), le damos que

es primary (que es la llave primaria) y le damos clic en A_T (este es para que

sea incrementable el id) ; ponemos el siguiente campo en el ponemos el

nombre del alumno, que sea tipo varchar, de tamaño 50; luego en el

siguiente campo le ponemos los apellidos del alumno, de tipo varchar, de

tamaño 50; en el otro campo le ponemos la dirección del alumno, de tipo

varchar, con tamaño 50; en el quinto campo le ponemos teléfono del alumno,

de tipo int (entero), de tamaño 10 y por ultimo le damos clic en “grabar”.

Page 5: Elaboracion de una bd con dreawever

UNIVERSIDAD TECNONOLÓGICA DEL ESTADO DE ZACATECAS UNIDAD ACADÉMICA DE PINOS

TECNOLOGÍAS DE LA INFORMACIÓN Y COMUNICACIÓN

Y nos saldría así una tabla con la cual nos aparece el campo que acabamos

de crear:

Page 6: Elaboracion de una bd con dreawever

UNIVERSIDAD TECNONOLÓGICA DEL ESTADO DE ZACATECAS UNIDAD ACADÉMICA DE PINOS

TECNOLOGÍAS DE LA INFORMACIÓN Y COMUNICACIÓN

En la parte de arriba nos indica que la tabla se creó con éxito en la parte

marcada nos indica los campos que acabamos de introducir, los podemos

eliminar, modificar o cambiar

Luego nos vamos a la cárpete en la que tenemos el xampp y damos clic en

htdocs y creemos una carpeta con el nombre que deseemos como sitio

seguido de tu nombre con se muestra a continuación:

Luego abrimos dreamweaver para hacer los nos vamos a la pestaña que

diga sitio o site, también le damos new site o bien nuevo sitio

Page 7: Elaboracion de una bd con dreawever

UNIVERSIDAD TECNONOLÓGICA DEL ESTADO DE ZACATECAS UNIDAD ACADÉMICA DE PINOS

TECNOLOGÍAS DE LA INFORMACIÓN Y COMUNICACIÓN

Luego nos abre una ventana como la que a continuación nos muestra

En la parte marcada nos nuestra que en la primera casilla pondremos el

nombre que escogimos y en la otra casilla de abajo buscamos la carpeta

que acabamos de crear, la podemos buscar con el cuadrito que a parecer a

lado, nos aparece otra ventana que sería la carpeta de htdocs que fue donde

guardamos la carpeta ya creada, le damos abrir y después guardar como se

muestra a continuación

Page 8: Elaboracion de una bd con dreawever

UNIVERSIDAD TECNONOLÓGICA DEL ESTADO DE ZACATECAS UNIDAD ACADÉMICA DE PINOS

TECNOLOGÍAS DE LA INFORMACIÓN Y COMUNICACIÓN

Luego damos clic en la pestaña servers o servidores y nos aparece esta

ventana como se muestra enseguida:

Luego le damos en el símbolo de más y nos aparece otra ventana como se

muestra

En la primera casilla ponemos el nombre escogido como sitio_moni, luego

en la casilla desplegable buscamos local/network o bien que sea local en la

computadora, la tercera casilla damos clic en el cuadrito de alado de la área

Page 9: Elaboracion de una bd con dreawever

UNIVERSIDAD TECNONOLÓGICA DEL ESTADO DE ZACATECAS UNIDAD ACADÉMICA DE PINOS

TECNOLOGÍAS DE LA INFORMACIÓN Y COMUNICACIÓN

de texto y nos muestra una ventana con el nombre de la carpeta de nuestro

sitio damos clic en guardar y en la última casilla que dice web URL ponemos

la dirección que vamos a poner para ver el sitio en el navegador y como es

local será asíhttp://localhost/sitio_moni/como se muestra

Luego damos en la pestaña advanced como se nuestra a continuación

Y nos aparece otra ventana la cual en la parte de abajo hay una barra

desplegable que débenos buscar php mysql y luego damos clic guardar.

Page 10: Elaboracion de una bd con dreawever

UNIVERSIDAD TECNONOLÓGICA DEL ESTADO DE ZACATECAS UNIDAD ACADÉMICA DE PINOS

TECNOLOGÍAS DE LA INFORMACIÓN Y COMUNICACIÓN

Y nos aparece una ventana con lo que vamos a utilizar como nombre del

sitio, el address(la dirección donde está guardado el sitio), también la

conexión, y como la queremos si remota o testing quitamos la remota y

ponemos que sea y testing y le damos clic en save o guardar

Luego en la parte derecha de nuestro programa hay una ventana la cual nos

apareció la carpeta con el nombre de nuestro sitio en ella vamos a dar clic

derecho y damos clic en new file como se muestra a continuación

Page 11: Elaboracion de una bd con dreawever

UNIVERSIDAD TECNONOLÓGICA DEL ESTADO DE ZACATECAS UNIDAD ACADÉMICA DE PINOS

TECNOLOGÍAS DE LA INFORMACIÓN Y COMUNICACIÓN

A continuación nos muestra el nuevo file o archivo y en lo seleccionado

vamos a escribir el nombre que debe de llevar el archivo ya creado como:

registrar_alumno

Luego le damos doble clic para que se abra y nos aparezcaasí

Page 12: Elaboracion de una bd con dreawever

UNIVERSIDAD TECNONOLÓGICA DEL ESTADO DE ZACATECAS UNIDAD ACADÉMICA DE PINOS

TECNOLOGÍAS DE LA INFORMACIÓN Y COMUNICACIÓN

En esa parte vamos a crear el formulario que va llenar el alumno.

Le damos clic en la ventana Windows y clic en database para ver la

conexión que se izó y se muestre en la parte derecha del programa

Page 13: Elaboracion de una bd con dreawever

UNIVERSIDAD TECNONOLÓGICA DEL ESTADO DE ZACATECAS UNIDAD ACADÉMICA DE PINOS

TECNOLOGÍAS DE LA INFORMACIÓN Y COMUNICACIÓN

Luego en la parte marcada nos aparece un signo de más y en ese le damos

clic y nos sale una barra desplegable que dice Mysql connection

Luego le damos clic y nos aparece una ventana en la cual le ponemos el

nombre de la conexión, mysql server, el usuario, contraseña en caso de que

tuviera el xampp y la base de datos damos clic en el botón aceptar y nos

aparece una ventana la cual buscamos la base de datos que creamos en el

xampp y le damos clic y clic en “ok”.

Page 14: Elaboracion de una bd con dreawever

UNIVERSIDAD TECNONOLÓGICA DEL ESTADO DE ZACATECAS UNIDAD ACADÉMICA DE PINOS

TECNOLOGÍAS DE LA INFORMACIÓN Y COMUNICACIÓN

Luego le damos “ok” y en la parte de abajo donde le dimos clic en el botón

de más nos aparecieron las partes de la conexión

Luego nos vamos en la parte superior de la derecha donde diga insertar y

buscamos data e insert record abra una barra desplegable donde daremos

clic en la primera donde diga record insetion form y abrirá una ventana

como se muestra a continuación

Page 15: Elaboracion de una bd con dreawever

UNIVERSIDAD TECNONOLÓGICA DEL ESTADO DE ZACATECAS UNIDAD ACADÉMICA DE PINOS

TECNOLOGÍAS DE LA INFORMACIÓN Y COMUNICACIÓN

Vamos ir llenando los campos como el nombre que deseemos como sitio,

que sea la tabla registrar, el botón brows saldrá una ventana que dice para

seleccionar registrar alumno para que después de que registre se devuelva

al a misma le damos “ok”, seleccionamos el id y le damos clic en el signo

de menos para quitamos el campo de id alumno, luego seleccionamos el

campo de dirección y en la parte de abajo buscamos text área y le damos

clic en “ok”.

Y nos aparecen los campos luego guardamos

Page 16: Elaboracion de una bd con dreawever

UNIVERSIDAD TECNONOLÓGICA DEL ESTADO DE ZACATECAS UNIDAD ACADÉMICA DE PINOS

TECNOLOGÍAS DE LA INFORMACIÓN Y COMUNICACIÓN

Y ya está listo para probarlo en el navegador, abrimos un navegador y nos

vamos a la barra de direcciones y ponemos

http://localhost/sitio_moni/registrar_alumno.php/ y nos aparece el

formulario y nos registramos.

Y nos devuelve el mismo formulario para hacer otro registro

Page 17: Elaboracion de una bd con dreawever

UNIVERSIDAD TECNONOLÓGICA DEL ESTADO DE ZACATECAS UNIDAD ACADÉMICA DE PINOS

TECNOLOGÍAS DE LA INFORMACIÓN Y COMUNICACIÓN

Después creamos una lista para ver los alumnos que se han registrado.

Para eso nos vamos a la ventana de la derecha del programa clic derecho le

damos clic a new file o nuevo archivo

Page 18: Elaboracion de una bd con dreawever

UNIVERSIDAD TECNONOLÓGICA DEL ESTADO DE ZACATECAS UNIDAD ACADÉMICA DE PINOS

TECNOLOGÍAS DE LA INFORMACIÓN Y COMUNICACIÓN

Nos aparece a como se muestra y él lo seleccionado ponemos lista.php

Le damos doble clic para poder crear la lista nos vamos al aparte superior

de la derecha del programa y le damos clic en dynamic data: clic en

dimamic table y nos aparece una ventana en la cual vamos darle clic en

recordset y

Page 19: Elaboracion de una bd con dreawever

UNIVERSIDAD TECNONOLÓGICA DEL ESTADO DE ZACATECAS UNIDAD ACADÉMICA DE PINOS

TECNOLOGÍAS DE LA INFORMACIÓN Y COMUNICACIÓN

Nos aparece una ventana en la cual vamos llenando cada campo que va a

llevar el lista como nombre conection a que tabla vamos a poner

seleccionamos las columnas y por ultimo le damos clic en el botón “ok”.

Y nos aparece una tabla con los campos que necesitamos.

Page 20: Elaboracion de una bd con dreawever

UNIVERSIDAD TECNONOLÓGICA DEL ESTADO DE ZACATECAS UNIDAD ACADÉMICA DE PINOS

TECNOLOGÍAS DE LA INFORMACIÓN Y COMUNICACIÓN

Luego seleccionamos la columna y fila clic derecho tabla insertar columna y

filas y aparece una ventana como nos muestra a continuación:

Page 21: Elaboracion de una bd con dreawever

UNIVERSIDAD TECNONOLÓGICA DEL ESTADO DE ZACATECAS UNIDAD ACADÉMICA DE PINOS

TECNOLOGÍAS DE LA INFORMACIÓN Y COMUNICACIÓN

Aquí ponemos 3 filas 3 columnas después dela seleccionada y nos aparece

así

Luego seleccionamos las tres filas damos clic derecho tabla combinar

celdas y ponemos “acciones” abajo “modificar”, “eliminar” y “PDF” o

“reporte” como se muestra a continuación:

Page 22: Elaboracion de una bd con dreawever

UNIVERSIDAD TECNONOLÓGICA DEL ESTADO DE ZACATECAS UNIDAD ACADÉMICA DE PINOS

TECNOLOGÍAS DE LA INFORMACIÓN Y COMUNICACIÓN

Luego nos vamos al recuadro de debajo de la derecha y damos clic derecho

“nuevo archivo” como se muestra:

Page 23: Elaboracion de una bd con dreawever

UNIVERSIDAD TECNONOLÓGICA DEL ESTADO DE ZACATECAS UNIDAD ACADÉMICA DE PINOS

TECNOLOGÍAS DE LA INFORMACIÓN Y COMUNICACIÓN

Le ponemos el nombre de “modificar”

Damos doble clic para que se abra y nos vamos a la parte superior pero

derecho a datos damos clic en “actualizar registro” nos aparece un cuadro

damos clic a “juego de registro” así como se muestra a continuación:

Nos aparece otro ventana la cual no modificamos nada lo único ponemos

nombre y damos clic en browser damos clic en lista.php para que se

regrese después de modificar

Page 24: Elaboracion de una bd con dreawever

UNIVERSIDAD TECNONOLÓGICA DEL ESTADO DE ZACATECAS UNIDAD ACADÉMICA DE PINOS

TECNOLOGÍAS DE LA INFORMACIÓN Y COMUNICACIÓN

Luego así nos aparece con los elementos que pusimos para modificar

Luego creamos otro archivo a ese le pone con nombre “eliminar”

Le damos doble clic y nos vamos a la derecha superior donde dice “datos”

damos clic en “eliminar registro”

Page 25: Elaboracion de una bd con dreawever

UNIVERSIDAD TECNONOLÓGICA DEL ESTADO DE ZACATECAS UNIDAD ACADÉMICA DE PINOS

TECNOLOGÍAS DE LA INFORMACIÓN Y COMUNICACIÓN

Nos aparece una ventana que lo único que ponemos es dar clic en browser

para que después de eliminar se regrese a lista

Luego nos regresamos a lista nos vamos a código y en esta parte como se

muestra en la siguiente figura

Page 26: Elaboracion de una bd con dreawever

UNIVERSIDAD TECNONOLÓGICA DEL ESTADO DE ZACATECAS UNIDAD ACADÉMICA DE PINOS

TECNOLOGÍAS DE LA INFORMACIÓN Y COMUNICACIÓN

Y eso mismo se pone después de eliminar.php o modificar.php

Ponemos idalumno= y después lo que esta seleccionado

Luego nos vamos a diseño de la lista y seleccionamos modificar y nos

vamos a la parte de debajo del programa damos clic en la carpeta pequeña a

lado de vinculo para vincular lo seleccionado con el archivo “modificar.php”

Page 27: Elaboracion de una bd con dreawever

UNIVERSIDAD TECNONOLÓGICA DEL ESTADO DE ZACATECAS UNIDAD ACADÉMICA DE PINOS

TECNOLOGÍAS DE LA INFORMACIÓN Y COMUNICACIÓN

Así con cada uno de las acciones

Luego en la carpeta que estamos trabajando pegamos la librería de “FPDF”.

Luego creamos un archivo que diga “reporte” y agregamos el siguiente

código

<?

Require ('fpdf.php');

Class PDF extends FPDF

{

//Pie de página

función Footer()

{

$this->SetY(-10);

$this->SetFont('Arial','I',8);

$this->Cell(0,10,'Page '.$this->PageNo().'/1',0,0,'C');

}

function Header()

{

$this->Image('logo.png',10,8,33);

$this->SetFont('Arial','B',12);

$this->Cell(120,10,'REPORTE_EMPLEADO',0,0,'R');

}

Page 28: Elaboracion de una bd con dreawever

UNIVERSIDAD TECNONOLÓGICA DEL ESTADO DE ZACATECAS UNIDAD ACADÉMICA DE PINOS

TECNOLOGÍAS DE LA INFORMACIÓN Y COMUNICACIÓN

}

//Creación del objeto de la clase heredada

$pdf=new PDF();

$pdf->AddPage();

$pdf->SetY(50);

$pdf->SetX(40);

$pdf->SetFont('Times','',12);

//Aquí escribimos lo que deseamos mostrar

mysql_connect("localhost","root","");

mysql_select_db("alma");

$consulta = mysql_query("SELECT * FROM empleado ");

while($resultado = mysql_fetch_array($consulta)){

$pdf->SetX(40);

$pdf->Cell(40,5,$resultado['nombre'],1,0,'L');

$pdf->SetX(80);

$pdf->Cell(40,5,$resultado['appaterno'],1,0,'L');

$pdf->SetX(120);

$pdf->Cell(40,5,$resultado['apmaterno'],1,40,'L');

}

$pdf->Output();

?>

Page 29: Elaboracion de una bd con dreawever

UNIVERSIDAD TECNONOLÓGICA DEL ESTADO DE ZACATECAS UNIDAD ACADÉMICA DE PINOS

TECNOLOGÍAS DE LA INFORMACIÓN Y COMUNICACIÓN

Luego modificamos el nombre de la base de dato los campos de la base de

datos

Damos clic en archivo y en guardamos todo

Y nos vamos a un explorador y ponemos

http://localhost/sitio_moni/registrar_alumno.php/verificamos que funcione

biencomo ya registra vemos si eliminar y modifica los registros

Page 30: Elaboracion de una bd con dreawever

UNIVERSIDAD TECNONOLÓGICA DEL ESTADO DE ZACATECAS UNIDAD ACADÉMICA DE PINOS

TECNOLOGÍAS DE LA INFORMACIÓN Y COMUNICACIÓN

Y como si funciona damos clic en reporte y nos sale así se ve un reporte

con tos los registros que pusimos...