All Telerik .NET tools and Kendo UI JavaScript components in one package. Now enhanced with:
New to Telerik UI for ASP.NET AJAX? Download free 30-day trial
Welcome back, Mr. John Smith 11/5/2024
Phone: 1.887.3671.23 E-mail: john@bravo.com Address: 64 Bay Str, Melville
Deal with gossip as quickly as you can. Most gossipers don't know what they're talking about anyway, so it shouldn't matter all that much to your day or reputation.
More horoscopes! Check your Daily Single's LoveScopes, Daily Couple's LoveScopes, Daily CareerScopes, Weekly RomanticScopes, Monthly FitnessScopes, more...
Today's Free Reading: When you demand a quick "Yes" or "No" answer and simple explanation, consult your Instant Answer Tarot.
Telerik RadDock is a versatile component for page personalization. It represents a content placeholder, which can be moved, docked/undocked, resized, pinned, minimized and so on. The customized page layout can be saved to a file or database and reloaded when needed, which is a typical requirement for portals and extranets.
This example demonstrates an implementation of a portal using RadDock. You can personalize the layout by reordering the different items in the three columns using drag-and-drop. The layout can be saved and later when the user comes back to this page the saved state is restored.
<%@ Page Language="c#" AutoEventWireup="true" %> <%@ Register Src="~/Dock/Common/TelerikNewsCS.ascx" TagName="News" TagPrefix="uc2" %> <%@ Register Src="~/Dock/Common/TelerikBlogsCS.ascx" TagName="Blogs" TagPrefix="uc2" %> <%@ Register Src="~/Dock/Common/HoroscopesCS.ascx" TagName="Horoscopes" TagPrefix="uc2" %> <%@ Register Src="~/Dock/Common/WeatherCS.ascx" TagName="Weather" TagPrefix="uc2" %> <%@ Register Src="~/Dock/Common/ExchangeRatesCS.ascx" TagName="ExchangeRates" TagPrefix="uc2" %> <!DOCTYPE html> <html xmlns='http://www.w3.org/1999/xhtml'> <head runat="server"> <title>Telerik ASP.NET Example</title> <link href="styles.css" rel="stylesheet" /> </head> <body> <form id="form1" runat="server"> <telerik:RadScriptManager runat="server" ID="RadScriptManager1" /> <telerik:RadSkinManager ID="RadSkinManager1" runat="server" ShowChooser="true" /> <telerik:RadFormDecorator RenderMode="Lightweight" ID="DemoFormDecorator" runat="server" DecoratedControls="All" Skin="Metro" ControlsToSkip="Zone" DecorationZoneID="decorate" EnableRoundedCorners="false" /> <div class="demo-container size-custom" id="decorate"> <telerik:RadDockLayout runat="server" ID="RadDockLayout1" EnableEmbeddedSkins="false" Skin="None"> <div> <table cellspacing="0" cellpadding="0"> <tr> <td colspan="3" style="background: url(images/headerBg.gif) repeat-x;"> <img src="images/headerLeft.gif" alt="" /> </td> </tr> <tr> <td style="width: 222px;"> <telerik:RadDockZone runat="server" ID="RadDockZone1" Orientation="vertical" Style="border: 0; width: 220px;"> <telerik:RadDock RenderMode="Lightweight" runat="server" ID="UserInfo" Title="My Portal" Width="220px" EnableAnimation="true" CssClass="user-info"> <ContentTemplate> <p class="innerWrp"> Welcome back,<br /> Mr. John Smith<br /> <%= DateTime.Now.ToShortDateString() %> </p> </ContentTemplate> </telerik:RadDock> <telerik:RadDock RenderMode="Lightweight" runat="server" ID="MyContacts" Title="My Contacts" Width="220px" CssClass="my-contacts" EnableAnimation="true"> <ContentTemplate> <p class="innerWrp"> Phone: 1.887.3671.23<br /> E-mail: john@bravo.com<br /> Address: 64 Bay Str, Melville </p> </ContentTemplate> </telerik:RadDock> <telerik:RadDock RenderMode="Lightweight" runat="server" ID="Horoscopes" Title="Horoscope" Width="220px" EnableAnimation="true" CssClass="horoscope"> <ContentTemplate> <div class="innerWrp"> <uc2:Horoscopes ID="HoroscopesControl" runat="server"></uc2:Horoscopes> </div> </ContentTemplate> </telerik:RadDock> </telerik:RadDockZone> </td> <td style="width: 222px;"> <telerik:RadDockZone runat="server" ID="RadDockZone2" Orientation="vertical" Style="border: 0px; width: 220px;"> <telerik:RadDock RenderMode="Lightweight" runat="server" ID="Currency" Title="Exchange Rates" Width="220px" CssClass="exchange-rates" EnableAnimation="true"> <ContentTemplate> <div class="innerWrp"> <uc2:ExchangeRates ID="CurrencyControl" runat="server"></uc2:ExchangeRates> </div> </ContentTemplate> </telerik:RadDock> <telerik:RadDock RenderMode="Lightweight" runat="server" ID="Weather" Title="Weather" Width="220px" EnableAnimation="true" CssClass="weather"> <ContentTemplate> <div class="innerWrp"> <uc2:Weather ID="WeatherControl" runat="server"></uc2:Weather> </div> </ContentTemplate> </telerik:RadDock> </telerik:RadDockZone> </td> <td style="width: 222px;"> <telerik:RadDockZone runat="server" ID="RadDockZone3" Orientation="vertical" Style="border: 0px; width: 220px;"> <telerik:RadDock RenderMode="Lightweight" runat="server" ID="TelerikBlogs" Title="Telerik Blogs" Width="220px" EnableAnimation="true" CssClass="telerik-blogs"> <ContentTemplate> <div class="innerWrp"> <uc2:Blogs ID="BlogsControl" runat="server"></uc2:Blogs> </div> </ContentTemplate> </telerik:RadDock> <telerik:RadDock RenderMode="Lightweight" runat="server" ID="News" Title="Telerik News" Width="220px" EnableAnimation="true" CssClass="telerik-news"> <ContentTemplate> <div class="innerWrp"> <uc2:News ID="NewsControl" runat="server"></uc2:News> </div> </ContentTemplate> </telerik:RadDock> </telerik:RadDockZone> </td> </tr> </table> </div> </telerik:RadDockLayout> </div> </form> </body> </html>