INSTITUTO TECNOLOGICO SUPERIOR DE

COATZACOALCOS

ALUMNO:
JUAN EDUARDO SANDOVAL HERNANDEZ
MATERIA:
DESARROLLO DE APLICACIONES WEB
DOCENTE:
L. I. CINTHYA PEREZ VILCHIS
CARRERA:
INGENIERIA INFORMATICA
GRADO:
6to SEMESTRE
GRUPO:
A
NOMBRE DE LA ACTIVIDAD:
REPORTE DE PRACTICA #6

1) Seleccionamos el programa Microsoft Visual Studio 2008. Clic derecho sobre l y Abrir.
Una vez en ejecucin, se presenta su Pgina de inicio, en ella elegimos Crear:
Proyecto.

2) Automticamente se muestra una ventana para la configuracin del Nuevo proyecto.

Seleccionamos Visual C#; su plantilla de Biblioteca de clases, le asignamos un
Nombre, en este caso se llamar: BESGCA y el Nombre de la solucin es: SGCA. Clic
en Aceptar para guardar los cambios.

3) Se presenta la interfaz para agregar el cdigo de realizacin de actividades. Se ingresa

dentro de las llaves del public class Class1, contenida dentro del namespace BESGCA.

4) Cambiamos el nombre de Class1 por el de Asignatura a la misma e ingresamos la

estructuracin de sus actividades a travs de una regin de Atributos para identificar
caractersticas de la misma.

5) Construimos una regin de Propiedades para la clase Asignatura.

6) Creamos la regin de Constructores e ingresamos dos tipos (el primero no recibe

parmetros, pero el segundo s) para determinar los aspectos que se asignaran a los
atributos de la clase.

7) Inicializamos la regin de Mtodos, asignamos cuatro; para la asignacin de los objetos

de tipo Asignatura, que realizaran los procesos de Almacenar, Actualizar, Eliminar y
Consultar las materias que sean ingresadas.

8) Despus de ingresar el cdigo correspondiente a la clase Asignatura, le colocamos un

nombre al archivo, para identificarlo dentro del proyecto. Ahora se llamar BEAsignatura.
Sobre el archivo que dice Class1.cs, damos Clic derecho/Cambiar nombre.

9) En la imagen de abajo se muestra como queda identificado el archivo para el desarrollo

del proyecto.

10) Ahora, agregamos un nuevo proyecto. Sobre el nombre de la Solucin: SGCA,

damos Clic derecho/Agregar/Nuevo proyecto. Tal y como se muestra en la imagen.

11) Se presenta la ventana para la configuracin del nuevo proyecto, seleccionamos uno
de tipo Visual C# y la plantilla de Biblioteca de clases. Le asignamos el nombre de:
ADSGCA y clic en Aceptar.

12) Dentro del nuevo proyecto, el archivo Class1.cs que se crea, se modifica y se le
asigna un nuevo nombre. Sobre el documento Clic derecho/Cambiar nombre.

13) La modificacin del archivo, queda de la siguiente forma (imagen) . Se le asigna el

nombre de ADAsignatura.

14) Ahora vamos a agregar una nueva referencia para el funcionamiento del proyecto.
Sobre la carpeta que dice References, damos Clic derecho/Agregar referencia.

15) La nueva referencia se agrega desde una ventana que se muestra automticamente
(imagen de abajo). Del apartado de Proyectos, seleccionamos BESGCA y damos clic
en Aceptar.

16) Expandimos la carpeta References para verificar si se encuentra la referencia

BESGCA que se acaba de agregar.

17) Ingresamos una nueva referencia para la funcionalidad del proyecto (imagen). Sobre
la carpeta References damos Clic derecho/Agregar referencia.

18)

Del apartado .NET agregamos la referencia System.Configuration. Clic en Aceptar.

19) Expandimos la carpeta de References para checar el ingreso de la nueva referencia.

Por otro lado creamos tres regiones; una de Atributos, otra de Constructores y una de
Mtodos para la clase ADAsignatura, e ingresamos el cdigo correspondiente.

20) Agregamos cuatro using al archivo ADAsignatura.cs (imagen) para permitir la

conexin y hacer referencia a otros proyectos y clases. Ingresamos los using:
System.Configuration, System.Data, System.Data.SqlClient y BESGCA. Cada uno
est predestinado y configurado para realizar ciertas operaciones.

21) Asignamos el cdigo correspondiente a las regiones creadas anteriormente, cada una
tiene asignada un nombre. Empezamos con los Atributos de la clase ADAsignatura".

22)

Continuamos con el ingreso del cdigo para la regin de Constructores.

23) Ahora en la regin de Mtodos, se ingresa el cdigo correspondiente. Se crea el

mtodo AgregarAsignatura.

24)

Se construye el mtodo ActualizarAsignatura.

25)

Generamos el mtodo EliminarAsignatura.

26)

Se crea el mtodo ObtenerAsignatura.

27) Ahora, sobre el nombre de la solucin: SGCA, damos Clic derecho/Agregar/Nuevo

Proyecto. Tal y como se muestra en la imagen.

28) Seleccionamos las caractersticas del nuevo proyecto, optamos por la plantilla Web
y la Aplicacin de Servicio Web de ASP.NET. Le asignamos un nombre: WSSGCA.
Clic en Aceptar.

29) Sobre el nombre WSSGCS del nuevo proyecto damos Clic derecho/Agregar/Nuevo
elemento.

30) Configuramos el nuevo elemento, seleccionamos la plantilla Web y el Servicio

Web. Le asignamos el nombre de WSAsignatura. Clic en Agregar.

31)

Doble clic en el elemento para abrirlo. Sobre el mismo, Clic derecho/Ver marcado.

32) Dentro del proyecto WSSGCA, en la carpeta que dice References damos Clic
derecho/Agregar referencia.

33) Del apartado de Proyectos seleccionamos las referencias ADSGCA y BESGCA.

Clic en Aceptar.

34) Expandimos la carpeta References para verificar si las referencias se agregaron

exitosamente.

35) Una vez abierto el archivo WSAsignatura.asmx

correspondiente para las actividades a realizar.

ingresamos

el

cdigo

36) Por otro lado, necesitamos construir una Base de Datos para poder vincular el
Servicio Web que estamos construyendo; esta contendr la informacin correspondiente a
las Asignaturas que se ingresaran para su muestra. Abrimos SQL Server Management
Studio y comenzamos a crearla, seleccionamos Nueva consulta, conectamos con el
servidor.

37) Ingresamos el cdigo que se designar a la creacin de la Base de Datos DBSGCA

y a la tabla ASIGNATURA; esta a su vez integra los campos id y nombre.
Seleccionamos la sentencia y la Ejecutamos, en la parte inferior se muestra el resultado
de la ejecucin.

38) En el Explorador de objetos, seleccionamos Bases de datos y damos clic en

Actualizar.

39) Agregamos otra parte de cdigo dentro de la creacin de la BD. En este caso
ingresamos un procedimiento almacenado que se llama ConsultarAsignaturas, que
afectar a la tabla ASIGNATURAS. Lo Ejecutamos y sobre Bases de datos; Actualizar.

40) Realizamos la insercin de valores a los campos id: 1 y nombre: PRUEBA,

contenidos en la tabla ASIGNATURA. Lo Ejecutamos y sobre Bases de datos;
Actualizar. En la parte inferior se muestra que se afect una fila de la tabla.

41) Nos regresamos al proyecto que estamos creando en Visual Studio y realizamos una
nueva accin. En el men Ver seleccionamos el apartado de Explorador de servidores.

42) Sobre Conexiones de datos, Clic derecho/Agregar conexin, seleccionamos el origen

de los datos, en este caso estamos vinculando la BD de SQL Server, por ello elegimos
Microsoft SQL Server, clic en Continuar.

43) Agregamos la conexin; Origen de datos: Microsoft SQL Server (SqlClient), Nombre
del servidor: (local) y Nombre de la base de datos: DBSGCA. Clic en Aceptar.

44) En la imagen podemos observar que la Conexin de datos resulto satisfactoriamente.

En el Explorador de servidores nos damos cuenta de que se vincul la Base de Datos
DBSGCA con el Proyecto que estamos creando. Ahora sobre el Proyecto WSSGCA
Clic derecho/Agregar/Nuevo elemento.

45) Configuramos el nuevo elemento; seleccionamos Conjunto de datos, dejamos por

defecto el nombre que tiene asignado el archivo y Aceptar.

46) En el Explorador de soluciones, observamos que el nuevo elemento se agreg

correctamente, lo expandimos para observar su contenido.

47) Sobre el archivo Web.config doble clic para abrir. En la imagen se muestra su
contenido.

48) En la lnea 19, donde se especifica el nombre de la Base de Datos, borramos el

anterior DBSGCAConnectionString y asignamos DBSGCA el que se encuentra en la
BD que creamos en SQL Server.

49)

Cerramos todos los archivos abiertos y realizamos la accin de Generar solucin.

50) Ahora, sobre el archivo WSAsignatura.asmx damos Clic derecho/Ver en el

explorador.

51)

El archivo es ejecutado y se muestra en el Explorador Web.

52)

Sobre el nombre de la solucin SGCA Clic derecho/Agregar/Nuevo proyecto.

53) Configuramos el nuevo proyecto. Seleccionamos la plantilla Web y su

correspondiente Aplicacin web ASP.NET, le asignamos el nombre de WASGCA y
Aceptar.

54)

Abrimos el archivo Default.aspx.

55) En el proyecto WASGCA, tenemos la carpeta References, sobre ella Clic

derecho/Agregar referencia de servicio.

56) Se muestra automticamente una ventana que dice Agregar referencia de servicio,
damos clic en el botn que dice Avanzadas y Aceptar.

57) Aparece la ventana de Configuracin de referencia de servicio, clic en el botn

Agregar referencia web y damos Aceptar.

58)

Damos clic sobre la opcin que dice Servicios Web de esta solucin.

59)

Se muestra la siguiente ventana, en ella damos clic en donde dice WSAsignatura.

60) Aparece la ventana del servicio web WSAsignatura y solamente damos clic en
donde dice Agregar Referencia.

61) Se presenta un mensaje de confirmacin, para aceptar o no la nueva referencia web

que se est ingresando.

62) Como estaba abierto el archivo Default.aspx, en la parte inferior se muestra tres
opciones Diseo, Dividir y Cdigo, actualmente nos encontramos en la seccin del
Cdigo.

63) Ahora cambiaremos a la seccin de Diseo, para hacer una representacin grfica de
las opciones contenidas en la pgina y de cmo esta se va a observar en el Explorador
Web.

64) Del apartado de Cuadro de herramientas, en la seccin de Datos, seleccionamos

la opcin GridView (tabla) y lo arrastramos hacia el lado derecho (seccin blanca).

65) Una vez agregado el nuevo objeto, nos colocamos sobre l y damos Clic derecho/Ver
cdigo.

66) Nos abre una nueva ventana, donde podemos observar la instruccin que se crea
automticamente al agregar el objeto, dentro de ella asignamos un cdigo para definir las
acciones que realizar una vez en ejecucin. Una vez realizado lo anterior cerramos el
archivo.

67)

Ahora, sobre el archivo Default.aspx, damos Clic derecho/Ver el explorador.

68) Ejecutamos dicha actividad y se muestra la siguiente informacin en el Explorador

Web.

69)

Seleccionamos el archivo Default.aspx, Clic derecho/Abrir.

70)

Muestra su interfaz inicial y en la parte inferior seleccionamos la opcin de Diseo.

71) Del Cuadro de herramientas, de la seccin Estndar, seleccionamos un Label y lo

arrastramos hacia la derecha, por debajo de la tabla que ingresamos anteriormente.

72)

Sobre la misma interfaz, damos Clic derecho/Ver cdigo.

73) Automticamente nos muestra la ventana donde se crea y se ingresa el cdigo de

cada uno de los objetos que se utilizan en la seccin de Diseo. Podemos observar en
la imagen de abajo (parte sombreada) que se han ingresado algunas sentencias referente
a las propiedades que contendr el objeto Label.

74) Regresamos a seccin de Diseo, ahora adjudicaremos algunas propiedades al

objeto Label. Clic sobre la opcin Default.aspx que est por debajo de la flecha.

75)

Una vez hecho lo anterior, sobre el objeto damos Clic derecho/Propiedades.

76) En la opcin que dice Visible, cambiamos la configuracin que tenia de True a
False.

77)

Sobre el objeto GridView Clic derecho/Propiedades.

78) En el apartado de Eventos, en la opcin que dice DataBound; seleccionamos la

frase que dice GridView1_DataBound.

79) Verificamos si el nuevo GridView1_DataBound evento del GridView se cre

satisfactoriamente. Podemos observar en la imagen (parte sombreada) que s.

80)

Abrimos el archivo WSAsignatura.asmx. Clic derecho/Abrir.

81) Actualmente este archivo contiene un mtodo que se llama: ListaAsignaturas, ahora
ingresaremos un mtodo ms que se llama: AlmacenarAsignatura.

82)

Tambin adjuntamos otro mtodo, este se llama: ActualizarAsignatura.

83)

Por ultimo ingresamos el mtodo EliminarAsignatura.

84) Una vez finalizado el ingreso de los mtodos, verificamos si realmente estos se
pueden observar desde el Explorar Web. Sobre el archivo WSAsignatura Clic
derecho/Ver en el explorador.

85) Automticamente se abre el Explorador Web y se muestra la pgina donde se pueden

visualizar los mtodos que anteriormente acabamos de ingresar.

86)

Cerramos el Explorador Web.

87)

Abrimos el archivo Default.aspx.

88)

Una vez abierto, seleccionamos el apartado de Diseo.

89) En la vista de Diseo, debajo del Label1, escribimos Agregar Asignatura. Del
apartado de Cuadro de herramientas en la seccin Estndar seleccionamos la opcin
Label y lo arrastramos hacia la derecha (realizamos dos veces esa accin); generamos
otro objeto llamado: Label2 (sobre l, Clic derecho/Propiedades) a este, en su propiedad
Text le colocamos ttulo de Nombre. Como arrastramos dos veces el Label
generamos un tercero.

90) Al Label3, al igual que el anterior (Label2), damos Clic derecho/Propiedades. En su

propiedad Text le asignamos el nombre de Id Asignatura.

91) Despus de haber ingresado los Label a la seccin de Diseo, le toca el turno a los
TextBox, del Cuadro de herramientas, en el apartado de Estndar, seleccionamos y
arrastramos hacia la derecha. En la imagen se puede observar en qu lugar lo colocamos,
ahora sobre l, Clic derecho/Propiedades; en su apartado (ID) le asignamos el ttulo de
TxtNombre.

92) Tambin agregamos otro nuevo TextBox, al igual que el anterior, sobre l, Clic
derecho/Propiedades, en su apartado (ID) asignamos el nombre de TxtId.

93) Insertamos ahora un Button, lo seleccionamos y arrastramos hacia la derecha, en la

imagen de abajo se muestra donde se coloca este objeto. Sobre l, Clic
derecho/Propiedades y en el apartado de Text asignamos el nombre de Agregar.

94) En el mismo apartado de Propiedades, en la opcin (ID) asignamos el nombre de

BtnAgregar.

95) Volvemos a agregar un nuevo Button, ahora en la parte superior de Agregar

Asignatura . Igual que en el anterior, modificamos sus propiedades. En el apartado de
Text asignndole el nombre de Consultar Asignatura.

96)

En el apartado de (ID) le asignamos el nombre de BtnConsultar.

97)
Una vez finalizado el diseo de la pgina web, que se mostrar en el Explorador.
Verificamos el cdigo que se ha generado por el ingreso de los objetos. Sobre la seccin
de Diseo, Clic derecho/Ver cdigo.

98)
Se muestra la ventana que contiene el cdigo de las herramientas ingresadas. En
primer lugar aparece el mtodo Page_Load; su cdigo. que lo ejecuta lo eliminamos.

99)
En segundo lugar aparece el evento del botn BtnConsultar; el cdigo que quitamos
del mtodo Page_Load lo agregamos dentro del botn mencionado anteriormente.

100) Por ltimo, aparece el evento del botn BtnAgregar, ingresamos su cdigo, tal y
como se muestra en la imagen de abajo.

101) Despus de haber realizado lo anterior, ahora toca generar la solucin de todo el
proyecto. Sobre el nombre de la solucin SGCA, damos Clic derecho/Generar solucin.

102) Podemos observar en la parte inferior de la pantalla que nos dice: Compilacin
correcta.

103) Regresamos a la Base de datos que creamos anteriormente. Ejecutamos la insercin

de registros en la tabla ASIGNATURA. Despus de haberlo realizado, es hora de
actualizar las operaciones hechas.

104) Regresamos al Proyecto SGCA. Sobre el archivo WSAsignatura, Clic derecho/Ver

en el explorador.

105) Automticamente se ejecuta el Explorador Web y se muestra la pgina. Podemos

observar que se encuentran los cuatro mtodos declarados en el archivo
WSAsignatura.asmx. Seleccionamos la opcin que dice ListaAsignaturas.

106)

Se muestra una nueva ventana, damos clic en el botn Invocar.

107) Muestra la siguiente informacin, en la cual se describen las asignaturas ingresadas

en la Base de Datos. Despus, cerramos el Explorar Web.

108)

Ahora, sobre el archivo Default.aspx, damos Clic derecho/Ver en el explorador.

109) Se ejecuta el Explorador Web y muestra el diseo de la pgina web, tal y como la
habamos creado anteriormente con las herramientas. Damos clic sobre el botn
Consultar Asignatura.

110) Al accionar la ejecucin del botn Consultar Asignatura, se muestra la tabla con la
informacin de las Asignaturas ingresadas en la Base de Datos.

111) Ingresamos una nueva Asignatura, asignamos el Nombre: Redes y su Id: 8, clic en el
botn Agregar. Podemos observar en la parte inferior de la tabla que nos muestra una
excepcin y no permite insertar la nueva materia, esto es a raz de que falta declarar
ciertos parmetros para que esa accin se lleve a cabo.

112)

Sobre nuestro archivo ADAsignatura.cs damos Clic derecho/Abrir.

113) Seleccionamos el mtodo ObtenerAsignatura() dentro de nuestro archivo, lo

copiamos y pegamos por debajo del mismo.

114) Despus de haber realizado lo anterior, modificamos ciertos parmetros dentro del
mtodo. La asignacin del valor BEAsignatura se quita y se estipula el valor de string,
en cada una de las partes antes ocupada por el elemento mencionado en primer lugar.

115) Generamos la solucin para dicho archivo, as guardamos los cambios realizados. En
la parte inferior de la imagen dice Compilacin correcta.

116)

Ahora, seleccionamos el archivo WSAsignatura.asmx, clic derecho sobre l, abrir.

117)

Dentro del archivo, seleccionamos el mtodo ListaAsignaturas() y lo copiamos.

118) Una vez copiado, lo pegamos por debajo del mismo mtodo, tal y como se muestra
en la imagen. Modificamos valores que antes estaban asignados con el concepto de
BEAsignatura, ahora los cambiamos a string y escribimos un mensaje de excepcin.

119)

Generamos su solucin para verificar que no haya errores de compilacin.

120) Cerramos los archivos antes abiertos y de manera general, sobre el nombre de la
solucin SGCA damos Clic derecho/Generar solucin. En la parte inferior podemos
observar que nos muestra Compilacin correcta.

121)

Sobre el archivo WSAsignatura.asmx Clic derecho/Ver en el explorador.

122) Automticamente se ejecuta el Explorador Web, y podemos observar el contenido de

dicho archivo. Se muestran los 4 mtodos que tenamos anteriormente, pero como
agregamos el de ListaAsignaturaNombre se increment a 5. En la imagen se muestra la
nueva configuracin.

123) Seleccionamos el nuevo mtodo ListaAsignaturasNombre visualizado en la pgina

del Explorador. Nos gua hacia otra pgina interna. Sobre el botn que dice Invocar
damos clic.

124)

Muestra los nombres de cada una de las Asignaturas ingresadas en la BD.

125) Regresamos a la pgina inicial. Seleccionamos la instruccin que dice descripcin

de servicios y damos clic.

126)

Nos direcciona hacia otra pgina.