¿Le resultó útil esta página?
Sus comentarios sobre este contenido son muy importantes. Háganos saber su opinión.
¿Tiene comentarios adicionales?
Caracteres restantes: 1500
Exportar (0) Imprimir
Expandir todo
Importante Es posible que este documento no represente los procedimientos recomendados para el desarrollo actual. Puede que los vínculos a las descargas y otros recursos ya no sean válidos. Encontrará aquí la versión que se recomienda en la actualidad.

Tutorial: Crear controles Web ASP.NET enlazados a datos personalizados para ASP.NET 1.1

En este tutorial se muestra cómo crear un control de servidor simple enlazado a datos que expone un origen de datos enlazable.

Un control de servidor enlazado a datos de ASP.NET proporciona una interfaz de usuario (IU) para un origen de datos que representa una colección de registros o elementos. Los controles de servidor DataList y Repeater son ejemplos de controles de servidor enlazados a datos. Para obtener más información sobre los controles enlazados a datos proporcionados con ASP.NET, vea Información general sobre los controles de servidor Web ASP.NET enlazados a datos.

NoteNota

El control que se ilustra en este tutorial es compatible con ASP.NET versión 1.1. Para obtener más información sobre cómo crear controles Web personalizados enlazados a datos para ASP.NET 2.0, vea Desarrollar controles de servidor Web enlazados a datos personalizados para ASP.NET 2.0

Un control de servidor enlazado a datos de ASP.NET 1.1 se puede enlazar a cualquiera de los tipos siguientes:

En este tutorial, creará un control enlazado a datos que se pueda enlazar a cualquier objeto que implemente la interfaz IEnumerable.

Entre las tareas ilustradas en este tutorial se incluyen las siguientes:

  • Crear el sitio Web para probar el control enlazado a datos personalizado.

  • Crear una clase de controles enlazados a datos. La clase debe exponer una propiedad de tipo IListSource o IEnumerable para que el programador de páginas pueda especificar la ubicación de los datos que se van a enlazar. También debe reemplazar los métodos DataBind y CreateChildControls de la clase base.

  • Registrar el control en el archivo Web.config.

  • Probar el control en una página Web ASP.NET.

  • Compilar el control para que pueda distribuirse como código binario.

  • Probar el control de servidor personalizado enlazado a datos compilado.

Puede utilizar la compilación dinámica de ASP.NET para probar el control en una página sin compilarlo en un ensamblado. ASP.NET compila dinámicamente el código situado en el directorio App_Code en la raíz del sitio Web. De este modo, es posible obtener acceso a las clases de los archivos de código fuente de App_Code desde las páginas sin necesidad de compilarlas manualmente en ensamblados.

NoteNota

El directorio App_Code es una nueva característica que no estaba disponible en ASP.NET 1.0 y 1.1. El uso del directorio App_Code para las pruebas iniciales del control es opcional. Los pasos principales para crear un control de servidor son los mismos que en las versiones anteriores, como se describe en la sección "Compilar el control en un ensamblado".

Para crear un sitio Web para probar los controles enlazados a datos personalizados

  1. Cree un sitio Web denominado ServerControlsTest.

    Puede crear el sitio en IIS como un directorio virtual denominado ServerControlsTest. Para obtener más información sobre la creación y configuración de un directorio virtual de IIS, vea Cómo: Crear y configurar directorios virtuales en IIS.

  2. Cree un directorio App_Code justo debajo del directorio raíz del sitio Web.

El paso siguiente consiste en crear la clase de controles.

Para crear la clase SimpleDataBoundControl

  1. En la carpeta App_Code creada en el procedimiento anterior, cree una clase denominada SimpleDataBoundControl.cs o SimpleDataBoundControl.vb, según el lenguaje de programación que desee utilizar.

  2. Agregue el código siguiente al archivo de la clase.

    using System;
    using System.Collections;
    using System.ComponentModel;
    using System.Web;
    using System.Web.UI;
    using System.Web.UI.WebControls;
    
    namespace Samples.AspNet.CS.Controls
    {
        [
            DefaultProperty("DataSource")
        ]
        public class SimpleDataBoundControl : WebControl
        {
            private IEnumerable _dataSource;
            private Label _label;
            private Button _button;
            private Table _table;
    
            [
            Category("Data"),
            DefaultValue(""),
            Description("An exposed data source: A public member of type IEnumerable to bind to such as an Array, ArrayList or Hashtable.")
            ]
            public virtual IEnumerable DataSource
            {
                get
                {
                    return _dataSource;
                }
                set
                {
                    if ((value is IEnumerable) || (value == null))
                    {
                        _dataSource = value;
                    }
                    else
                    {
                        throw new ArgumentException();
                    }
                }
            }
    
            protected virtual IEnumerable GetDataSource()
            {
                if (_dataSource == null)
                {
                    return null;
                }
    
                IEnumerable resolvedDataSource;
                resolvedDataSource = _dataSource as IEnumerable;
    
                return resolvedDataSource;
            }
    
            protected virtual void CreateMyControlHeirarchy(bool useViewState)
            {
                IEnumerable resolvedDataSource = null;
                if (useViewState)
                {
                    if (ViewState["RowCount"] != null)
                    {
                        resolvedDataSource = new object[(int)ViewState["RowCount"]];
                    }
                    else
                    {
                        throw new Exception("Unable to retrieve expected data from ViewState");
                    }
                }
                else
                {
                    resolvedDataSource = GetDataSource();
                }
    
                if (resolvedDataSource != null)
                {
                    // Create a label that will indicate form which source the data has been provided.
                    String s;
                    if (useViewState)
                    {
                        s = "Data collection retrieved from ViewState:";
                    }
                    else
                    {
                        s = "Data collection retrieved from bound data source:";
                    }
                    _label = new Label();
                    this.Controls.Add(this._label);
                    _label.Text = s;
    
                    _button = new Button();
                    this.Controls.Add(this._button);
                    _button.Text = "Test re-binding of ViewState";
    
                    _table = new Table();
                    this.Controls.Add(this._table);
    
                    foreach (object dataItem in resolvedDataSource)
                    {
                        TableRow row = new TableRow();
                        _table.Rows.Add(row);
                        TableCell cell = new TableCell();
                        if (!useViewState)
                        {
                            cell.Text = dataItem.ToString();
                        }
                        row.Cells.Add(cell);
                    }
    
                    ViewState["RowCount"] = _table.Rows.Count;
                }
            }
    
            protected override void CreateChildControls()
            {
                Controls.Clear();
    
                if (ViewState["RowCount"] != null)
                {
                    bool useViewState = true;
                    CreateMyControlHeirarchy(useViewState);
                }
            }
    
            public override void DataBind()
            {
                base.OnDataBinding(EventArgs.Empty);
    
                Controls.Clear();
    
                ClearChildViewState();
    
                TrackViewState();
    
                bool useViewState = false;
                CreateMyControlHeirarchy(useViewState);
    
                ChildControlsCreated = true;
            }
    
            protected override void RenderContents(HtmlTextWriter writer)
            {
                this._label.RenderControl(writer);
                this._table.RenderControl(writer);
                this._button.RenderControl(writer);
            }
        }
    }
    
    

Descripción del código

La clase SimpleDataBoundControl representa una tabla HTML basada en la colección de datos especificada en su propiedad DataSource. Los controles de servidor Web enlazados a datos de ASP.NET 1.1 deben exponer una propiedad DataSource enlazable que se pueda establecer en un tipo IEnumerable o IListSource.

En el código de ejemplo, el descriptor de acceso set de la propiedad DataSource comprueba que el valor que se va a establecer es null o un objeto de tipo IEnumerable. Por consiguiente, en este ejemplo el programador de páginas puede crear un enlace a cualquier tipo IEnumerable, como un objeto Array, ArrayList o Hashtable. El programador puede dejar inicialmente DataSource establecido en su valor null predeterminado y establecer la propiedad en el código.

Los atributos de metadatos Category, DefaultValue y Description proporcionan información que utilizan las herramientas de diseño, el analizador de páginas de ASP.NET y Common Language Runtime.

El método auxiliar CreateMyControlHeirarchy mantiene la creación de la jerarquía de controles secundarios del control en una ruta de acceso al código común. Tanto el método DataBind reemplazado como el método CreateChildControls reemplazado llaman al método auxiliar. Se requiere el método DataBind reemplazado, ya que enumera el objeto en el origen de datos asociado y crea los controles secundarios. Se requiere el método CreateChildControls reemplazado, ya que es el encargado de volver a crear la jerarquía de controles secundarios en función de los datos guardados en el estado de vista.

El control se representa reemplazando el método RenderContents heredado. Esto permite que el control se represente dentro de sus propias etiquetas. El parámetro pasado al método RenderContents es un objeto del tipo HtmlTextWriter, que es una clase de utilidad que tiene métodos para representar etiquetas y otros formatos HTML (así como de las variantes de HTML).

Para obtener más información sobre las implementaciones necesarias de un control de servidor Web enlazado a datos, vea Desarrollar controles de servidor Web enlazados a datos personalizados para ASP.NET 1.1.

Un prefijo de etiqueta es el prefijo, como "asp" en <asp:Table />, que aparece antes del nombre de tipo del control cuando éste se crea mediante declaración en una página. Para habilitar el control a fin de que pueda utilizarse mediante declaración en una página, ASP.NET necesita que se asigne un prefijo de etiqueta al espacio de nombres del control. El programador de páginas puede proporcionar una asignación de prefijo de etiqueta y espacio de nombres agregando una directiva @ Register en cada página que utiliza el control personalizado, como en el ejemplo siguiente:

<%@ Register TagPrefix="aspSample" 
    Namespace="Samples.AspNet.CS.Controls"%>
NoteNota

La directiva @ Register de ASP.NET 2.0 es la misma que en ASP.NET 1.0 y ASP.NET 1.1. Si está familiarizado con la directiva @ Register de versiones anteriores de ASP.NET, observará que el atributo assembly que especifica el nombre de ensamblado del control no aparece en la directiva @ Register anterior. Cuando falta el atributo assembly, ASP.NET deduce que el ensamblado se ha compilado dinámicamente a partir de los archivos de código fuente del directorio App_Code.

Como alternativa al uso de la directiva @ Register en cada página .aspx, el programador de páginas puede especificar la asignación de prefijo de etiqueta y espacio de nombres en el archivo Web.config. Esto resulta útil si el control personalizado se utiliza en varias páginas de la aplicación Web.

NoteNota

La entrada de configuración para el prefijo de etiqueta es una característica nueva de ASP.NET 2.0. En ASP.NET 1.0 y 1.1, la asignación del prefijo de etiqueta se especificaba en la directiva @ Register de cada página que utilizaba el control personalizado.

En el procedimiento siguiente se describe cómo especificar la asignación del prefijo de etiqueta en el archivo Web.config.

Para agregar una asignación de prefijo de etiqueta al archivo Web.config

  1. Si el sitio Web aún no tiene un archivo denominado Web.config, cree uno en la carpeta raíz del sitio Web.

  2. Si ha creado un archivo Web.config nuevo (vacío), copie el marcado XML siguiente en él y guarde el archivo. Si el sitio ya tiene un archivo Web.config, agréguele el elemento resaltado siguiente.

    NoteNota

    La entrada de prefijo de etiqueta debe ser un elemento secundario del elemento <controls>, que debe estar situado bajo la sección <pages>, debajo de <system.web>.

    <?xml version="1.0"?>
    <configuration>
      <system.web>    
       <pages>
         <controls>
           <add tagPrefix="aspSample"   
             namespace="Samples.AspNet.CS.Controls">
           </add>
         </controls>
       </pages>
      </system.web>
    </configuration>
    

    <?xml version="1.0"?>
    <configuration>
      <system.web>    
       <pages>
         <controls>
           <add tagPrefix="aspSample"   
             namespace="Samples.AspNet.VB.Controls">
           </add>
         </controls>
       </pages>
      </system.web>
    </configuration>
    

    La sección resaltada muestra una entrada de prefijo de etiqueta que asigna el prefijo "aspSample" al espacio de nombres Samples.AspNet.CS.Controls o Samples.AspNet.VB.Controls.

Una vez especificada la asignación del prefijo de etiqueta en el archivo de configuración, puede utilizar el control SimpleDataBoundControl mediante declaración como <aspSample:SimpleDataBoundControl /> en cualquier página del sitio Web.

En esta sección del tutorial creará el marcado de la página que le permitirá probar el control enlazado a datos personalizado.

Para crear una página que utilice el control enlazado a datos personalizado

  1. Cree un archivo denominado TestSimpleDataBoundControl.aspx en el sitio Web.

  2. Copie el marcado siguiente en el archivo TestSimpleDataBoundControl.aspx y guarde el archivo.

    <%@ Page Language="C#" Trace="true" EnableViewState="true" %>
    <%@ Register TagPrefix="aspSample" Namespace="Samples.AspNet.CS.Controls" %>
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
        "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <script runat="server">
        protected void Page_Load(object sender, EventArgs e)
        {
            if (!IsPostBack)
            {
                ArrayList a = new ArrayList();
                a.Add("One");
                a.Add("Two");
                a.Add("Three");
                a.Add("Four");
    
                simpleDataBoundControl1.DataSource = a;
                simpleDataBoundControl1.DataBind();
            }
        }
    </script>
    <html xmlns="http://www.w3.org/1999/xhtml" >
    <head runat="server">
        <title>SimpleDataBoundControl test page</title>
    </head>
    <body>
        <form id="form1" runat="server">
        <div>
            <aspSample:SimpleDataBoundControl runat="server" id="simpleDataBoundControl1" BorderStyle="Solid" ></aspSample:SimpleDataBoundControl>
        </div>
        </form>
    </body>
    </html>
    
    
  3. Ejecute la página TestSimpleDataBoundControl.aspx.

  4. Realice algunos cambios en el código fuente del control personalizado. Por ejemplo, escriba una cadena adicional agregando esta línea de código al final del método RenderContents:

    writer.Write("<br />Testing how the App_Code directory works.");
    

    writer.Write("<br />Testing how the App_Code directory works.")
    
  5. Actualice la página TestSimpleDataBoundControl.aspx en el explorador.

    Verá que los cambios realizados en el control se reflejan en la página aunque no haya compilado el control.

Aunque el directorio App_Code permite probar el control sin compilarlo, si desea distribuirlo a otros desarrolladores como código de objeto, debe compilarlo. Por otra parte, el control no se puede agregar al cuadro de herramientas del diseñador visual a menos que se compile en un ensamblado.

Para compilar el control en un ensamblado

  1. Establezca la variable PATH del entorno de Windows del equipo para que incluya la ruta de acceso a la instalación de .NET Framework siguiendo estos pasos:

    1. En Windows, haga clic con el botón secundario del mouse (ratón) en Mi PC, seleccione Propiedades, haga clic en la ficha Avanzadas y, a continuación, en el botón Variables de entorno.

    2. En la lista Variables del sistema, haga doble clic en la variable Path.

    3. En el cuadro de texto Valor de variable, agregue un punto y coma (;) al final de los valores existentes en el cuadro de texto y, a continuación, escriba la ruta de acceso de su instalación de .NET Framework. Normalmente, .NET Framework está instalado en el directorio de instalación de Windows en \Microsoft.NET\Framework\númeroVersión.

    4. Haga clic en Aceptar para cerrar todos los cuadros de diálogo.

  2. Ejecute el comando siguiente desde el directorio App_Code que contiene los archivos de código fuente que creó previamente en este tutorial.

    Se generará un ensamblado denominado Samples.AspNet.CS.Controls.dll o Samples.AspNet.VB.Controls en el directorio App_Code.

    csc /t:library /out:Samples.AspNet.CS.Controls.dll /r:System.dll /r:System.Web.dll *.cs
    

    vbc /t:library /out:Samples.AspNet.VB.Controls.dll /r:System.dll /r:System.Web.dll *.vb
    

    La opción del compilador /t:library indica al compilador que debe crear una biblioteca en lugar de un ensamblado ejecutable. La opción /out proporciona un nombre para el ensamblado y la opción /r muestra los ensamblados que están vinculados al ensamblado.

    NoteNota

    Para mantener el ejemplo independiente, este tutorial le pide que cree un ensamblado con un solo control. En general, las directrices de diseño de .NET Framework le recomiendan que no cree ensamblados que contengan sólo unas cuantas clases. Para facilitar la implementación, debe crear el menor número de ensamblados posible.

Utilizar TagPrefixAttribute para proporcionar una asignación de prefijo de etiqueta y espacio de nombres

Anteriormente se mostró cómo un desarrollador de páginas puede especificar un prefijo de etiqueta en la página o en el archivo Web.config. Al compilar un control, puede incluir si lo desea el atributo de nivel de ensamblado System.Web.UI.TagPrefixAttribute, que sugiere un prefijo de etiqueta predeterminado que un diseñador visual debe utilizar para el control. El atributo TagPrefixAttribute es útil porque proporciona un prefijo de etiqueta para que el diseñador visual pueda utilizarlo si no encuentra una asignación de prefijo de etiqueta en el archivo Web.config o en una directiva @ Register de la página. El prefijo de etiqueta se registra con la página la primera vez que se hace doble clic en el control en el cuadro de herramientas o cuando el control se arrastra del cuadro de herramientas a la página.

Si decide usar el atributo TagPrefixAttribute, puede especificarlo en un archivo independiente que se compila con los controles. Por convención, el archivo se denomina AssemblyInfo.extensiónLenguaje, por ejemplo AssemblyInfo.cs o AssemblyInfo.vb. En el procedimiento siguiente se describe cómo especificar los metadatos de TagPrefixAttribute.

NoteNota

Si no especifica el atributo TagPrefixAttribute en el ensamblado del control y el desarrollador de páginas no especifica la asignación de prefijo de etiqueta y espacio de nombres en la página o en el archivo Web.config, el diseñador visual podría crear un prefijo de etiqueta predeterminado. Por ejemplo, Visual Studio 2005 creará su propia etiqueta (como cc1) para el control cuando éste se arrastre desde el cuadro de herramientas.

Para agregar una asignación de prefijo de etiqueta mediante TagPrefixAttribute

  1. Cree un archivo denominado AssemblyInfo.cs o AssemblyInfo.vb en el directorio del código fuente y agregue el código siguiente al archivo.

    using System;
    using System.Web.UI;
    [assembly: TagPrefix("Samples.AspNet.CS.Controls", "aspSample")]
    

    Imports System
    Imports System.Web.UI
    <Assembly: TagPrefix("Samples.AspNet.VB.Controls", "aspSample")> 
    

    El atributo de prefijo de etiqueta crea una asignación entre el espacio de nombres Samples.AspNet.CS.Controls o Samples.AspNet.VB.Controls y el prefijo aspSample.

  2. Vuelva a compilar todos los archivos de código fuente utilizando el comando de compilación que empleó anteriormente (con o sin el recurso incrustado).

Para probar la versión compilada del control personalizado es necesario que las páginas del sitio Web puedan tener acceso al ensamblado del control.

Para hacer que el sitio Web tenga acceso al ensamblado del control

  1. Cree un directorio Bin bajo la raíz del sitio Web si aún no existe.

  2. Arrastre (mueva) el ensamblado del control (Samples.AspNet.CS.Controls.dll o Samples.AspNet.VB.Controls.dll) del directorio App_Code hasta el directorio Bin.

  3. Mueva el archivo de código fuente del control desde el directorio App_Code a otro directorio del sitio Web.

    Si no mueve los archivos de código fuente fuera del directorio App_Code, el tipo del control existirá tanto en el ensamblado compilado como en el ensamblado generado dinámicamente creado por ASP.NET. Esto creará una referencia ambigua al cargar el control y las páginas en las que se utilice dicho control producirán un error de compilador.

El ensamblado que ha creado en este tutorial es un ensamblado privado porque debe estar colocado en un directorio Bin del sitio Web ASP.NET para permitir que las páginas del sitio Web utilicen el control. No es posible tener acceso al ensamblado desde otras aplicaciones a menos que también se instale una copia con dichas aplicaciones. Si crea controles para aplicaciones de alojamiento Web compartidas, normalmente los empaquetará en un ensamblado privado. No obstante, si crea controles para su uso en un entorno de alojamiento dedicado o crea un conjunto de controles que un ISP pone a disposición de todos sus clientes, podría necesitar empaquetar los controles en un ensamblado compartido (con nombre seguro) que esté instalado en la Caché de ensamblados global. Para obtener más información, vea Trabajar con ensamblados y la Caché de ensamblados global.

A continuación, debe modificar la asignación del prefijo de etiqueta que ha creado en el archivo Web.config para especificar el nombre de ensamblado del control.

Para modificar la asignación de prefijo de etiqueta en el archivo Web.config

  • Edite el archivo Web.config para agregar un atributo assembly al elemento <add tagPrefix=nombre>:

    <controls>
      <add tagPrefix="aspSample"
        namespace="Samples.AspNet.CS.Controls" 
        assembly="Samples.AspNet.CS.Controls">
      </add>
    </controls>
    

    <controls>
      <add tagPrefix="aspSample"   
        namespace="Samples.AspNet.VB.Controls" 
        assembly="Samples.AspNet.VB.Controls">
      </add>
    </controls>
    

El atributo assembly especifica el nombre del ensamblado en el que está el control. El elemento <add tagPrefix=nombre> asigna un prefijo de etiqueta a una combinación de espacio de nombres y ensamblado. Cuando ASP.NET genera dinámicamente el ensamblado a partir de los archivos de código fuente del directorio App_Code, el atributo assembly no es necesario. Cuando no se utiliza el atributo assembly, ASP.NET carga el tipo del control del ensamblado generado dinámicamente desde el directorio App_Code.

Ahora puede probar el control mientras lo ve en una página.

Para ver la página que utiliza el control personalizado

  • Muestre la página TestSimpleDataBoundControl.aspx en el explorador escribiendo la dirección URL siguiente en la barra de direcciones:

    http://localhost/ServerControlsTest/TestSimpleDataBoundControl.aspx
    

Si utiliza el control en un diseñador visual como Visual Studio 2005, podrá agregar el control al cuadro de herramientas, arrastrarlo del cuadro de herramientas a la superficie de diseño y tener acceso a sus propiedades y eventos en el examinador de propiedades. Además, en Visual Studio 2005, el control es totalmente compatible con IntelliSense en la vista de código fuente del diseñador de páginas y en el editor de código.

Este control de servidor simple enlazado a datos personalizado ilustra los pasos fundamentales que se utilizan para crear un control personalizado que proporcione al programador de páginas una manera estándar de enlazarlo a un origen de datos externo. Puede utilizarlo como punto de partida para explorar el modo en que Visual Studio puede ayudarle a crear controles de servidor personalizados más complejos. Para una exploración más a fondo, pruebe estas sugerencias:

Adiciones de comunidad

AGREGAR
Mostrar:
© 2015 Microsoft