Primero, analicemos algunas situaciones que comúnmente se dan cuando desarrollamos apliaciones web:
+A menudo, las aplicaciones son usadas por personas que tienen roles… osea, algunos tienen más privilegios que otros… esto significa que no todos pueden borrar, editar o ver toda la información.
+Dependiendo del rol o derechos que tenga cierto usuario, es probable que el menú que pueda usar no es el mismo que usarán los demás… a veces usarán un menú de usuario, otras veces el menú de Administración… y otras veces no podrán acceder a ciertas zonas.
+La estructura de las páginas web casi siempre será la misma: una cabecera, un pie de página, un menú a la derecha o un menú inmediatamente después de la cabecera… el contenido va a la derecha o al centro, o el menú a la derecha y el contenido a la derecha, etc… casi siempre es así.
Entonces, es cuando vemos la tremenda utilidad que tiene una master page, pues nos prmite precisamente crear una sola estructura y añadir/quitar contenido, según corresponda… y si hay que modificar algo, se modifica la master page y fuahhh!!!, todo se actualiza.
Luego que ya hemos acordado algunas verdades casi indiscutibles, y como hemos dicho que la mayoría de veces el contenido es el mismo, pero que en algunas páginas no queremos cierto contenido… vamos a ver cómo quitamos ese contenido.
Lo que vamos a hacer es sobreescribir el contenido de las mater pages… para en su lugar poner nuevo contenido, y dice así:
1.- Abran Visual Studio y elijan Crear… Proyecto, elijan Aplicación web ASP.NET
2.- Añadan una master page a su proyecto, llámenla site1.master y agreguen la sgte estructura dentro del elemento form:
<div style="width:100%;height: 100px;float:left">
<asp:ContentPlaceHolder ID="cabecera_va_aqui" runat="server">
<h1>Cabecera va aquí</h1>
</asp:ContentPlaceHolder>
</div>
<div style="width: 30%;height: 500px;float:left">
<asp:ContentPlaceHolder ID="menu_izquierda_va_aqui" runat="server">
<h1>un menú por defecto va aquí</h1>
</asp:ContentPlaceHolder>
</div>
<div style="width: 65%;height: 500px; float:right">
<asp:ContentPlaceHolder ID="cuerpo_va_aqui" runat="server">
</asp:ContentPlaceHolder>
</div>
<div style="width:100%;height: 50px;float:left">
<asp:ContentPlaceHolder ID="pie_va_aqui" runat="server">
<h1>Pie de pagina va aquí</h1>
</asp:ContentPlaceHolder>
</div>
Observen que a la master page le he creado secciones para cabecera, menu izquierdo, cuerpo y pie de pagina… y además de esto, ya le he agregado contenido a la cabecera, al menu izquierdo y al pie de página.
3.- Agreguen un nuevo elemento a su proyecto, agreguen un Formulario de contenido web, llámenlo WebForm1.aspx… les ofrecerá la opción de elegir una master page, elijan site1.master.
Ahora analicemos el código aspx de la página generada:
<asp:Content ID="Content1" ContentPlaceHolderID="cabecera_va_aqui" runat="server">
</asp:Content>
<asp:Content ID="Content2" ContentPlaceHolderID="menu_izquierda_va_aqui" runat="server">
</asp:Content>
<asp:Content ID="Content3" ContentPlaceHolderID="cuerpo_va_aqui" runat="server">
</asp:Content>
<asp:Content ID="Content4" ContentPlaceHolderID="pie_va_aqui" runat="server">
</asp:Content>
Se han creado las zonas para agregar contenido en la página… pero antes que nada, presionen F5 para ver la página WebForm1.aspx en acción… qué ven en la página? nada verdad? eso es porque no hemos agregado nada en las zonas Content de la página…
Professsor, professor, pero yo quiero ver la cabecera que puse en mi master page, y mi menú, y mi pie de página…
Ahhhhh, para eso debes borrar los Content que ya no quieres sobreescribir, deberías borrar lo tachado:
</asp:Content>
<asp:Content ID="Content2" ContentPlaceHolderID="menu_izquierda_va_aqui" runat="server">
</asp:Content>
<asp:Content ID="Content3" ContentPlaceHolderID="cuerpo_va_aqui" runat="server">
</asp:Content>
</asp:Content>
Y ahora ejecuta nuevamente la página y mira el cambio.
Excelente no es cierto?
Ahora, si quisieras sobreescribir el menú de la izquierda por otro menú –digamos de administrador- , sólo tienes que insertar tu nuevo menú en el Content respectivo, dentro de la página de contenido:
<asp:Content ID="Content2" ContentPlaceHolderID="menu_izquierda_va_aqui" runat="server">
El nuevo menú iría aquí……………………………
</asp:Content>
Esta técnica de poner algún contenido dentro de un contentplaceholder en la master page se usa sobre todo cuando hay algún contenido que se va a mantener en la mayoría de páginas, pero que en algunas irá otro contenido… y como has visto, es posible sobreescribirlas.
Y si hay algún contenido que nunca vas a sobreescribir, pues no es necesario que en la master page vaya dentro de un contentplaceholder.
Y eso es todo ;)
No hay comentarios.:
Publicar un comentario