Custom Field RequiredFieldValidator Highlighting

There was a great post here by Yoann. B that provided a great example in C# for highlighting RequireFieldValidators: http://blog.sb2.fr/post/2008/12/12/Custom-TextBox-Required-Field-Validator.aspx

I expanded the code to allow for border widths, and converted the code to VB.

[codesyntax lang=”vbnet”]

Imports Microsoft.VisualBasic
Imports System
Imports System.Collections.Generic
Imports System.Linq
Imports System.Web
Imports System.Drawing
Imports System.Web.UI.WebControls
Imports System.ComponentModel
Imports System.Web.UI
Imports System.Text

Namespace Validators
	<DefaultProperty("Text")> _
	 <ToolboxData("<{0}:TextBoxRequiredFieldValidator runat=server></{0}:TextBoxRequiredFieldValidator>")> _
	 Public Class TextBoxRequiredFieldValidator
		Inherits RequiredFieldValidator
#Region "Public Properties"

		Public Property ErrorBackgroundColor() As Color
			Get
				If ViewState("ErrorBackgroundColor") Is Nothing Then
					Return Color.LightGray
				Else
					Return DirectCast(ViewState("ErrorBackgroundColor"), Color)
				End If
			End Get
			Set(ByVal value As Color)
				ViewState("ErrorBackgroundColor") = value
			End Set
		End Property
		Public Property ErrorBorderColor() As Color
			Get
				If ViewState("ErrorBorderColor") Is Nothing Then
					Return Color.Red
				Else
					Return DirectCast(ViewState("ErrorBorderColor"), Color)
				End If
			End Get
			Set(ByVal value As Color)
				ViewState("ErrorBorderColor") = value
			End Set
		End Property
		Public Property ErrorBorderWidth() As Unit
			Get
				If ViewState("ErrorBorderWidth") Is Nothing Then
					Return Unit.Pixel(1)
				Else
					Return DirectCast(ViewState("ErrorBorderWidth"), Unit)
				End If
			End Get
			Set(ByVal value As Unit)
				ViewState("ErrorBorderWidth") = value
			End Set
		End Property

#End Region

#Region "Private Properties"

		Private Property OriginalBackgroundColor() As Color
			Get
				If ViewState("OriginalBackgroundColor") Is Nothing Then
					Return Color.LightGray
				Else
					Return DirectCast(ViewState("OriginalBackgroundColor"), Color)
				End If
			End Get
			Set(ByVal value As Color)
				ViewState("OriginalBackgroundColor") = value
			End Set
		End Property
		Private Property OriginalBorderColor() As Color
			Get
				If ViewState("OriginalBorderColor") Is Nothing Then
					Return Color.Red
				Else
					Return DirectCast(ViewState("OriginalBorderColor"), Color)
				End If
			End Get
			Set(ByVal value As Color)
				ViewState("OriginalBorderColor") = value
			End Set
		End Property
		Private Property TextBoxToValidate() As TextBox
			Get
				Return m_TextBoxToValidate
			End Get
			Set(ByVal value As TextBox)
				m_TextBoxToValidate = value
			End Set
		End Property
		Private m_TextBoxToValidate As TextBox

#End Region

#Region "Protected Overrides Methods"

		Protected Overrides Sub OnInit(ByVal e As EventArgs)
			MyBase.OnInit(e)

			Dim txt As TextBox = TryCast(Me.FindControl(MyBase.ControlToValidate), TextBox)
			If txt IsNot Nothing Then
				TextBoxToValidate = txt

				OriginalBackgroundColor = TextBoxToValidate.BackColor
				OriginalBorderColor = TextBoxToValidate.BorderColor
			End If
		End Sub
		Protected Overrides Function EvaluateIsValid() As Boolean
			Dim bIsValid As [Boolean] = False
			Dim Value As [String] = MyBase.GetControlValidationValue(MyBase.ControlToValidate)
			If [String].IsNullOrEmpty(Value) Then
				If TextBoxToValidate IsNot Nothing Then
					TextBoxToValidate.BackColor = ErrorBackgroundColor
					TextBoxToValidate.BorderColor = ErrorBorderColor
					bIsValid = False
				End If
			Else
				If TextBoxToValidate IsNot Nothing Then
					TextBoxToValidate.BackColor = OriginalBackgroundColor
					TextBoxToValidate.BorderColor = OriginalBorderColor
					bIsValid = True
				End If
			End If
			Return bIsValid
		End Function
		Protected Overrides Sub OnPreRender(ByVal e As EventArgs)
			MyBase.OnPreRender(e)

			If Page.ClientScript.IsClientScriptBlockRegistered("ValidationScript") Then
				Return
			End If

			Dim ControlToValidateClientId As [String] = MyBase.GetControlRenderID(MyBase.ControlToValidate)

			Dim Script As New StringBuilder()
			Script.Append("<script language=""javascript"">")

			Script.Append("function RequiredFieldValidatorEvaluateIsValid(val) {")
			Script.Append("    var value = ValidatorGetValue(val.controltovalidate);")
			Script.Append("if (value == '') {")

			Script.Append("document.getElementById(val.controltovalidate).style.backgroundColor = '$$BGCOLOR$$';")
			Script.Replace("$$BGCOLOR$$", ColorTranslator.ToHtml(ErrorBackgroundColor))

			Script.Append("document.getElementById(val.controltovalidate).style.borderColor = '$$BRCOLOR$$';")
			Script.Replace("$$BRCOLOR$$", ColorTranslator.ToHtml(ErrorBorderColor))

			Script.Append("document.getElementById(val.controltovalidate).style.borderWidth = '$$BRWIDTH$$';")
			Script.Replace("$$BRWIDTH$$", ErrorBorderWidth.ToString)

			Script.Append("return false;    }")
			Script.Append("else {")

			Script.Append("document.getElementById(val.controltovalidate).style.backgroundColor = '$$ORIG_BGCOLOR$$';")
			Script.Replace("$$ORIG_BGCOLOR$$", ColorTranslator.ToHtml(OriginalBackgroundColor))

			Script.Append("document.getElementById(val.controltovalidate).style.borderColor = '$$ORIG_BRCOLOR$$';")
			Script.Replace("$$ORIG_BRCOLOR$$", ColorTranslator.ToHtml(OriginalBorderColor))

			Script.Append("return true;} }")
			Script.Append("</script>")

			Page.ClientScript.RegisterClientScriptBlock(Me.[GetType](), "ValidationScript", Script.ToString())
		End Sub

#End Region
	End Class
End Namespace

[/codesyntax]

Here is the usage of the Overload.

You must register the custom control on the page, include the “Assembly” attribute if from outside your project.

[codesyntax lang=”vbnet”]

<%@ Register TagPrefix="MyCtrl" Namespace="Validators" %>

[/codesyntax]

The control is used just like the regular required field validator.

[codesyntax lang=”vbnet”]

<myctrl:textboxrequiredfieldvalidator ID="valid1" runat="server" ControlToValidate="TextBox1" ErrorBackgroundColor="Red" ErrorBorderColor="Red" ErrorBorderWidth="2" SetFocusOnError="true"></myctrl:textboxrequiredfieldvalidator>

[/codesyntax]