Setting Focus in Application Pages

Iron Speed Designer applications have functionality to set focus to a certain control on initial page load, maintain it after the page’s postback and set the focus to a new added row in editable tables.  

Important: if you use .NET Framework 3.5 the set focus functionality requires Service Pack1 to be installed to operate properly.

Every page calls two functions on every load (initial and postback): LoadFocusScripts and SetFocusOnLoad.  They are declared overridable (virtual) and can be overridden on any page.  Both are located in:

..\<APP NAME>\Shared\BaseApplicationPage.cs (.vb)

Both are called in the Section 1 of page’s code behind file, e.g.:

..\<APP NAME>\Customers\ShowCustomersTable.aspx.cs (.vb)

LoadFocusScripts adds a handler for the “onfocus” client-side event to every focusable control.  This handler sets the ID of the element to a hidden input element, __LASTFOCUS, which is used by the script loaded by the SetFocusOnLoad function.  Modify this function if you need to exclude or add certain control types from the list of focusable elements. LoadFocusScripts is also called on the table repeater control load to set handlers for controls in the repeater.

SetFocusOnLoad loads a script containing two parts.  The first part is executed on initial load and the second on postback.  You may pass control to this method to set focus on the initial load to this specific control. This script in turn calls the setFocus method defined in:

..\<APP NAME>\SetFocus.js

By default, pages set the focus to the first focusable element on the page.  Focusable elements are typically text boxes or dropdown lists.  However, your application will not set the focus to the FCKeditor control because of the asynchronous behavior of this control.

An application sets focus only to elements inside the page content area based on the default content placeholder names used by your application’s master page.  This check is based on default content placeholder names.  If you change the name of a content placeholder in the Application Generation Options dialog, you should modify the ApplicationWebForm.js file located in your application’s root folder, e.g.:

..\<APP NAME>\ ApplicationWebForm.js

By modifying this file, you can:

Instructions for these operations are outlined in ApplicationWebForm.js.

Special code is created to set focus to the first focusable element of a newly added row in editable table panels.  For web applications, this functionality is located in the SetFocusToAddedRow method, which is called from the DataBind method in the table control class in the Controls.cs (.vb) file is located in:

..\<APP NAME>\Customers\ShowCustomersTable.Controls.cs (.vb)

For web sites, the SetFocusToAddedRow is located in:

..\<APP NAME>\App_Code\Customers\ShowCustomersTable.Controls.cs (.vb)

Instructions for this are also in ApplicationWebForm.js.

See Also

Customizing Web Page Behavior

Using Client-Side JavaScript in Application Pages

Capturing the Enter Key in Application Pages

Setting Focus in Application Pages