Si bien es cierto que asp.net contiene muchos controles que nos facilitan la vida, en muchas ocasiones requerimos funcionalidades adicionales. Una de las opciones es recurrir a la creación de controles personalizados.

Este será el Primero de varios post que dedicare a mostrar como crear algunos controles personalizados utilizando elementos sumamente sencillos y faciles de entender. Para ello utilizaremos unicamente los regularexpressionvalidator y unas cuantas expresiones regulares.

Para este ejemplo extenderemos la funcionalidad de un textbox para que valide números de tarjetas de crédito. Nuestro textbox deberá verificar que existan 16 números, en grupos de 4, separados por un -

Entonces, creamos un nuevo proyecto de tipo control de servidor asp.net

Primeramente importamos los espacios de nombres

Imports System.ComponentModel
Imports System.Web
Imports System.Web.UI.WebControls
Imports System.Web.UI

 

Segundo creamos nuestra clase

Public Class TextboxCreditCardNumber

end class

Ahora,  le decimos a nuestra clase que vamos a heredar de textbox

Public Class TextboxCreditCardNumber

          Inherits TextBox

end class

Una vez que tenemos esto, nuestra base de programación esta lista, asi que vamos a codificar nuestra nueva funcionalidad

Declaramos nuestra variables y una propiedad pública que contendrá el mensaje de error que debe ser devuelto al usuario, esta será publica para que pueda ser personalizada.

 

 Private req As New RegularExpressionValidator
    Private mstrmensaje As String = "Número de Tarjeta Invalido"

    Public Property MensajeError() As String
        Get
            Return mstrmensaje
        End Get
        Set(ByVal value As String)
            mstrmensaje = value
        End Set
    End Property

 

Ahora definimos el metodo OnInit de nuestro control, en el cual asignaremos las propiedad e inicializaremos nuestras funciones

   Protected Overrides Sub OnInit(ByVal e As System.EventArgs)
        req.ControlToValidate = MyBase.ID
        req.ErrorMessage = mstrmensaje
        req.Display = ValidatorDisplay.Dynamic
        req.ValidationExpression = "^(\d{4}-){3}\d{4}$|^(\d{4} ){3}\d{4}$|^\d{16}$" 'Nuestra expresión regular encargada de verificar el numero de tarjeta ingresado
        Controls.Add(New LiteralControl(" "))
        Controls.Add(req)

        MyBase.OnInit(e)

    End Sub

 

Y por último, definimos el evento render (que es el encarado de dibujar nuestro control)

Protected Overrides Sub Render(ByVal writer As System.Web.UI.HtmlTextWriter)

        MyBase.Render(writer)
        req.RenderControl(writer)

    End Sub

 

Lo unico que nos queda ahora es compilar nuestra clase y añadir nuestro nuevo control al ToolBox de Controles para que pueda ser utilizado.