Dock Template Title Bar|UI Control for ASP.NET AJAX, C#, VB.NET

Dock Template Title Bar in ASP.NET

Home > How to > Dock TitleBar Templates

Dock Template Title Bar in ASP.NET

What is dock title bar? Dock title bar refers to the panel that is located at the top part of the PerDock control. And in general, the dock title bar consists of two elements, which are Title Text and the Commands.

In this online tutorial page, you will know how to customize the dock title bar using TitlebarTemplate in aspx web page. If you want to know how to customize the commands, you can go to the Dock Element Command for detailed information.

How to Set Dock Template Title Bar

In this section, coupled with detailed programming example, we will show you how to design a fully customized title bar template at runtime. The PerDock control also allows users to add other third party control, like the PerButton control, to the dock title bar template. Besides, you can also add some server-side events to the dock template title bar in response to the behavior that is performed by the end users.

Here we offer a programming example on how to set dock title bar template in aspx web page at runtime using UI Control for ASP.NET AJAX.

ASPX Code

<kettic:PerDock ID="PerDock1" runat="server" 
Width="450px" EnableAnimation="true"
EnableRoundedCorners="true" Resizable="true" 
DockMode="Docked" Text="Dock1">
                            <TitlebarTemplate>
                                <label>Dock Title</label>
                                <asp:TextBox runat="server" ID="textBox1" Width="200" Visible="true"></asp:TextBox>
                                <asp:LinkButton runat="server" Text="Click" ID="linkButton1" OnClick="linkButton1_Click"></asp:LinkButton> 
                                                           
                            </TitlebarTemplate>
                            
</kettic:PerDock>

C# Code

protected void linkButton1_Click(object sender, EventArgs e)
        {
            textBox1.BackColor = System.Drawing.Color.Red;
        }

Code explanation: in above programming example, we add another UI Control, the PerButton Control, to the dick title bar template. Besides, we also integrate a server-side event to newly added button. When the end user clicks on the button in the dock title bar, the background color of the dock title text box will be turned to be red.

And here we attach an image which represents the result of following dock title bar template designing application.

If you have met any problem in the dock title bar template designing process, please feel free to contact us via E-mail. Note: please make sure that your ASP.NET web project has installed .NET Framework 3.5 or later versions.

ASP.NET AJAX UI Controls

ASP.NET AJAX Chart UI Control ASP.NET AJAX Grid UI Control ASP.NET AJAX Barcode UI Control ASP.NET AJAX Button UI Control ASP.NET AJAX Calendar UI Control ASP.NET AJAX NavigationBar UI Control ASP.NET AJAX Captcha UI Control ASP.NET AJAX Color Editor UI Control ASP.NET AJAX ComboBox UI Control ASP.NET AJAX DataPager UI Control

ASP.NET AJAX Dock UI Control

Overview Getting Started

Element

Zones Commands

Templates

Client Prpgramming

Dock Event

Server Programming

Dock Event ASP.NET AJAX DropDownList UI Control ASP.NET AJAX DropDownTree UI Control ASP.NET AJAX HtmlEditor UI Control ASP.NET AJAX FileManager UI Control ASP.NET AJAX Filter UI Control ASP.NET AJAX Input UI Control ASP.NET AJAX ListBox UI Control ASP.NET AJAX ListView UI Control ASP.NET AJAX ToolBar UI Control ASP.NET AJAX TabControl UI Control ASP.NET AJAX Menu UI Control ASP.NET AJAX ToolTip UI Control