Manual JSP Odbc SqlServer 1

Manual de JSP – Docente: Daniel Fernando Loza Santa Cruz
Conexión A Una Base De Datos Con Servlets

Objetivo:
El alumno será capaz de desarrollar un listado de datos de SQL Server que se
encuentra almacenado en un servidor utilizando los servlets.
Herramientas:
 Apache Tomcat
 Odbc
 SQL Server 2008
 DreamWeaver (Cs4 o Superior)
 Eclipse Helios
Procedimiento:
Parte 1.- Configuración del Tomcat
1. Inicio / Ejecutar
2. Se visualiza la siguiente pantalla:
Digitar:
Services.msc
Clic en: Aceptar
Doble Clic en: Apache Tomcat 6
Correo: dlozas@hotmail.com Página 1

Clic en la opción: Deshabilitado
Clic en el botón: Detener
Clic en los botones: Aplicar y Aceptar

Parte 2.- Creación De La Base De Datos

1. Activar el SQL Server 2008
Inicio de Sesión: sa
Contraseña: Cepea
Clic en: Conectar
2. Seleccionar el botón:
3. Se Genera una base de Datos:
4. Se inserta los siguientes registros:

5. Se digita la instrucción transact SQL (Select):
6. Grabar el Script a una carpeta de trabajo: TrabajoJsp1, con el nombre: CodigoSql01
Parte 3.- Creación Del ODBC

1. Clic en: Inicio
Clic en: Panel de Control

Doble Clic en: Herramientas Administrativas
3. Doble clic en el icono: Orígenes de datos(ODBC)
Clic en: Agregar
Clic en: SQL Server
Clic en: Finalizar

5. Se visualiza el siguiente cuadro de dialogo:
Clic en: Siguiente
Clic en: Siguiente
Seleccionar la bdd: Demo01
Clic en: Siguiente

Seleccionar el idioma: Spanish
Clic en: Finalizar Clic en: Probar Origen de Datos
Clic en: Aceptar (Por Cada Ventana)
Parte 4.- Generando El Diseño Del Formulario Con El DreamWeaver

1. Se activa el programa DreamWeaver
Clic en: Adobe DreamWeaver CS4

Clic en la carpeta: Más…
Clic en: Ninguno
La opción por defecto
Clic en: JSP
Clic en: Crear

Clic en el icono: Diseño
6. Se inserta un objeto Formulario:
En el cuadro de herramientas, en el icono: Formulario,

clic y arrastre hacia la zona de trabajo
Formulario Insertado

7. Ubicar al cursor dentro del formulario

8. De la barra de menús, seleccionar la opción: Insertar
Clic en la opción: Tabla
Filas: 2 Columnas: 4
Clic en: Aceptar
10. Se visualiza la siguiente tabla:
11. Seleccionar la primera fila de la tabla:

12. En la parte inferior de la pantalla (Paleta de Propiedades), se visualiza lo siguiente:
Clic en el icono: combinar Celdas
13. Digitar los siguientes textos en las celdas:
14. Seleccionar las celdas de la tabla:
15. En el cuadro de propiedades:
Clic en Vertical: Centro
Clic en Horizontal: Centro
16. Seleccionar:
Clic en: Negrita
17. Seleccionar el botón:

18. Se visualiza el siguiente código:
Nota:
El código generado se copia y pega en el editor de códigos del Eclipse Helios
19. Se graba el diseño y código del dreamweaver, de la barra de menús, seleccionar la

opción Archivo:
Clic en: Guardar Todo
20. Grabar hacia la carpeta de trabajo:
Carpeta de Trabajo: TrabajoJsp1
Nombre: Trabajo01
Clic en: Guardar

Parte 5.- Generando El Servlet y la Pagina Jsp en Eclipse Helios

1. Doble clic en el icono: Eclipse Helios
Carpeta de Trabajo: TrabajoJsp1
Clic en: Ok


Clic en: X
6. De la barra de menús, seleccionar la opción: Window
Clic en: Add…
Clic en: Preferences
Clic en: Server
Clic en: Runtime Environments

Clic en: Apache Tomcat v6.0
Clic en: Finish
Apacha Tomcat Configurado
Clic en: Ok

9. De la barra de menús, Clic en: File
Clic en: New
Clic en: Web
Clic en: Dynamic Web Project
Clic en: Next

Clic en: Other
10. Se Visualiza la siguiente pantalla:
Nombre del Proyecto: DemoListado01
Clic en: Finish

Clic en: Yes
12. En la parte izquierdo en el ProjectExplorer (Explorador de Proyectos), Se visualiza:
13. Clic derecho en: DemoListado01
Clic en: New
Clic en: Package

Nombre del paquete: Paquete01
Paquete01
Clic en: Finish
15. Clic derecho en: Paquete01
Clic en: New
Clic en: Servlet

Nombre del Servlet: ServletListado01
Clic en: Finish
Se Elimina todo los comentarios

18. En la sección import, se importa las siguientes clases:
 La primera clase es para la conexión a la base de datos del SQL Server

 La segunda clase es para la configuración del servlet (Init)
 La tercera clase es para imprimir datos/Textos (out.Println)
19. Se declara los siguiente objetos:
 Cn Para La conexión
 St Para la crear el objeto Statement
 Rs  Para el manejo de los registros
20. Se genera el siguiente método para la conexión al servidor y a la base de datos:
21. Se genera el método para cerrar la conexión:

 Con Response, se utiliza el método setContetType, para fijar el
22. En el método doPost: texto HTML.
 Con la clase PrintWriter se utiliza el método getWriter por
medio del objeto out, para imprimir los datos o textos.
 Con st se genera el CreateStatement.
 Con el rs: ResultSet se ejecuta la consulta de la tabla: Alumno.
23. Se utiliza el try…catch:
24. En el DreamWeaver (Botón: Diseño), agregar una fila
25. Clic en el botón: Código Del DreamWeaver, Seleccionar a partir de las etiquetas:
<HTML> hasta </HTML>
Copiar el código seleccionado

Pegar el código del DreamWeaver
26. En el eclipse, debajo del try:
27. Agregar a Cada línea del código, el método: out.println:

28. Después del código: out.close, se digita lo siguiente:
29. Se agrega los campos de la tabla: Alumno en el servlet, utilizando el objeto rs por
medio del método getString:

30. Se agrega en el proyecto, una página JSP, en el explorador de paquetes, clic derecho
en: DemoListado01
Clic en: New
Clic en: JSP File
Carpeta Seleccionada: WebContent
Nombre del Archivo: index.jsp
Clic en: Finish

32. Se visualiza dos pestañas:
Del Servlet De la página JSP

33. En la página: Index.jsp, se visualiza la siguiente pantalla:
Diseño De La Página
Código De La Página
34. Para activar el cuadro de herramientas, de la barra de menús, seleccionar la opción:

Window.
Clic en: Show View
Clic en: Other

Clic en: Pallete
Clic en: Ok
36. En la parte derecha de la pantalla, se visualiza una ventana con el nombre: Pallete
Clic y Arrastre del icono: Form (Formulario),

dentro del Body para insertar un formulario.

En Action se digita el nombre del

Servlet: ServletListado01
En Method, seleccionar el método de envió: Post
Clic en: Finish
38. Se inserta un Botón de Comando, de Pallete:
Clic y Arrastre del icono: Button dentro del

Form para insertar un botón de comando

Name b1
Label Listado De Datos
Clic en: Finish
En Title modificar por:

Relación de Alumnos
Cambiar Type=”button” por Type=”submit”

Parte 6.- Ejecutar una página JSP

1. Grabar la página jsp
2. En index.jsp, pulsar clic derecho:
Clic en: Run As Clic en: Run On Server

Clic en: Finish
Clic en: Listado De Datos

Practica Calificada
1. Crear una base de datos con el nombre de: TareaJava01
2. Crear una tabla con los siguientes campos:
a. Cod_libro
b. Nom_libro
c. Aut_libro
d. Precio_libro
e. Numero_Paginas
f. Edic_Libro
g. Edit_Libro
h. Imprenta_Libro
i. Pais_Libro
3. Insertar 10 Registros.
4. Crear un ODBC con el nombre: ConeJsp02.
5. Crear una carpeta con el nombre: TrabajoJsp2.
6. Listar los datos en un servlet que se invoca desde una página JSP.

Manual JSP Odbc SqlServer 1

Cargado por

Información del documento

Título original

Derechos de autor

Formatos disponibles

Compartir este documento

Compartir o incrustar documentos

Opciones para compartir

¿Le pareció útil este documento?

¿Este contenido es inapropiado?

Copyright:

Formatos disponibles

Manual JSP Odbc SqlServer 1

Cargado por

Copyright:

Formatos disponibles

Manual de JSP – Docente: Daniel Fernando Loza Santa Cruz

Conexión A Una Base De Datos Con Servlets

Clic en: Aceptar

3. Se visualiza la siguiente pantalla:

Doble Clic en: Apache Tomcat 6

Correo: dlozas@hotmail.com Página 1

4. Se visualiza la siguiente pantalla:

Clic en la opción: Deshabilitado

Clic en el botón: Detener

5. Se visualiza la siguiente pantalla:

Clic en los botones: Aplicar y Aceptar

Correo: dlozas@hotmail.com Página 2

Parte 2.- Creación De La Base De Datos

Clic en: Conectar

3. Se Genera una base de Datos:

4. Se inserta los siguientes registros:

Correo: dlozas@hotmail.com Página 3

5. Se digita la instrucción transact SQL (Select):

6. Grabar el Script a una carpeta de trabajo: TrabajoJsp1, con el nombre: CodigoSql01

Parte 3.- Creación Del ODBC

Clic en: Panel de Control

Correo: dlozas@hotmail.com Página 4

2. Se visualiza la siguiente pantalla:

Doble Clic en: Herramientas Administrativas

3. Doble clic en el icono: Orígenes de datos(ODBC)

4. Se visualiza la siguiente pantalla:

Clic en: Agregar

Clic en: SQL Server

Clic en: Finalizar

Correo: dlozas@hotmail.com Página 5

5. Se visualiza el siguiente cuadro de dialogo:

Clic en: Siguiente

6. Se visualiza la siguiente pantalla:

Clic en: Siguiente

Seleccionar la bdd: Demo01

Clic en: Siguiente

Correo: dlozas@hotmail.com Página 6

Seleccionar el idioma: Spanish

Clic en: Finalizar Clic en: Probar Origen de Datos

7. Se visualiza la siguiente pantalla:

Clic en: Aceptar (Por Cada Ventana)

Parte 4.- Generando El Diseño Del Formulario Con El DreamWeaver

Clic en: Adobe DreamWeaver CS4

Correo: dlozas@hotmail.com Página 7

2. Se visualiza la siguiente pantalla:

Clic en la carpeta: Más…

3. Se visualiza la siguiente pantalla:

Clic en: Ninguno

La opción por defecto

Clic en: JSP

Clic en: Crear

Correo: dlozas@hotmail.com Página 8

4. Se visualiza la siguiente pantalla:

Clic en el icono: Diseño

5. Se visualiza la siguiente pantalla:

6. Se inserta un objeto Formulario:

En el cuadro de herramientas, en el icono: Formulario,

Correo: dlozas@hotmail.com Página 9

7. Ubicar al cursor dentro del formulario

Clic en la opción: Tabla

9. Se visualiza la siguiente pantalla:

Clic en: Aceptar

10. Se visualiza la siguiente tabla: