Buscar..


Introducción

Los controles de usuario son contenedores que pueden rellenarse con el marcado HTML y los controles de servidor con código subyacente de la misma manera que la página ASPX. Están tratadas como unidades más pequeñas reutilizables de una página, por lo que no se puede ejecutar como páginas independientes y no deben tener elementos HTML, o la forma del cuerpo HTML en ellos.

Introducción de controles de usuario

Los controles de usuario se hacen para la reutilización en las páginas ASP.NET, similar a las páginas maestras. En lugar de compartir el diseño de la página base, los controles del usuario comparten un grupo de controles de servidor integrados HTML / ASP.NET o un diseño de formulario específico, por ejemplo, envío de comentarios o notas de invitados.

Un control de usuario puede contener controles HTML y controles de servidor ASP.NET, incluidos los scripts del lado del cliente.

Los controles de usuario generalmente incluyen Control directiva de Control sobre su definición:

<%@ Control Language="C#" AutoEventWireup="True" CodeFile="UserControl.ascx.cs" %>

Al igual que la página ASPX, los controles de usuario consisten en marcas que se pueden asociar con un código detrás del archivo para realizar ciertos eventos y tareas, por lo tanto, todas las etiquetas HTML disponibles en la página ASPX se pueden usar en los controles del usuario excepto <html> , <body> y <form> etiquetas.

Aquí hay un ejemplo para el marcado de control de usuario simple:

<%-- UserControl.ascx --%>
<%@ Control Language="C#" AutoEventWireup="True" CodeFile="UserControl.ascx.cs" %>
<div>
    <asp:Label ID="Label1" runat="server" />
    <br />
    <asp:Button ID="Button1" runat="server" Text="Click Here" OnClick="Button1_Click" />
</div>

Ejemplo de código detrás:

// UserControl.ascx.cs
public partial class UserControl : System.Web.UI.UserControl
{
    protected void Button1_Click(Object sender, EventArgs e)
    {
        Label1.Text = "Hello World!";
    }
}

Antes de insertar un control de usuario en la página ASPX, la directiva de Register debe declararse en la parte superior de la página que hace referencia al control de usuario con su URL de origen, nombre de etiqueta y prefijo de etiqueta.

<%@ Register Src="UserControl.ascx" TagName="UserControl" TagPrefix="uc" %>

Después, puede colocar el control de usuario dentro de la página ASPX como el control de servidor integrado de ASP.NET:

<uc:UserControl ID="UserControl1" runat="server" />

Creación de instancia de control de usuario mediante programación

Si desea crear una instancia de un control de usuario dentro del código ASPX detrás de la página, debe escribir la declaración de control de usuario en el evento Page_Load siguiente manera:

public partial class Default : System.Web.UI.Page
{
    protected void Page_Load(Object sender, EventArgs e)
    {
        Control control1 = LoadControl("UserControl.ascx");
        Page.Controls.Add(control1);
    }
}

Tenga en cuenta que el archivo ASCX de control del usuario ya debe estar creado al ejecutar el método LoadControl.

Otra forma conocida para declarar controles de usuario mediante programación es mediante PlaceHolder :

public partial class Default : System.Web.UI.Page
{
    public PlaceHolder Placeholder1;
    protected void Page_Load(Object sender, EventArgs e)
    {
        Control control1 = LoadControl("UserControl.ascx");
        Placeholder1.Controls.Add(control1);
    }
}

Dependiendo de su necesidad, PlaceHolder coloca los controles del usuario en un contenedor que almacena todos los controles del servidor agregados dinámicamente en la página, donde Page.Controls inserta directamente el control del usuario dentro de la página, lo que es más preferido para representar controles literales HTML.

Agregar propiedades personalizadas para el control de usuario

Al igual que los controles de servidor incorporados estándar de ASP.NET, los controles de usuario pueden tener propiedades (atributos) en su etiqueta de definición. Supongamos que desea agregar un efecto de color en el archivo UserControl.ascx como este:

<uc:UserControl ID="UserControl1" runat="server" Color="blue" />

En este punto, los atributos / propiedades personalizados para los controles de usuario se pueden establecer declarando las propiedades dentro del código de control del usuario detrás de:

private String _color;
public String Color
{
    get
    {
        return _color;
    }
    set
    {
        _color = value;
    }
}

Además, si desea establecer un valor predeterminado en una propiedad de control de usuario, asigne el valor predeterminado dentro del método constructor del control de usuario.

public UserControl()
{
    _color = "red";
}

Luego, la marca de control del usuario debe modificarse para agregar el atributo de color como el siguiente ejemplo:

<%@ Control Language="C#" AutoEventWireup="True" CodeFile="UserControl.ascx.cs" %>
<div>
    <span style="color:<%= Color %>"><asp:Label ID="Label1" runat="server" /></span>
    <br />
    <asp:Button ID="Button1" runat="server" Text="Click Here" OnClick="Button1_Click" />
</div>


Modified text is an extract of the original Stack Overflow Documentation
Licenciado bajo CC BY-SA 3.0
No afiliado a Stack Overflow