Compartir a través de

Funcionalidad de un control de servidor en el cliente

  • Artículo

En la programación para el Web, la funcionalidad del cliente se encuentra tradicionalmente en manos del programador de la página Web y no se encapsula en los componentes del servidor. ASP.NET parte de este paradigma y hace posible que los controles de servidor emitan secuencias de comandos para el cliente, lo que les permite combinar el procesamiento en el cliente con el procesamiento en el servidor.

El caso más simple de funcionalidad del cliente corresponde a un control de servidor Web que procesa un controlador de eventos para un evento del cliente a través de la propiedad Attributes del control. En el ejemplo siguiente se muestra un control (ClientClickButton) derivado del control de servidor Web System.Web.UI.WebControls.Button y se incluye un controlador para el evento Click del cliente.

Nota   El programador de una página puede proporcionar fácilmente controladores de eventos del cliente mediante la colección Attributes del control de servidor Web. La finalidad del ejemplo consiste en mostrar la forma en que el propio control puede encapsular esta funcionalidad. Para generar este ejemplo, vea las instrucciones de Ejemplos de controles de servidor.

using System;
using System.Web;
using System.Web.UI;
using System.Web.UI.WebControls;

namespace CustomControls
{
public class ClientClickButton : Button
  {
   protected override void AddAttributesToRender(HtmlTextWriter writer) 
      {
          
      base.AddAttributesToRender(writer);   
      writer.AddAttribute("onclick", "alert('Thanks');");
    }

  }
}
[Visual Basic]

Option Explicit
Option Strict

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

Namespace CustomControls
   Public Class ClientClickButton
      Inherits Button
      Protected Overrides Sub AddAttributesToRender(writer As HtmlTextWriter)
         MyBase.AddAttributesToRender(writer)
         writer.AddAttribute("onClick", "alert('Thanks');")
      End Sub
   End Class 
End Namespace

En la página siguiente se utiliza el control personalizado ClientClickButton. Para comprobar que el atributo onClick de ClientClickButton se procesa en el cliente, solicite la página en el explorador y vea el código fuente.

<%@ Register TagPrefix="Custom" Namespace="CustomControls" Assembly = "CustomControls" %>
<html>
   <body>         
      <form  runat=server>        
       This button handles a client-side click event.             
   <Custom:ClientClickButton Id = "Button" BackColor = "Red"  runat=server/> <br> <br>                           
      </form>              
   </body>           
</html>

En el ejemplo anterior se ilustra de forma muy sencilla la funcionalidad del cliente. ASP.NET permite que un control participe en situaciones más complejas en el cliente, entre las que se encuentran las siguientes:

  • Proporcionar una biblioteca de secuencias de comandos al cliente.
  • Emitir secuencias de comandos al comienzo o al final de una página.
  • Asegurar que un bloque de secuencia de comandos sólo aparezca una vez en una página (incluso cuando haya varias instancias del control en ella).
  • Permitir que un control asocie un controlador de eventos al evento correspondiente a enviar del formulario del cliente (si la página incluye un formulario).
  • Agregar el elemento del cliente procesado por un control a una variable de matriz declarada en el cliente.

Esta funcionalidad se consigue gracias a los métodos que expone la clase System.Web.UI.Page y los controles de servidor ASP.NET tienen acceso a ella a través de su propiedad Page. En la tabla siguiente se enumeran los métodos de la clase Page que proporcionan la funcionalidad en el cliente.

Método Descripción Cuándo se utiliza
Page.RegisterClientScriptBlock Permite a un control emitir un bloque de secuencia de comandos (que contiene una secuencia de comandos en línea o que especifica la ubicación de un archivo de comandos). El bloque de secuencia de comandos se procesa al comienzo de la página y se registra (con una clave) en ella de modo que sólo se emita una vez, incluso cuando haya varias instancias del control en la página.
Nota   Un bloque de secuencia de comandos emitido al comienzo de la página se denomina bloque de secuencia de comandos de cliente en una página ASP.NET.
Se usa cuando se desea incluir una biblioteca de secuencias de comandos o procesar un bloque de secuencia de comandos que contenga funciones generales (invocadas posteriormente en la página). En particular, las funciones invocadas durante la fase de procesamiento deben encontrarse al comienzo de la página.
Page.RegisterStartupScript Permite a un control emitir un bloque de secuencia de comandos (que contiene una secuencia de comandos en línea o que especifica la ubicación de un archivo de comandos). El bloque de secuencia de comandos se procesa al final de la página y se registra (con una clave) en ella de modo que sólo se emita una vez, incluso cuando haya varias instancias del control en la página.
Nota   Un bloque de secuencia de comandos emitido al final de la página se denomina bloque de secuencia de comandos de inicio en una página ASP.NET.
Se utiliza cuando se desea emitir una secuencia de comandos que invoque elementos de la página o que deba ejecutarse al inicio. Debido a que esta secuencia de comandos se emite al final de la página, se garantiza que los elementos a los que se refiera ya existirán antes de que se ejecute.
Page.RegisterArrayDeclaration Permite a un control agregarse a sí mismo a una variable de matriz en el cliente con un nombre especificado. El nombre de la matriz se registra en la página que la contiene (mediante una clave), de modo que en esa página sólo se procese una matriz con ese nombre en la secuencia de comandos del cliente. Se utiliza cuando se desea que el elemento procesado por el control pertenezca a una variable de matriz en la secuencia de comandos del cliente. La matriz permite agrupar los elementos del mismo tipo para facilitar a la secuencia de comandos del cliente el acceso a los mismos. Por ejemplo, los controles de validación se agregan a una matriz denominada Page_Validators.
Page.RegisterOnSubmitStatement Asocia un controlador de eventos al evento de envío del formulario en el cliente y lo registra (mediante una clave) en la página que lo contiene. El controlador se procesa como atributo onSubmit del elemento de formulario. El registro del controlador asegura que cuando haya varias instancias del control no se emitan múltiples controladores. Se utiliza cuando se desea invocar un controlador en el cliente en el momento de enviar el formulario.
Nota   Es posible pasar la secuencia de comandos en línea directamente como argumento de este método o bien pasar la llamada a un controlador de eventos. Si se pasa una llamada a un controlador de eventos, éste debe definirse de forma independiente en un bloque o una biblioteca de secuencias de comandos.
Page.IsClientScriptBlockRegistered Determina si un bloque de secuencia de comandos del cliente con la clave especificada está registrado en la página contenedora. El valor devuelto por este método permite determinar si es necesario invocar a Page.RegisterClientScriptBlock.
Page.IsStartupScriptRegistered Determina si un bloque de secuencia de comandos de inicio con la clave especificada está registrado en la página contenedora. El valor devuelto por este método permite determinar si es necesario invocar a Page.RegisterStartupScript.
Page.RegisterHiddenField Permite a un control de servidor registrar un campo oculto en su página contenedora que se emite cuando se procesa la página. El archivo de comandos de cliente tiene acceso a este campo. Cuando el formulario se devuelva al servidor, el campo oculto estará disponible para él como datos de devolución. Se utiliza cuando un control de servidor precisa enviar una variable oculta a la que deba tener acceso una secuencia de comandos del cliente. Esto resulta útil cuando la variable no puede procesarse como atributo del control o cuando para el procesamiento en el cliente es necesaria una variable independiente del control. Para consultar un ejemplo, vea Mantener cambios en el cliente en un control que no es un formulario.

Los controles de validación son los únicos controles de servidor de ASP.NET que aprovechan al máximo las características de cliente que ofrece ASP.NET. Debido a que el modelo de objetos de documento empleado por los distintos exploradores no es coherente, la mayor parte de los controles de servidor incluidos en .NET Framework SDK usan las secuencias de comandos de cliente lo mínimo posible, sobre todo para la devolución automática. Si se desea obtener información detallada sobre cómo usar secuencias de comandos para la devolución, vea Generar secuencias de comandos en el cliente para la devolución. Sin embargo, si se programa para un explorador específico o para varios que sean compatibles con un modelo de objetos de documento específico, se pueden usar secuencias de comandos de cliente en los controles con el fin de enriquecer la experiencia del cliente y limitar los viajes de ida y vuelta al servidor cuando sea posible.

Utilizar los métodos de secuencia de comandos expuestos por Page

En el fragmento de código siguiente extraído de Ejemplo de control de validación base se utilizan varios de los métodos de secuencias de comandos de cliente expuestos por la clase Page. En el fragmento, las llamadas a métodos de secuencia de comandos de cliente se indican en negrita. El código inicial del fragmento define constantes de cadena que contienen el nombre del archivo de comandos incluido al comienzo de la página, una clave para registrar un bloque de secuencia de comandos en la página, un bloque de secuencia de comandos para incluirlo al final de la página y una cadena con información de formato.

private const string ValidatorFileName = "DomValidation.js";
// The key to register a script key. In this example, the same key
// is used for registering both the script at the top of the
// page (called the client-side script block) and the script
// that is rendered at the bottom of the page (called  startup
// script).
private const string ValidatorIncludeScriptKey = "DomValidatorIncludeScript";

// The script block that is rendered at the bottom of the page.
private const string ValidatorStartupScript = @"
<script language=""javascript"">
<!--

var Page_ValidationActive = false;
if (typeof(Page_DomValidationVer) == ""undefined"")
    alert(""{0}"");
else
    ValidatorOnLoad();

function ValidatorOnSubmit() {{
    if (Page_ValidationActive) {{
        return ValidatorCommonOnSubmit();
    }}
}}

// -->
</script>
        ";
// Provides formatting information for emitting the script 
// block at the top of the page. 
private const string IncludeScriptFormat = @"
<script language=""{0}"" src=""{1}{2}""></script>";

// This method is called from OnPrerender in the
// Base Validator Control Sample.
protected void RegisterValidatorCommonScript() {
            
   string location = null;
   if (!Page.IsClientScriptBlockRegistered(ValidatorIncludeScriptKey)) {            
      // Provide the location of the script file.     
       location = Page.Request.ApplicationPath + "/script/";

      // Create client script block.
      string includeScript = String.Format(IncludeScriptFormat, "javascript",  location, ValidatorFileName);
      Page.RegisterClientScriptBlock(ValidatorIncludeScriptKey, includeScript);   
   }
                  
  if (!Page.IsStartupScriptRegistered(ValidatorIncludeScriptKey)) {     
     if (location == null) location = Page.Request.ApplicationPath + "/script/";
      // Provide error message, which is localized.
       string missingScriptMessage = "Validation script is missing '" + location + ValidatorFileName + "'";
      // Create startup script block.
        string startupScript = String.Format(ValidatorStartupScript, new object [] {missingScriptMessage,});                                     
        Page.RegisterStartupScript(ValidatorIncludeScriptKey, startupScript);
   }              
  Page.RegisterOnSubmitStatement("ValidatorOnSubmit", "return ValidatorOnSubmit();");
}
[Visual Basic]
Private Const ValidatorFileName As String = "DomValidation.js"
' The key to register a script key. In this example, the same key
' is used for registering both the script at the top of the
' page (called the client-side script block) and the script
' that is rendered at the bottom of the page (called startup
' script).
Private Const ValidatorIncludeScriptKey As String = "DomValidatorIncludeScript"

' The script block that is rendered at the bottom of the page.
Private Const ValidatorStartupScript As String = ControlChars.CrLf & _
"<script language=""javascript"">" & ControlChars.CrLf & _
"<!--" & ControlChars.CrLf & _
"var Page_ValidationActive = false;" & ControlChars.CrLf & _
"if (typeof(Page_DomValidationVer) == ""undefined"")" & ControlChars.CrLf & _
"    alert(""{0}"");" & ControlChars.CrLf & _
"else" & ControlChars.CrLf & _
"    ValidatorOnLoad();" & ControlChars.CrLf & ControlChars.CrLf & _
"function ValidatorOnSubmit() {{" & ControlChars.CrLf & _
"    if (Page_ValidationActive) {{" & ControlChars.CrLf & _
"        return ValidatorCommonOnSubmit();" & ControlChars.CrLf & _
"    }}" & ControlChars.CrLf & _
"}}" & ControlChars.CrLf & _
"// -->" & ControlChars.CrLf & _
"</script>"
' Provides formatting information for emitting the script 
' block at the top of the page. 
Private Const IncludeScriptFormat As String = ControlChars.CrLf & _
"<script language=""{0}"" src=""{1}{2}""></script>"

' This method is called from OnPrerender in the
' Base Validator Control Sample.
Protected Sub RegisterValidatorCommonScript()
   Dim location As String = Nothing
   If Not Page.IsClientScriptBlockRegistered(ValidatorIncludeScriptKey) Then
      ' Provide the location of the script file.
      ' When using a script library, deployment can be 
      ' a problem because the runtime is
      ' tied to a specific version of the script file. 
      ' This sample takes the easy way out and insists that
      ' the file be placed in the /script subdirectory 
      ' of the application.
      ' In other cases, you should place it where it
      ' can be shared by multiple applications and is placed 
      ' in a separate directory so that different versions 
      ' of a control library can run side by side.
      ' The recommended pattern is to put script files in the 
      ' path /aspnet_client/<assembly name>/<assembly version>/".
      location = Page.Request.ApplicationPath + "/script/"
      
      ' Create the client script block.
      Dim includeScript As String = [String].Format(IncludeScriptFormat, "javascript", location, ValidatorFileName)
      Page.RegisterClientScriptBlock(ValidatorIncludeScriptKey, includeScript)
   End If
   
   If Not Page.IsStartupScriptRegistered(ValidatorIncludeScriptKey) Then
      
      If location Is Nothing Then
         location = Page.Request.ApplicationPath + "/script/"
      End If 
      ' Provide an error message, which is localized.
      Dim missingScriptMessage As String = "Validation script is missing '" & location & ValidatorFileName & "'"
      
      ' Create the startup script block.
      Dim startupScript As String = [String].Format(ValidatorStartupScript, New Object() {missingScriptMessage})
      Page.RegisterStartupScript(ValidatorIncludeScriptKey, startupScript)
   End If
   
   Page.RegisterOnSubmitStatement("ValidatorOnSubmit", "return ValidatorOnSubmit();")
End Sub

En el fragmento de código siguiente extraído de Ejemplo de control de validación base se muestra cómo invocar al método Page.RegisterArrayDeclaration (resaltado en negrita en el fragmento), que agrega el elemento procesado por el control a una variable de matriz (Page_Validators) procesada en la secuencia de comandos de cliente. Al registrar la variable de matriz en la página (con la clave Page_Validators) se asegura que sólo se crea una variable con este nombre en la página.

// This method is called from Render in the
// Base Validator Control Sample.
protected virtual void RegisterValidatorDeclaration() {
   string element = "document.getElementById(\"" + ClientID + "\")";
   Page.RegisterArrayDeclaration("Page_Validators", element);
  }
[Visual Basic]
' This method is called from Render in the
' Base Validator Control Sample.
Protected Overridable Sub RegisterValidatorDeclaration()
   Dim element As String = "document.getElementById(""" & ClientID & """)"
   Page.RegisterArrayDeclaration("Page_Validators", element)
End Sub

Obtener acceso a un control en una secuencia de comandos de cliente

La clase base Control expone una propiedad denominada ClientID, que procesa (en HTML) como el atributo ID del elemento procesado. ASP.NET genera ClientID dinámicamente para cada control y garantiza que su valor será único dentro de la página. De este modo es posible el acceso a un control (es decir, al elemento que el control procesa) en el cliente mediante el uso de su identificador en un modelo de objetos de documento. Un control puede usar también ClientID con el fin de generar nombres únicos para elementos adicionales que tenga que procesar (por ejemplo, campos ocultos).

La emisión del valor de ClientID en una secuencia de comandos en línea (o en código de una biblioteca de secuencias de comandos) puede presentar dificultades, ya que ClientID debe insertarse en el lugar adecuado de una variable de cadena. En el ejemplo siguiente se usan caracteres de escape para insertarlo en una cadena que forma una secuencia de comandos en línea.

   string element = "document.getElementById(\"" + ClientID + "\")";
   Page.RegisterArrayDeclaration("Page_Validators", element);
[Visual Basic]
   Dim element As String = "document.getElementById(""" & ClientID & """)"
   Page.RegisterArrayDeclaration("Page_Validators", element)

También es posible usar los métodos Format sobrecargados de la clase String para componer secuencias de comandos en el cliente que utilicen ClientID. Para obtener más información acerca del formato, vea Dar formato a los tipos.

Implementar un archivo de comandos

El bloque de secuencia de comandos que emite un control habilitado para ello puede contener una secuencia de comandos en línea o bien puede indicar la ubicación de un archivo de comandos. En el ejemplo presentado anteriormente se ilustran ambos casos. Si el bloque indica la ubicación de un archivo de comandos, se deberá implementar ese archivo de modo que pueda usarse desde otras aplicaciones y no se produzcan conflictos de versiones. En el ejemplo, el archivo de comandos se encuentra en un subdirectorio denominado script del directorio raíz virtual de la aplicación Web.

      // Provides the location of the script file.    
       location = Page.Request.ApplicationPath + "/script/";
[Visual Basic]
      ' Provides the location of the script file.
      location = Page.Request.ApplicationPath & "/script/"

Aunque este subdirectorio sirve para el ejemplo, la ubicación recomendada de los archivos de comandos que también se vayan a usar en otras aplicaciones es la siguiente:

/aspnet_client/<your assembly name>/<your assembly version>/

aspnet_client es un directorio raíz virtual de aplicaciones Web que se crea en el equipo cuando se instala .NET Framework SDK o Visual Studio .NET. Por ejemplo, los archivos de comandos incluidos en ASP.NET se encuentran en la ubicación siguiente:

/aspnet_client/system_web/<version of SDK installed>

Si se tienen instaladas varias versiones del SDK, bajo aspnet_client/system_web, aparecerán varios subdirectorios. Cada biblioteca de controles está vinculada a una versión específica del archivo de comandos y, por ello, el modelo de implementación recomendado permite la coexistencia de distintas versiones de las bibliotecas.

También hay que tener en cuenta que se crea un directorio aspnet_client para cada sitio Web alojado en el equipo. En general, un servidor sólo alojará un sitio Web. Sin embargo, es posible que haya más de uno y, en tal caso, habrá varias copias del directorio aspnet_client.

Comprobar si se debe procesar una secuencia de comandos

Los controles que utilicen secuencias de comandos deben ofrecer la posibilidad de habilitar o deshabilitar el procesamiento de secuencias de comandos en el cliente. El control de validación de servidor Web de ASP.NET expone una propiedad de tipo booleano denominada EnableClientScript que determina si el control puede procesar secuencias de comandos en el cliente. Es posible definir una propiedad que ofrezca esta funcionalidad del modo siguiente:

public bool EnableClientScript {
            get {
                object o = ViewState["EnableClientScript"];
                return((o == null) ? true : (bool)o);
            }
            set {
                ViewState["EnableClientScript"] = value;
            }
        }
[Visual Basic]
Public Property EnableClientScript() As Boolean
   Get
      Dim o As Object = ViewState("EnableClientScript")
      If o Is Nothing Then
         Return True
      Else
         Return CBool(o)
      End If
   End Get
   Set
      ViewState("EnableClientScript") = value
   End Set
End Property

Antes del procesamiento, el control que usa la secuencia de comandos debe comprobar la funcionalidad del cliente y también si el usuario (el programador de la página) ha desactivado las secuencias de comandos. En general, estas comprobaciones tienen lugar en las fases de preprocesamiento y procesamiento. En el fragmento de código siguiente, extraído de Ejemplo de control de validación base, se hacen las comprobaciones en la fase de preprocesamiento.

private boolean renderUplevel;
protected override void OnPreRender(EventArgs e) {
            base.OnPreRender(e);
            ...            
            // Work out uplevelness now.
            renderUplevel = DetermineRenderUplevel();

            if (renderUplevel) {
                // Helper method that creates script blocks
                // and registers them with the page.
                RegisterValidatorCommonScript();
            }
        }
        // Helper method to check whether script should be rendered.
        protected virtual bool DetermineRenderUplevel() {

            // Must be on a page.
            Page page = Page;
            if (page == null || page.Request == null) {
                return false;
            }

            // Check  whether the user has turned off scripting and
            // check browser capabilities. This custom control 
            // needs the W3C DOM level 1 for control manipulation
            // and at least ECMAScript 1.2.
            return (EnableClientScript 
                        && page.Request.Browser.W3CDomVersion.Major >= 1
                        && page.Request.Browser.EcmaScriptVersion.CompareTo(new Version(1, 2)) >= 0);
        }
[Visual Basic]
Private _renderUplevel As Boolean
Protected Overrides Sub OnPreRender(e As EventArgs)
   MyBase.OnPreRender(e)
   _preRenderCalled = True
   ' Force a re-query of properties for render.
   _propertiesChecked = False
   ' Work out uplevelness now.
   _renderUplevel = DetermineRenderUplevel()
   If _renderUplevel Then
      RegisterValidatorCommonScript()
   End If
End Sub
' Helper method to check whether script should be rendered.
Protected Overridable Function DetermineRenderUplevel() As Boolean
   ' Must be on a page.
   Dim page As Page = Page
   If page Is Nothing Or page.Request Is Nothing Then
      Return False
   End If
   
   ' Check the browser capabilities. 
   ' This is how you can get automatic fallback to server-side 
   ' behavior. These validation controls need 
   ' the W3C DOM level 1 for control manipulation
   ' and need at least ECMAScript 1.2 for the 
   ' regular expressions.
   Return EnableClientScript AndAlso _
         page.Request.Browser.W3CDomVersion.Major >= 1 AndAlso _
         page.Request.Browser.EcmaScriptVersion.CompareTo(New Version(1, 2)) >= 0
End Function

Para saber cómo se hacen las comprobaciones en la fase de procesamiento, vea el método Render en Ejemplo de control de validación base.

Secuencias de comandos procesadas en el cliente

Para saber la forma en que la secuencia de comandos encapsulada en el control se procesa en el cliente, compile e implemente los ejemplos mostrados en Ejemplos de controles de validación, solicite la página indicada en Página de prueba para ejemplo de control de validación y vea el código fuente de la página en el explorador. En el ejemplo siguiente aparecerán el código HTML y la secuencia de comandos. En el ejemplo, las secuencias de comandos que emiten los controles se resaltan en negrita. La página contiene varios controles que emiten secuencias de comandos y todos ellos se derivan del control base descrito en Ejemplo de control de validación base. Como resultado, el código fuente incluye secuencias de comandos adicionales que no se explican en este tema. Observe que al ver el código fuente en el explorador, el nombre del directorio de la aplicación (samples en el ejemplo) se sustituye por el nombre del directorio virtual de la aplicación.

<HTML>
  <HEAD>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN" >
<meta content="Microsoft Visual Studio .NET" name=GENERATOR>
<meta content=C# name=CODE_LANGUAGE>
<meta content="JavaScript (ECMAScript)" name=vs_defaultClientScript>
<meta content="Internet Explorer 3.02 / Navigator 3.0" name=vs_targetSchema>
<title>DOM Validators Test</title>
  </HEAD>
<body>
<form name="ValTest" method="post" action="valtest.aspx" language="javascript" onsubmit="return ValidatorOnSubmit();" id="ValTest">
<input type="hidden" name="__VIEWSTATE" value="dDwxOTkwOTM1MDA5O3Q8O2w8aTwxPjs+O2w8dDw7bDxpPDEzPjs+O2w8dDw7bDxpPDE+O2k8Mz47aTw1PjtpPDc+Oz47bDx0PHA8cDxsPFRleHQ7PjtsPElFOz4+Oz47Oz47dDxwPHA8bDxUZXh0Oz47bDw1LjU7Pj47Pjs7Pjt0PHA8cDxsPFRleHQ7PjtsPDEuMjs+Pjs+Ozs+O3Q8cDxwPGw8VGV4dDs+O2w8MS4wOz4+Oz47Oz47Pj47Pj47Pj47Pg==" />
   
<script language="javascript" src="/samples/script/DomValidation.js"></script>


<P><FONT face=Verdana size=5>DOM Validators Test</FONT></P>
<P>
<TABLE cellSpacing=1 cellPadding=1 width=602 border=0 height=131>
  <TR>
    <TD style="WIDTH: 82px">Name:</TD>
    <TD style="WIDTH: 164px"><input name="txtName" type="text" id="txtName" /></TD>
    <TD><span id="valRequired" controltovalidate="txtName" errormessage="Required." evaluationfunction="RequiredFieldValidatorEvaluateIsValid" initialvalue="" style="color:Red;visibility:hidden;">Required.</span></TD>
    </TR>
  <TR>
    <TD style="WIDTH: 82px">Postal&nbsp;Code:</TD>
    <TD style="WIDTH: 164px"><input name="txtPostcode" type="text" id="txtPostcode" /></TD>
    
    <TD><span id="valRegex" controltovalidate="txtPostcode" errormessage="Postcode must be 9999." evaluationfunction="RegularExpressionValidatorEvaluateIsValid" validationexpression="\d{4}" style="color:Red;visibility:hidden;">Postcode must be 9999.</span></TD>
    </TR>
    </TABLE></P>
<P>
<input type="submit" name="cmdSubmit" value="Submit" onclick="if (typeof(Page_ClientValidate) == 'function') Page_ClientValidate(); " language="javascript" id="cmdSubmit" />&nbsp;&nbsp; 
<input type="submit" name="cmdCancel" value="Cancel" id="cmdCancel" />
</P>
<div id="Panel1" style="border-color:#00C000;border-width:2px;border-style:Solid;height:55px;width:197px;">
   
<P>
Browser: <span id="lblBrowserName">IE</span><br>
Version: <span id="lblBrowserVersion">5.5</span><br>
Script Version: <span id="lblScriptVersion">1.2</span><br>
DOM Version: <span id="lblDomVersion">1.0</span><br>
Submit clicks: <span id="lblSubmitCount"> 0 </span><br>
Cancel clicks: <span id="lblCancelCount"> 0 </span><br>
</P>
</div>

<script language="javascript"><!--   var Page_Validators =  new Array(document.getElementById("valRequired"), document.getElementById("valRegex"));      // --></script><script language="javascript"><!--var Page_ValidationActive = false;if (typeof(Page_DomValidationVer) == "undefined")    alert("Validation script is missing '/samples/script/DomValidation.js'");else    ValidatorOnLoad();function ValidatorOnSubmit() {    if (Page_ValidationActive) {        return ValidatorCommonOnSubmit();    }}// --></script>

      </form>
   
  </body>
</HTML>

Vea también

Ejemplo de control de validación base | Ejemplos de controles de validación