Tutorial ASPX

Creación de un Proyecto WEB en ASPX

1. Para la creación de un servicio web con Visual Studio 2008, este caso, se debe seleccionar en la página de inicio del compilador: Archivo->Nuevo sitio Web…

2. Una vez seleccionado el tipo de aplicación, se presenta la pagina inicial donde se selecciona: Ubicación donde se instalara la aplicación y el lenguaje de referencia, para este caso Visual Basic. Dar Aceptar.

3. Se levanta un entorno para la implementación y desarrollo de la aplicación.

3. Se levanta un entorno para la implementación y desarrollo de la aplicación. Luego cambiar nombre a la pagina por defecto, en este caso a Login.aspx

4. Si se desea agregar más paginas, click izquierdo sobre el proyecto, donde aparecerá la ventana de plantillas del compilador, cambiar al nombre que representa al servicio que necesita implementar.

5. Una vez aceptado los ajustes, aparece en el Explorador de soluciones la nueva página. Si se desea seguir agregando más páginas, repetir paso 4.

6. Para implementar la pagina de Login o acceso a la aplicación y asi dar un nivel de acceso restringido a la aplicación, se debe agregar un texbox para el nombre de usuario(txtUsuario) y un textbox para la clave (txtClave), ajustando este ultimo la propiedad TextMode a Password , objeto esconda la clave a los usuarios no autorizados. Además de un botón para generar la acción el cual debe implementar el código para hacer efectiva dicha acción.

7. A continuación se presenta la interfaz de inicio (Login) y sus correspondientes elementos graficos.

8. El código de implementación interno(botón Login)

Partial Class _Default Inherits System.Web.UI.Page Dim usuario, usuario1 As String Dim clave, clave1 As String

Protected Sub btnLogin_Click(ByVal sender As Object, ByVal e As System.EventArgs) Handles btnLogin.Click usuario = "admin" 'hardcore usuario1 = "super" clave = "admin" clave1 = "super" If txtUsuario.Text = usuario And txtClave.Text = clave Or txtUsuario.Text = usuario1 And txtClave.Text = clave1 Then Response.Redirect("ControlDeOrdenes.aspx") Else Response.Redirect("Descarga.aspx") End If End SubEnd Class

Nota: Response.Redirect("ControlDeOrdenes.aspx") permite llamar a una pagina en particular9. Si desea compilar la aplicación utilizar Ejecutar sin Depuración

10. A continuación se presenta la página inicial de la aplicación.

11. Si se ingresa en forma correcta el usuario y clave se presenta la página principal, objeto utilizar los servicios que provee la aplicacion.

+++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++

Ajuste de Datos y Edición de Datos por Página

A. INGRESO DE DATOS

1. En base a la interfaz de captura de datos, se describe a continuación el ingreso de datos a la tabla Cliente:

2. Dar doble click en el Botón de aceptar Datos e ingresar el siguiente código de implementación:

Imports SystemImports System.DataImports System.Data.SqlClientPartial Class Cliente Inherits System.Web.UI.Page Protected Sub btnAgregar_Click(ByVal sender As Object, ByVal e As System.EventArgs) Handles btnAgregar.Click Dim objConex As New SqlConnection 'Crea un canal de conexion Dim objCmd As New SqlCommand 'Crea las sentencia u ordenes Dim rut As String Dim nombre As String Dim apel As String Dim fono As String Dim direc As String Dim correo As String Dim servidor As String servidor = "C:\WebSiteCatalogo\App_Data\Catalogo.mdf" 'Posicion del(servidor) objConex.ConnectionString = "Data Source=.\SQLEXPRESS;AttachDbFilename=" & servidor & ";Integrated Security=True;User Instance=True" rut = txtRut.Text nombre = txtNombre.Text apel = txtApel.Text fono = txtFono.Text direc = txtDirec.Text correo = txtCorreo.Text objCmd.Connection = objConex objCmd.CommandText = "INSERT INTO CLIENTE(rut,nombre,apel,fono,direc,correo) VALUES (@rut,@nombre,@apel,@fono,@direc,@correo)" objCmd.Parameters.AddWithValue("@rut", rut) objCmd.Parameters.AddWithValue("@nombre", nombre) objCmd.Parameters.AddWithValue("@apel", apel) objCmd.Parameters.AddWithValue("@fono", fono) objCmd.Parameters.AddWithValue("@direc", direc) objCmd.Parameters.AddWithValue("@correo", correo) objConex.Open() objCmd.ExecuteNonQuery() objConex.Close() objCmd.Parameters.Clear() MsgBox("Registro Ingresado a Cliente")

End SubEnd Class

B. EDICION DE DATOS

1. Elija pagina donde desea insertar un grilla de datos para edición de ellos, objeto poder presentar, modificar o eliminarlo desde la tabla de BD.

2. Seleccione u objeto de datos GridView desde la Paleta Grafica de VStudio, tal como se aprecia en la grafica y arrástrelo a la pagina aspx.

3. En la página aspx se presentara de la siguiente forma para poder configurar la grilla de datos

4. En el lado superior derecho del objeto GridView clickear sobre el símbolo de redireccionamiento que presenta “< “. Aparecerá una ventana de configuración de datos que se cargaran al objeto.

5. En “Elegir origen de datos:” (Ninguno), seleccionar desde el selector del combo box el origen de datos < Nuevo origen de datos…>

6. Al seleccionar < Nuevo origen de datos…>, aparece el “Asistente para la configuración de orígenes de datos”, seleccionar “Base de datos”. Al dar click sobre el tambor, asistente especifica por defecto un origen de datos: SqlDataSource1, dar Aceptar para continua con configuración.

7. Al dar Aceptar , aparece la pagina de configuración de origen de datos para SqlDataSource1. Desde el combo que esta sobre el término “Cadena de Conexión” selecciona uno existente o simplemente dar click sobre el Botón “Nueva conexión…”.

8. Al dar dar click sobre el Botón “Nueva conexión…”. Aperece una ventana para buscar la ruta de la base de datos donde se requieren sacar datos. En esta nueva ventana (Agregar conexión), seleccione dando click sobre el botón “Examinar…”.

9. Al dar dar click sobre el Botón “Nueva conexión…”. Aparece una ventana para buscar la ruta de la base de datos donde se requieren sacar datos. En esta nueva ventana (Agregar conexión), seleccione dando click sobre el botón “Examinar…”.

10. base de datos y dar clic en botón “Abrir”.

11. Al dar click sobre el Botón “Abrir”, se carga en la ventana de conexión la ruta de ubicación de la fuente de datos, objeto proseguir con configuración. Dar aceptar para cargar el origen de datos.

12. Una vez que aparece en forma definitiva el origen de datos, dar click sobre el Botón “Siguiente”, aparecerá la venta de configuración, donde se pide guardar la conexión implementada.

13. Dar click sobre el Botón “Siguiente”.

14. Aparece ventana de configuración de la instrucción SELECT, seleccionar Tabla y luego la casilla con * si desea todos los datos de la tabla, o de lo contrario seleccione las casillas que requiera para la presentación de datos.

15. Seleccionar opción de botones “Avanzadas…, objeto ajustar las instrucciones de edición que va a presentar la grilla de datos. Marque ambas cajas de selección: Generar instrucciones Insert, Update y Delete y Usar concurrencia optimista. Luego dar Aceptar

16. Luego de dar Aceptar, se genera una ventana para efectuar una consulta de prueba y para ver los datos. Una vez revisado dar Finalizar.

17. Finalmente se llega a la interfaz de inicio. En la Ventana de Tareas de GridView seleccionar todas las casillas del pie de pagina (Habilitar paginación hasta Habilitar selección).

18. Compilar y probar la aplicación. Presenta en esta instancia los datos y los correspondientes controles de edición: Editar, Eliminar, Seleccionar. Objeto pueda actualizar datos en forma directa.