Here is an easy way to add highlight effects to a web form so the user can see which control has focus.
The idea uses a BasePage, a class that inherits from System.Web.UI.Page and provides basic functionality to a variety of pages with very little effort. In my case I have several base pages for different purposes, but the base of all of them is BasePage.vb.
In BasePage.vb I override the OnLoad page event:
Protected Overrides Sub OnLoad(ByVal e As System.EventArgs)
' add onfocus and onblur so the active control has a different appearance
Utilities.Helpers.SetInputControlsHighlight(Page, "highlight", True)
MyBase.OnLoad(e)
End Sub
That calls a SetInputControlsHighlight function that lives in a separate Utilities project, though you could put it directly in the base page if you preferred:
Public Shared Sub SetInputControlsHighlight(ByVal container As Control, _
ByVal ClassName As String, _
ByVal OnlyTextBoxes As Boolean)
For Each ctl As Control In container.Controls
If ((OnlyTextBoxes AndAlso TypeOf ctl Is TextBox) _
Or (Not OnlyTextBoxes _
AndAlso (TypeOf ctl Is TextBox _
Or TypeOf ctl Is DropDownList _
Or TypeOf ctl Is ListBox _
Or TypeOf ctl Is CheckBox _
Or TypeOf ctl Is RadioButton _
Or TypeOf ctl Is RadioButtonList _
Or TypeOf ctl Is CheckBoxList))) Then
Dim wctl As WebControl = CType(ctl, WebControl)
wctl.Attributes.Add("onfocus", String.Format("this.className = '{0}';", ClassName))
wctl.Attributes.Add("onblur", "this.className = '';")
Else
If (ctl.Controls.Count > 0) Then
SetInputControlsHighlight(ctl, ClassName, OnlyTextBoxes)
End If
End If
Next
End Sub
The function takes the root container as a parameter and applies the specified class, "highlight" in this case, to the controls inside it. The last parameter controls whether the style is applied to every input control on the form or only to TextBox controls.
When the user clicks into an input control it takes on a different color so it is obvious it has focus, and it reverts when focus is lost.
The original idea came from ASP.NET 2.0 Website Programming: Problem - Design - Solution by Marco Bellinaso. It is one of the best books I used in my career, and different from most: rather than a reference book, it walks through building a site from requirements and database design all the way through to deployment.