Saul Remis

Developing ideas

Tutorial 4 ASP, SqlDataSource

Trabajaremos con la misma base de datos del tutorial anterior: administración y la tabla que creamos:

nombre  varchar(30)   Clave primaria

clave   varchar(30)

mail varchar(30)

Crearemos un sitio web en el Visual Studio 2010 llamado sqldatasource.

La primer página solo tendrá los hipervínculos a otras páginas que tendrán por objetivo efectuar una el alta de usuarios, otra la baja, otra las modificaciones y por último otra la consulta:

Para crear esta interface insertaremos cuatro objetos de la clase HyperLink, como mínimo debemos inicializar las propiedades text (es el texto que mostrará el hipervínculo en el navegador y la propiedad NavigateUrl que indica el nombre de la página que debe cargar el navegador cuando se presione el hipervínculo)
Como todavía no tenemos creada las otras cuatro páginas no podemos inicializar la propiedad NavigateUrl de cada HyperLink.

Como segundo paso creemos las cuatro páginas, para ello desde el menú: Archivo -> Nuevo archivo… seleccionamos la plantilla “Web Forms” y en la parte inferior definimos el nombre del archivo aspx. Los nombres de las cuatro páginas a crear serán:

altausuario.aspx

consultausuario.aspx

bajausuario.aspx

modificacionusuario.aspx

Una vez que hemos creado las cuatro páginas aspx podemos proceder a enlazar la propiedad NavigateUrl de cada control HyperLink.
Cuando seleccionamos la propiedad NavigateUrl aparece un dialogo que nos permite seleccionar la página aspx a enlazar.
Una vez inicializada la propiedad NavigateUrl podremos ver que el texto aparece subrayado (indicando que se trata de un hipervínculo)

Altas

Activemos desde el Visual Studio 2008 la pestaña altausuario.aspx para elaborar la interface visual que nos permita efectuar la carga de datos de usuarios:

Como podemos ver disponemos tres controles de tipo TextBox, el que solicita el ingreso de la clave modificamos la propiedad TextMode con el valor Password, los otros dos los dejamos con el valor SingleLine.
Disponemos un objeto de la clase Button y una Label donde mostraremos un mensaje si el alta se efectuó correctamente.
Por último disponemos un objeto de la clase HyperLink configurando la propiedad NavigateUrl con la dirección de la página principal (Default.aspx)

Conexión con la base de datos

Podemos presionar sobre el signo más que aparece en nuestra conexión y ver que tenemos disponible el acceso a las Tablas, Vistas, Procedimientos almacenados etc. definidos para la base de datos:

Podemos ahora desde el “explorador de servidores” ver las tablas, campos de una tabla e inclusive si presionamos el botón derecho del mouse sobre la tabla usuarios podemos ver los datos de la misma.

Ahora podemos empezar con el alta de usuarios.
Del cuadro de herramientas seleccionamos un control de la clase SqlDataSource (tener en cuenta que está en el grupo “Datos” y no en el grupo “Estándar”)

Ahora podemos ver que nuestro formulario tiene un componente llamado SqlDataSource1 que es de la clase SqlDataSource. Este componente visual no se verá en tiempo de ejecución como veremos más adelante.

Seleccionamos el control SqlDataSource1 del formulario y en la ventana de “Propiedades” inicializamos la propiedad ConnectionString con el valor que aparece al presionar la pestaña de la derecha (básicamente es la cadena de conexión que creamos anteriormente)

Ahora nos queda configura la propiedad InsertQuery con el comando SQL que nos permite insertar un registro en una tabla.
La propiedad InsertQuery nos abre una ventana de diálogo donde debemos configurar el comando INSERT:

Este diálogo es muy importante ingresar correctamente el comando SQL parametrizando los valores que serán remplazados en tiempo de ejecución con los datos que cargue el operador.

Los parámetros se indican con un nombre antecediéndole el carácter @.
Luego de crear completamente el comando Insert procedemos a presionar el botón “Actualizar parámetros”.
Si queremos comprobar si nuestro comando SQL está correcto presionamos el botón “Generador de consultas…” y desde este nuevo diálogo presionamos el botón “Ejecutar consulta”:

 

(También desde este diálogo podemos codificar la consulta, probarla y finalmente confirmarla)

Lo que no hay que olvidarse nunca es que cada vez que agregamos o borramos un parámetro de nuestro comando SQL es presionar el botón “Actualizar parámetros”.

Ahora codificamos el evento clic del botón de alta:

using System;

using System.Collections.Generic;

using System.Linq;

using System.Web;

using System.Web.UI;

using System.Web.UI.WebControls;

using System.Data.SqlClient;

public partial class altausuario : System.Web.UI.Page

{

    protected void Page_Load(object sender, EventArgs e)

    {

    }

    protected void Button1_Click(object sender, EventArgs e)

    {

        try{

            this.SqlDataSource1.InsertParameters[“nombre”].DefaultValue = this.TextBox1.Text;

            this.SqlDataSource1.InsertParameters[“clave”].DefaultValue = this.TextBox2.Text;

            this.SqlDataSource1.InsertParameters[“mail”].DefaultValue = this.TextBox3.Text;

            this.SqlDataSource1.Insert();

            this.Label4.Text = “Se efectuó la carga”;

        }

        catch (SqlException ex)

        {

            this.Label4.Text = ex.Message;

        }

    }

}

Lo primero que debemos hacer es importar el espacio de nombres donde se encuentra definida la clase SqlException:

using System.Data.SqlClient;

Al presionar el botón inicializamos los tres parámetros del comando SQL que hemos configurado en el SqlDataSource. Para acceder a dichos parámetros disponemos de la propiedad InsertParameters que le indicamos como subíndice el nombre del parámetro.
Luego de inicializar los tres parámetros procedemos a llamar al método Insert de la clase SqlDataSource.
Todo esto lo hacemos capturando la excepción SQLException.

Consultas

Seleccionamos del Explorador de soluciones la página consultausuario.aspx y procedemos a elaborar la siguiente interface visual (disponemos un TextBox, un Button, una Label, un HyperLink y un SqlDataSoruce:

Configuramos el SqlDataSource1, luego de seleccionarlo con el mouse modificamos la propiedad ConnectionString (con la conexión creada anteriormente) y en el diálogo que abre la propiedad SelectQuery procedemos a codificar el comando select:

select clave,mail from usuarios where nombre=@nombre

Es decir recuperamos la clave y mail de un determinado usuario (recordar de presionar el botón “Actualizar parámetros)

El código del evento clic es:

using System;

using System.Collections.Generic;

using System.Linq;

using System.Web;

using System.Web.UI;

using System.Web.UI.WebControls;

using System.Data.SqlClient;

public partial class consultausuario : System.Web.UI.Page

{

    protected void Page_Load(object sender, EventArgs e)

    {

    }

    protected void Button1_Click(object sender, EventArgs e)

    {

        try

        {

         this.SqlDataSource1.SelectParameters[“nombre”].DefaultValue = this.TextBox1.Text;

         this.SqlDataSource1.DataSourceMode = SqlDataSourceMode.DataReader;

         SqlDataReader datos = (SqlDataReader)this.SqlDataSource1.Select(DataSourceSelectArguments.Empty);

         if (datos.Read())

             this.Label2.Text = “Usuario encontrado<br>Clave: ” + datos[“clave”] + “<br>Mail: ” + datos[“mail”];

            else

                this.Label2.Text = “No se ha encontrado al usuario”;

        }

        catch (SqlException ex)

        {

            this.Label2.Text = ex.Message;

        }

    }

}

Para poder recuperar los datos mediante un objeto de la clase SqlDataReader debemos configurar el SqlDataSource indicando a la propiedad DataSourceMode el siguiente valor:

  this.SqlDataSource1.DataSourceMode = SqlDataSourceMode.DataReader;

Ahora cuando llamemos al método select del SqlDataSource lo hacemos con la siguiente sintaxis:

SqlDataReader datos = (SqlDataReader)this.SqlDataSource1.Select(DataSourceSelectArguments.Empty);

Luego recorremos el SqlDataReader (como este caso puede retornar cero o una fila lo hacemos mediante un if:

if (datos.Read())

Si el método Read retorna true luego podemos acceder a la fila recuperada con el select.

Bajas

Seleccionamos del Explorador de soluciones la página bajausuario.aspx y procedemos a elaborar la siguiente interface visual:

Inicializamos la propiedad ConnectionString del SqlDataSource1 con la conexión que habíamos creado e inicializamos la propiedad DeleteQuery:

Delete from usuarios where nombre=@nombre

Luego el código a ejecutar cuando se presiona el botón “Borrar” de la página es:

try

        {

            this.SqlDataSource1.DeleteParameters[“nombre”].DefaultValue = this.TextBox1.Text;

            int cant = SqlDataSource1.Delete();

            if (cant==1)

                this.Label2.Text = “Se borró el usuario”;

            else

                this.Label2.Text = “No existe un usuario con dicho nombre”;

        }

        catch (SqlException ex)

        {

            this.Label2.Text = ex.Message;

        }

Procedemos a inicializar el parámetro y luego llamamos al método Delete del SqlDataSource. El método Delete retorna un entero y representa la cantidad de filas borradas de la tabla.

Modificaciones

Por último implementaremos la modificación de datos. Seleccionamos del Explorador de soluciones la página modificacionusuario.aspx y procedemos a elaborar la siguiente interface visual:

Para efectuar la modificación de datos de un usuario procederemos primero a la búsqueda de los datos actuales. Esto hace que necesitemos un control de la clase SqlDataSource.
El SqlDataSource1 nos permite consultar los datos de un usuario por su nombre y mostrar el resultado en dos controles de tipo TextBox. La propiedad SelectQuery:

select clave,mail from usuarios where nombre=@nombre

Luego también configuramos la propiedad UpdateQuery:

UPDATE usuarios SET clave = @clave, mail = @mail WHERE (nombre = @nombre)

Luego el código para los eventos clic de los dos botones es:

protected void Button1_Click(object sender, EventArgs e)

    {

        try

        {

            this.SqlDataSource1.SelectParameters[“nombre”].DefaultValue = this.TextBox1.Text;

            this.SqlDataSource1.DataSourceMode = SqlDataSourceMode.DataReader;

            SqlDataReader datos = (SqlDataReader)this.SqlDataSource1.Select(DataSourceSelectArguments.Empty);

            if (datos.Read())

            {

                this.Label2.Text = “Usuario encontrado<br>Clave: ” + datos[“clave”] + “<br>Mail: ” + datos[“mail”];

            }

            else

            {

                this.Label2.Text = “No se ha encontrado al usuario”;

            }

        }

        catch (SqlException ex)

        {

            this.Label2.Text = ex.Message;

        }

    }

    protected void Button2_Click(object sender, EventArgs e)

    {

            try

            {

                this.SqlDataSource1.UpdateParameters[“clave”].DefaultValue = this.TextBox2.Text;

                this.SqlDataSource1.UpdateParameters[“email”].DefaultValue = this.TextBox3.Text;

                this.SqlDataSource1.UpdateParameters[“nombre”].DefaultValue = this.TextBox1.Text;

                int cant = this.SqlDataSource1.Update();

                if (cant == 1)

                    this.Label4.Text = “Usuario modificado”;

                else

                    this.Label4.Text = “No se ha modificado al usuario,puede que no exista, compruebelo”;

            }

            catch (SqlException ex)

            {

                this.Label4.Text = ex.Message;

            }

    }

6 comentarios el “Tutorial 4 ASP, SqlDataSource

  1. nuria
    enero 3, 2013

    Para volver a ejecutar desde codigo un SQLDataSource, como puedo hacerlo?

    Es que lo q hago es, nada mas cargar se ejecuta el sqldatasource y me lo muestra en un gridview.A continuaicón llevo entremedias otro proceso que me insertar un nuevo dato en la base de datos, pero el grid no se actualiza, y lo que quiero es q se actualice montrandome el nuevo dato sin necesidad de refrescar la pagina entera

  2. saulremis
    enero 3, 2013

    Que tal Nuria, espero que el tutorial te haya resultado útil, gracias por leerlo🙂
    Para realizar el refresco del datasource, puedes probar con la siguiente sentencia pero te actualizará la página completa.
    SqlDataSource.SelectCommand = “consulta a realizar a la base de datos”;

    Para que solo te actualice el datagrid, vas a tener que meter la sección que modifica la base de datos y el propio datagrid dentro de un contenedor de tipo “ScriptManager”. De esta forma,cuando modificas las base de datos, en vez de refrescar la página completa, solo te refresca lo contenido dentro del ScriptManager😉

    A ver si puedo subir esta semana un tuto sobre como usar el scriptManager😉
    Saludos y felices fiestas

    • nuria
      enero 3, 2013

      Nada, tampoco me hace nada…😦 no se si es que estaré haciendo algo mal; lo cierto es que soy bastante novata en esto asique seguramente algo se me escape. También pruebo el Response.Redirect(“pagina.aspx”) para que actualice aunque sea toda la pagina y no me lo hace!

      Muchas gracias por la respuesta y por tus tutoriales😀

      • saulremis
        enero 3, 2013

        Gracias a ti😀
        Si el redirect no te funciona después de realizar la entrada en la base de datos, puede ser más que no te esté guardando bien.
        Saludos,
        Saul

  3. mariovalle
    febrero 18, 2013

    puedes poner el codigo fuente para comprender mas tu procesos excelente guias te felicito

Responder

Introduce tus datos o haz clic en un icono para iniciar sesión:

Logo de WordPress.com

Estás comentando usando tu cuenta de WordPress.com. Cerrar sesión / Cambiar )

Imagen de Twitter

Estás comentando usando tu cuenta de Twitter. Cerrar sesión / Cambiar )

Foto de Facebook

Estás comentando usando tu cuenta de Facebook. Cerrar sesión / Cambiar )

Google+ photo

Estás comentando usando tu cuenta de Google+. Cerrar sesión / Cambiar )

Conectando a %s

Información

Esta entrada fue publicada el julio 13, 2012 por en .NET, Artículo, ASP, Programación C#, Web.
A %d blogueros les gusta esto: