Thursday, June 13, 2013
Customizing the Page Title

Every page in a generated web app has a title, displayed directly under the path. To change the page path in the navigation menu, use drag & drop techniques to move the page to the desired location.

Default Title text displayed under the navigation menu.

Let’s change the title of the Customers page.

Specifying a Page Title

Start the Project Designer. In the Project Explorer, double-click on Customers page node.

Customers page node selected in the Project Explorer.

Change the title:

Property New Value
Title Customer List

Press OK to save. On the toolbar, press Browse. Notice that the Customers page title now says “Customer List”.

The new Title text is now applied.

It may be necessary to update the text of the header dynamically. Create a custom user control for complex page title customization.

Placing a Custom User Control in the Title

In the Project Explorer, right-click on Customers / page container node and press New Control.

Creating a new control in the 'page' container of Customers page.

Next to the User Control lookup, click on the New User Control icon.

Creating a new user control.

Assign a user control name:

Property Value
Name CustomerTitle

Press OK to create the user control. Press OK to save the properties of the control instance and have it added to the Customers / page container.

Right-click on the new control Customers / page / control1 – CustomerTitle, and press Rename.

Renaming the 'control1' user control on Customers page.

Change the name to “title” and press Enter key to save changes.

The user control has been renamed to 'title'.

On the toolbar, press Browse. Notice that the title text has been replaced with the custom user control.

The title text has been replaced with a custom user control.

Right-click Customers / page / title – CustomerTitle and press Edit in Visual Studio option in the context menu to start customization.