miércoles, 12 de septiembre de 2012

Introducción a ASP.net ejemplos

INTRODUCCIÓN A ASP.NET

La palabra reservada asp.net (Active Server Pages) proviene de la versión antigua asp, pero ahora aplicada a la plataforma Microsoft .net.
Microsoft tiene una plataforma muy amplia, tanto así como asp.net vb.net c# (csharp) o f# (fsharp).
La programación en .net es muy sencilla y simple de aplicar tanto a nivel servidor o aplicativo. En esta primera entrada del blog se explicará como hacer un web page y crear una conexión con una base de datos SQL Server y hacer una simple y pequeña consulta en un GridView.

El primero paso es crear nuestro Sitio Web :















Una vez acá, debemos especificar qué opciones debemos ingresar, obviamente se debe poner Sitio Web ASP.NET. Si se fijan bien a la izquierda, hay una pestaña especificando si deseas programar en Visual Basic o Visual C#. Para ambos casos funcionan igual
En caso de la ubicación web, tu puedes especificar donde puede ir : 

Una vez dado Aceptar, veremos una pantalla como esta : 


Lo que se debe hacer a continuación es borrar alguna de las soluciones que tenemos implementadas por default. Borraremos la carpeta Account, Scripts, Styles About.aspx, Default.aspx y por último el Site.master.

Explicación:
Lo que queremos hacer acá es borrar las carpetas que POR AHORA no las necesitaremos, eso no quiere decir que no sirven para nada; claro que sirven, y un montón, pero por ahora las dejaremos así.

El siguiente paso es crear nuestra primera web page, lo puedes hacer así como la imagen o si no presionando Ctrl + Mayús + A

Ahora debemos crear nuestra primera página, seleccionamos web forms y le damos el nombre de Miprimerapagina, o como deseen llamarla.

Nos aparecerá el explorador de soluciones con un elemento mas en su lista, el web form que acabamos de crear.

Ahora si viene lo interesante, mediante el cuadro de herramientas (Si no lo tienes solo vas a Menú - Ver - Cuadro de Herramientas). Jalaremos un control Button y un control GridView (Control dentro de pestaña Datos), nos quedará algo como esto:

Si desean que el Button tengo un texto, allí tienen el código de control asp html:
El ID es simplemente un ID, osea, una clave con la cuál el control se va a identificar, no olviden que la propiedad runat = "server", siempre debe ir, si lo sacas de allí, me temo que te saldrá un error, ese código es para que el control corra en el servidor. Y por último el Text, donde tu puedes ponerle lo que se te antoje, por ejemplo yo puse Listar porque el ejemplo de hoy se hará una consulta de Listado.

El GridView muestra los valores de un origen de datos en una tabla donde cada columna representa un campo y cada fila representa un registro. El control GridView permite seleccionar, ordenar y editar estos elementos.
Si ya han programado en visual basic.net, cumple la misma función de un DataGridView

Ahora haremos una pequeña pausa y nos vamos para nuestro SQLServer o con la bd que estén utilizando y crearemos una base de datos Consultorio2012 y una tabla empleados con solo 3 campos y 2 registros:


Una vez esto creado, regresamos a nuestro visual e ingresamos dentro del codebehind de nuestra web page: Miprimerapagina.aspx.vb (.net) Miprimerapagina.aspx.cs (C#).
Dentro de ella importamos las librerías necesarios que necesitaremos para crear nuestra primera conexión.
Para importar en vb.net se use la palabra reservada Imports y en C# se utiliza la palabra reservada Using :


Ahora crearemos una variable tipo SqlConnection para establecer nuestra conexión, se puede hacer de 2 tipos. Uno si es que nuestro sql no tiene usuario y una contraseña, y la otra es cuando si la tiene:
Aparte de ellos crearemos un método que retorne un datatable
En C# el código sería:
SqlConnection cn = new SqlConnection("Cadena de conexión")
public DataTable listadoClientes(){
  SqlDataAdapter da = new SqlDataAdapter("select * from empleados",cn);
  DataTable tb = new DataTable();
  da.Fill(tb);
  return tb;
}


Explicación:

- Creamos nuestra cadena de conexión, previo a importar las librerías necesarias.
- Creamos un método que retorna un datatable.
- Dentro del método encontraremos a la palabra reservada SqlDataAdapter.
- Como su nombre lo indica, el SqlDataAdapter es un adaptador que acepta un query de nuestro SQLServer u otra base de datos. El SqlDataAdapter solo acepta consultas, no stored procedures. Además de ellos el SqlDataAdapter toma como referencia la query y la conexión como podemos ver
SqlDataAdapter da = new SqlDataAdapter( acá va el query, acá va la conexión);
- Creamos una variable tb del tipo DataTable.
- La palabra reservada DataTable es un objeto de la librería ADO.net y se utiliza para 'representar' una tabla, incluso se pueden llenar desde un origen de datos de una base de datos, como veremos en el siguiente punto.
- POBLAR LA TABLA, ¿Qués es poblar la tabla?. Simplemente es llenar nuestro DataTable con la query (SqlDataAdapter) que hemos especificado.
- RETORNAR LA TABLA. Nuestro método es un método tipo DataTable, por lo que debemos retornar un DataTable : Return tb;

Ahora que tenemos ya claro como hacer nuestra conexión y crear un método tipo datable, ya casi es hora de terminar esta primera entrada, lo que haremos es que mediante el botón que tenemos, se visualize el datatable que hemos retornado. Lo único que tiene que hacer es hacer doble clic en el botón de nuestro formulario web y nos aparecerá algo como esto:

Lo que nos acaba de aparecer es un evento del botón, cada control asp tiene un evento. Dentro de este evento de botón se puede hacer muchas cosas, pero por ahora lo que haremos es visualizar nuestro método que retorna el datatable con la consulta del query dentro. Lo haremos así:
Código C#:

gvlistado.DataSource = listadoClientes();
gvlistado.DataBind();

Código vb.net:


Con 2 líneas de código es más que suficiente, el DataSource es una propiedad del gridview e indica el origen de datos del gridview, es decir que nuestro origen de datos es el datatable con la query dentro.
El DataBind sirve para bindear los datos, es como el .Fill, puebla los registros allí.
Al ejecutar tendrán algo como esto:

PostData: Fíjense bien a la hora de hacer su query, en mi ejemplo sql he puesto la tabla con el nombre Cliente y en mi programación visual como 'Clientes'. Lo puse así porque por motivos de trabajo acabé esto en 2 días diferentes.

Espero que les haya servido de mucho, nos vemos en el próximo post.
Tema:
Stored Procedures y mantenimiento de Clientes








No hay comentarios:

Publicar un comentario