Controles de Validación en ASP.NET

Buenas a todos.

Esa noche quiero hablarles de los controles de validación que vienen para usar en ASP.NET con Visual Studio desde sus comienzos y hasta las nuevas visiones. Particularmente me gustan estos controles, que los prefiero por encima de la validación de ofrece Jquery con su plugin, para mas información en blog tengo una seria de artículos que lo podrán ayudar.

Bueno lo primero cuando creamos nuestro proyecto web, vamos a nuestra toolbox y vamos a nuestro tab de validation y vemos lo siguiente.

image

Como ven son una serie de controles que nos van a permitir hacer una validación de otros controles por ejemplo texbox,listbox,dropdownlist ..etc, son controles para los cuales validaremos todas las posibles entrada de datos a nuestra aplicación.

Los tipos de controles de validación son los siguientes.

  • CompareValidator: Compara el valor especificado por el usuario en un control de entrada con el valor especificado en otro control de entrada o con un valor constante.
  • CustomValidator: Realiza una validación definida por el usuario en un control de entrada.
  • RangeValidator: Comprueba si el valor de un control de entrada está comprendido en un intervalo especificado de valores.
  • RegularExpressionValidator: Comprueba si el valor de un control de entrada asociado coincide con el modelo especificado por una expresión regular.
  • RequiredFieldValidator: Convierte el control de entrada asociado en un campo obligatorio.
  • ValidationSummary: Muestra un resumen de todos los errores de validación en línea en una página Web, en un cuadro de mensaje o en ambos.

El funcionamiento es algo sencillo, cada control de validación tiene una propiedad ControlToValidate que lo que hace es vigilar el control al cual voy a validar la entrada de dato.

En esta entrada vamos a ver el control mas común, el RequiredFieldValidator ya que la validación mas común es garantizar por lo menos que todos los datos pedidos por la aplicación, sean diligenciados.

Para no ir tan lejos en el ejemplo, vamos a usar la pagina Login que se crea automáticamente con nuestro proyecto.

   1: <span class="failureNotification">

   2:     <asp:Literal ID="FailureText" runat="server"></asp:Literal>

   3: </span>

   4: <asp:ValidationSummary ID="LoginUserValidationSummary" runat="server" CssClass="failureNotification" 

   5:      ValidationGroup="LoginUserValidationGroup"/>

   6: <div class="accountInfo">

   7:     <fieldset class="login">

   8:         <legend>Account Information</legend>

   9:         <p>

  10:             <asp:Label ID="UserNameLabel" runat="server" AssociatedControlID="UserName">Username:</asp:Label>

  11:             <asp:TextBox ID="UserName" runat="server" CssClass="textEntry"></asp:TextBox>

  12:             <asp:RequiredFieldValidator ID="UserNameRequired" runat="server" ControlToValidate="UserName" 

  13:                  CssClass="failureNotification" ErrorMessage="User Name is required." ToolTip="User Name is required." 

  14:                  ValidationGroup="LoginUserValidationGroup">*</asp:RequiredFieldValidator>

  15:         </p>

  16:         <p>

  17:             <asp:Label ID="PasswordLabel" runat="server" AssociatedControlID="Password">Password:</asp:Label>

  18:             <asp:TextBox ID="Password" runat="server" CssClass="passwordEntry" TextMode="Password"></asp:TextBox>

  19:             <asp:RequiredFieldValidator ID="PasswordRequired" runat="server" ControlToValidate="Password" 

  20:                  CssClass="failureNotification" ErrorMessage="Password is required." ToolTip="Password is required." 

  21:                  ValidationGroup="LoginUserValidationGroup">*</asp:RequiredFieldValidator>

  22:         </p>

  23:         <p>

  24:             <asp:CheckBox ID="RememberMe" runat="server"/>

  25:             <asp:Label ID="RememberMeLabel" runat="server" AssociatedControlID="RememberMe" CssClass="inline">Keep me logged in</asp:Label>

  26:         </p>

  27:     </fieldset>

  28:     <p class="submitButton">

  29:         <asp:Button ID="LoginButton" runat="server" CommandName="Login" Text="Log In" ValidationGroup="LoginUserValidationGroup"/>

  30:     </p>

  31: </div>

Revisemos el código.

   1: <asp:RequiredFieldValidator ID="UserNameRequired" runat="server" ControlToValidate="UserName" 

   2: CssClass="failureNotification" ErrorMessage="User Name is required." ToolTip="User Name is required." 

   3: ValidationGroup="LoginUserValidationGroup">*</asp:RequiredFieldValidator>

ControlToValidate="UserName": es el control al cual voy a validar.
CssClass="failureNotification": bueno es para darle un poco de color con las hojas de estilos.
ErrorMessage="User Name is required.": el mensaje que vamos a mostrar.
ValidationGroup="LoginUserValidationGroup": es para validar un grupo especifico de controles. “Esto es cuando tenemos hartos controles y queremos dividirlo”
image

Bueno espero que les haya servidor.

Nota: Seguiremos con los demás controles en  nuestro próximo post.

Saludos. Romny

jQuery validation plugin en ASP.NET [Parte II]-a

Hola a todos. Desde un pequeño descanso me reporto con el blog.

Este breve post es para dejar el código para validar que la fecha sea valida. Cosa que quedo pendiente de anterior.

retomando mis anteriores post sobre el tema.

La cuestión es validar que la fecha sea correcta, me refiero a que no sea por ejemplo en el formato dd/mm/yyyy (99/99/9999).el script quedaría como el siguiente.

   1: $.validator.addMethod(

   2:     "colombiaDate1",

   3:      function(value,element) {

   4:  

   5:              return value.match(/^(0[1-9]|[12][0-9]|3[01])[- //.](0[1-9]|1[012])[- //.](19|20)dd$/);

   6:              },

   7:                  "Please enter a date in the format dd/mm/yyyy"

   8:              );

y llamaríamos al método de la siguiente forma.

   1: <%=txtFecha.UniqueID %>: {                        

   2:                         required: true,

   3:                         colombiaDate1:true

Observen como queda al final.

image

image

Bueno ya con esto, podemos darnos por bien servidos, al saber que la fecha es correcta.

saludos a todos.

Romny

jQuery validation plugin en ASP.NET [Parte II]

Hola a todos.

Bueno esto es un post cortico sobre la validación de las fechas. Pero no sin antes mencionar los anteriores post.

Bueno siempre he dicho que validar hasta lo ultima expresión de los argumentos que damos en una aplicación es algo tedioso. Por ejemplo las fechas, si no controlamos que la fecha sea dada en un solo formato, tendrás que hacer que la fecha que ya esta almacenada en la bd se muestre en el formato que querías. esto debido a que la aplicación por ejemplo web, será consultada en muchos idiomas y estos como tal tienen su forma de ver las fechas.

el jQuery validation plugin trae dos formatos para validar, dateISO( ) y dateDE( ) , si tu formato de fecha no se ajusta a estos, tendrá que ver la forma de como validarlo. Aquí una de las muchas formas.

   1: $.validator.addMethod( 

   2:               "colombiaDate", 

   3:               function (value, element) { 

   4:                 

   5:                 return value.match(/^dd?/dd?/dddd$/); 

   6:               }, 

   7:               "Please enter a date in the format dd/mm/yyyy" 

   8:             ); 

luego lo que haremos será cambiar la validación así.

   1: <%=txtFecha.UniqueID %>: {                        

   2:                         required: true,

   3:                         colombiaDate:true

   4:                     }

Y todo esto quedaría así.

image

Ahora, hay formas mas fáciles de hacer esto y es seleccionando la fecha desde un control que muestre la fecha, ya que esta validación no valida si es fecha correcta, me refiero a que no se mes 13 por ejemplo o día 32.

Espero que les haya servidor este post breve.

Nota: les debo como validar fecha correcta en jquery.

Saludos. Romny

jQuery validation plugin en ASP.NET [Parte I]

Hola a todos, bueno en mis días de descanso seguimos compartiendo conocimiento. En nuestro previo post hablamos sobre jQuery validation plugin en WebForms de Asp.Net con masterpage, hoy hablaremos de como darle contexto de mensajes de español a las validaciones.

 

  • Primer método.

bueno la forma mas fácil es colocando lo que necesitamos en los mensajes.

   1:  <script type="text/javascript">
   2:          $(document).ready(function() {
   3:              $("#form1").validate({
   4:                  rules: {
   5:                      <%=txtNombre.UniqueID %>: {
   6:                          minlength: 2,
   7:                          required: true
   8:                      },
   9:                       <%=txtMail.UniqueID %>: {                        
  10:                          required: true,
  11:                          email:true
  12:                      },
  13:                       <%=txtApellido.UniqueID %>: {                        
  14:                          minlength: 2,
  15:                          required: true
  16:                      },
  17:                       <%=txtFecha.UniqueID %>: {                        
  18:                          required: true,
  19:                          date:true
  20:                      }
  21:                  }, messages: {
  22:                      <%=txtNombre.UniqueID %>:{ 
  23:                          required: "* Campo Requerido*", 
  24:                          minlength: "* Por favor digitar al menos 2 caracteres *" 
  25:                      },
  26:                      <%=txtMail.UniqueID %>:{ 
  27:                          required: "* Campo Requerido*", 
  28:                          email:"* Direccion de correo invalida *"
  29:                      }
  30:                      ,
  31:                      <%=txtApellido.UniqueID %>:{ 
  32:                          required: "* Campo Requerido*", 
  33:                          minlength:"* Por favor digitar al menos 2 caracteres *"
  34:                      },
  35:                      <%=txtFecha.UniqueID %>:{ 
  36:                          required: "* Campo Requerido*", 
  37:                          date:"* Por favor digitar una fecha *"
  38:                      }
  39:                  }
  40:              });
  41:          });
  42:      </script>

Y así quedaría.

image

image

  • Segundo método

Para el segundo método vamos a usar metodo jQuery.extend para extender jQuery.validator.messages, para esto hay que hacerlo en un archivo aparte y la referencia tiene que estar después del jQuery validation.

   1:  jQuery.extend(jQuery.validator.messages, {
   2:      required: "Este campo es requerido",
   3:      remote: "Porfavor corrije el valor de este campoPlease fix this field.",
   4:      email: "Ingresa una dirección de correo válida.",
   5:      url: "Ingresa una URL válida.",
   6:      date: "Ingresa una fecha válida.",
   7:      dateISO: "Ingresa una fehca válida (ISO).",
   8:      number: "Ingresa un número válido.",
   9:      digits: "Ingresa sólo letras.",
  10:      creditcard: "Ingresa un número de tarjeta de crédito válido.",
  11:      equalTo: "Ingresa el nuevo valor de nuevo.",
  12:      accept: "Ingresa un valor con extensión válida.",
  13:      maxlength: $.validator.format("Porfavor ingresa menos de {0} caractéres."),
  14:      minlength: $.validator.format("Porfavor ingresa almenos {0} caractéres."),
  15:      rangelength: $.validator.format("Porfavor ingresa un valor entre {0} y {1} caractéres de longitud."),
  16:      range: $.validator.format("Ingresa un valor entre {0} y {1}."),
  17:      max: $.validator.format("Ingresa un valor menor o igual que {0}."),
  18:      min: $.validator.format("Ingresa un valor mayor o igual a {0}.")
  19:  }); 

Observen las referencias.

   1:  <script src="Scripts/jquery-1.6.3-vsdoc.js" type="text/javascript"></script>
   2:  <script src="Scripts/jquery-1.6.3.js" type="text/javascript"></script>
   3:  <script src="Scripts/jquery.validate-vsdoc.js" type="text/javascript"></script>
   4:  <script src="Scripts/jquery.validate.js" type="text/javascript"></script>
   5:  <script src="Scripts/Script.js" type="text/javascript"></script>

Y así quedaría la validación.

image

Bueno eso es todo, espero que les sirva.

Saludos. Romny

jQuery validation plugin en ASP.NET

Buenas a todos.

bueno antes de estar unos días en offline, les quiero mostrar como usar el jQuery validation plugin en WebForms de Asp.Net con masterpage.

Lo primo es crear nuestro proyecto web en su lenguaje de preferencia. El por defecto de crear los scripts de jquery 1.4.

image

Después instalares el jquery 1.6 y el jquery validate 1.8

PM> Install-Package jQuery

PM> Install-Package jQuery.Validation

image

Seguidamente en la masterpage haremos las referencias indicadas para que las demás paginas se pueda trabajar con la librería.

 

recordar que para que les funcione tienen que agregarle un id al form predeterminado.

<form id=»form1″ action=»#» runat=»server»>

En mi pagina tengo esto.

image

 

Ahora el código para validar seria este.

 

Y así quedaría.

image

image

Esto es por ahora. Luego veremos como hacerlo de acuerdo al idioma tanto los mensajes como la validación, por ejemplo la fecha.

Bueno espero les sirva.

Saludos. Romny

Windows Developer Preview: Impresiones

Buenas a todos.

Bueno ya todos deben de haber visto las keynote de la presentación de la Preview del próximo sistema operativo de Microsoft: Windows 8, En el evento Build Windows. Bueno anoche fue liberado el build en formato iso, también fue liberado las próximas versiones de herramientas para los desarrolladores así que si quieren descargar dichas herramientas lo pueden hacer desde Windows Developer Preview downloads.

Como dato curioso, si no tienes una maquina para hacer dichas pruebas del Preview, lo mas logico es hacerlo en forma virtual. Si quieren instalar la preview en un VHD les recomiendo Guide to Installing and Booting Windows 8 Developer Preview off a VHD (Virtual Hard Disk).

Si quieres instarlo en Windows Virtual Pc, te digo que la iso para 64x no te va a funcionar por esta característica todavía no es implementada, solo te funcionara la de x86.

Si piensas que con VMWare puedes hacerlo, te digo que tampoco. Ya que VMWare no soporte ACPI 2.0, un requisito de Windows 8.

Solo nos queda Virtual Box “Increíble”, debes crear una maquina con las mismas características de Windows 7 y activando la característica IO APIC.

Win8-0

Win8-1Win8-2

Win8-3Win8-4

Solo me queda decirles, que la descarguen y la prueben. Trae muchas cosas buenas.

Saludos

Romny

Remote Desktop Manager

Hola a todos.

En nuestro día a día como desarrollador, como administrador de IT, han usado la herramienta de conexión a escritorio remoto, herramienta que que utiliza las conexiones RDP para conectarse remotamente a nuestros servidores y/o maquinas.

image

Ahora díganme si en este trabajo no usas bastantes servidores, y por cada conexión abres un escritorio remoto, esto se vuelve tedioso a ratos. Para evitar esto les traigo dos herramientas.

Multi Remote Desktop Client .NET

Como su nombre lo indica, herramienta desarrollada con .NET

MainWindow_thumb[5]

Remote Desktop Connection Manager

Herramienta que provee Microsoft

Remote Desktop Connection Manager

Se las recomiendo, les ayuda a organizar todas sus conexiones.

Saludos

Romny

jqGrid for ASP.NET “WebForms y MVC”

hola a t@dos.

Esta noche de domingo les traigo un componente muy fácil de integrar a nuestros desarrollos y lo bueno es que se integra con ambas tecnologías de ASP.NET , hablo de WebForms y MVC. Además este componente es una extensión del plugin jQuery  – jqGrid

Nuestro amigo José M. Aguilar ya hizo una introducción a esta suit integrándolo con MVC.

Este componente es fantástico, permite hacer: Sorting,Searching/Filtering,CRUD,Grouping,Hierarchy,Selection,Paging, y modificar su Apariencia.

image

Links.

Espero que les ayude la info.

S@ludos. Romny

Windows Azure ASP.NET Providers

Hola a todos.

El sistema de sistema de membresía de ASP.NET en Windows Azure se puede usar con Sql Azure, para ello es bueno revisar el post de Lluis Franco sobre el problema de mover las membresías de ASP.NET a Windows Azure.

Ahora si quieres usar el Storage, Tables y Blobs de windows azure para hacer lo mismo puedes usar los Windows Azure ASP.NET Providers

image

Si quieres hacer la prueba en tu maquina recuerda usar el Windows Azure Store Simulator

image

image

Espero que les ayude la info.

S@ludos. Romny

Tailspin Spyworks–Tutoriales ASP.NET 4

H@las a todos.

Si eres nuevo en este tema de ASP.NET, del concepto de los WebForms y deseas tener un buen material del desarrollo de una aplicación web con las ultimas características que ofrece ASP.NET 4. Pues comienza con los tutoriales de la aplicación Tailspin Spyworks que nos provee el sitio oficial de ASP.NET.

Tutoriales

Videos

Descargas

http://tailspinspyworks.codeplex.com/

S@ludos. Romny