ASCX - Creación de Controles de Usuario

Una buena práctica, y en mi opinión necesaria para cualquier desarrollo Web, es plantearse qué secciones de las páginas de la aplicación se mostrarán en varias páginas. Estas secciones serán susceptibles de desarrollarse como controles de usuario (User Controls .NET).

Así, podríamos definir (a alto nivel) un control de usuario como una sección de una página que se repite en varias páginas. El hecho de crear un control de usuario nos evitará hacer Copy-Paste (tanto de la parte de presentación como del codebehind del control) de esta sección a lo largo de toda nuestra aplicación, además, a la hora de cambiar algo dentro de esta sección de la página, esta se encuentra en un solo punto y no en varias páginas de nuestra solución.

Para añadir un control de usuario a nuestra sitio Web, botón derecho sobre nuestro proyecto -> Agregar Nuevo Elemento > Control de Usuario Web.

 

En función del número de controles de usuario que preveamos que vamos a precisar convendrá pensar si debemos distribuirlos en carpetas dentro de nuestra solución. Yo normalmente creo una carpeta de "Controles" dentro de mi solución, donde voy almacenando mis controles de usuario.

Bien, ya tenemos nuestro control de usuario en nuestra solución, aquí puedes encontrar el ejemplo de una aplicación en que utilizo un control de usuario y será en esta solución en la que me base de aquí en adelante (en esta solución no he creado ninguna carpeta de controles ya que sólo tengo un control). Este control se corresponde con el menú de mi aplicación y, por tanto, se encontrará en todas las páginas y por ello está incluido en la página master de la solución. El código de mi ascx es el siguiente:

 
 

<%@ Control Language="C#" AutoEventWireup="true" CodeBehind="LoginControl.ascx.cs" Inherits="AutenticacionFormulario.LoginControl" %> <asp:HyperLink ID="HyperLink1" runat="server" Text="Inicio" NavigateUrl="~/Default.aspx" /> | <asp:HyperLink ID="HyperLink2" runat="server" Text="Administracion" NavigateUrl="~/Admin/Admin.aspx" /> | <asp:HyperLink ID="HyperLink3" runat="server" Text="Usuario" NavigateUrl="~/User/User.aspx" /> | <asp:HyperLink ID="hyp1" runat="server" Text="Pagina segura" NavigateUrl="~/Secure/Administracion.aspx"/> | <asp:LoginView ID="lv1" runat="server"> <AnonymousTemplate> Bienvenido, invitado </AnonymousTemplate> <LoggedInTemplate> Bienvenido <asp:LoginName runat="server" ID="ln1" ForeColor="Green" Font-Bold="true" />, </LoggedInTemplate> </asp:LoginView> <asp:LoginStatus runat="server" id="ls1" />

 
 

Cómo puedes ver un Control de Usuario se codifica exactamente igual que una página ASPX.

Para utilizar un Control de Usuario en una de tus páginas únicamente tendrás que arrastrarlo desde el "Explorador de Soluciones" hasta la página (esta debe estar abierta y en modo diseño). Esta acción generará lo siguiente en la página donde incluyes el control de usuario:

 
 

- Registro del control de usuario dentro de la página:

 
 

<%@ Register src="LoginControl.ascx" tagname="LoginControl" tagprefix="uc1" %>

 
 

- Inclusión del control de usuario en la página:

 
 

<uc1:LoginControl ID="LoginControl1" runat="server" />

 
 

Esto es todo no olvides pensar en crear controles de usuario, te facilitarán tanto el desarrollo como el mantenimiento de tus aplicaciones.