Charlas Gratuitas en Instituciones Educativas
A pedido de algunas personas, estoy tomando la iniciativa de nuevamente difundir Programación en .NET para los estudiantes de Institutos y Universidades del Perú.
Las charlas en cada institución serán entre 2 y 3 horas y serán libres, aquellos interesados que quieren llevar a sus centros de estudios una charla deberán enviarme un mail a: Luis.duenash@gmail.com con el asunto: "Charlas en Instituciones Educativas", indicando el Centro de Estudios, Lugar, Contacto, Fecha propuesta y Numero aproximado de participantes.
Las charlas deberán ser entre Lunes y Viernes en la tarde o en la noche. Para tener alguna constancia de la charla seria bueno al final un Certificado de participación como expositor. Por ahora sera en Lima ya que para provincias es un poco complicado, pero se podría llegar a un acuerdo.
Mi misión es compartir el conocimiento especializado en el desarrollo de aplicaciones, lo cual lo vengo haciendo mas de 20 años, pero el sector con el que siempre he trabajo ha sido el profesional, es decir, los que ya trabajan desarrollando, pero creo que los estudiantes que son los que recién empiezan son los que mas necesitan ver en lo que van a pasar muchos años de su vida y hay que hacerlo lo mejor posible.
Saludos.
jueves, 3 de julio de 2014
El Libro del Día: Learning jQuery Deferreds
El Libro del Día: 2014-07-03
Titulo: Learning jQuery Deferreds
Autor: Terry Jones, Nicholas H Tollervey
Editorial: O'Reilly
Nro Paginas: 131
![]()
Capítulos:
1. Introduction
2. The jQuery Deferred API
3. Deferred Recipes
4. More Time in the Mental Gymnasium
A. Hints for Selected Challenges
B. The Promises/A+ Specification
C. Converting an ArrayBuffer to Base 64
Descarga:
Learning_jQuery_Deferreds
Titulo: Learning jQuery Deferreds
Autor: Terry Jones, Nicholas H Tollervey
Editorial: O'Reilly
Nro Paginas: 131
Capítulos:
1. Introduction
2. The jQuery Deferred API
3. Deferred Recipes
4. More Time in the Mental Gymnasium
A. Hints for Selected Challenges
B. The Promises/A+ Specification
C. Converting an ArrayBuffer to Base 64
Descarga:
Learning_jQuery_Deferreds
miércoles, 2 de julio de 2014
El Libro del Día: MCSD Certification Toolkit Exam 70483 Programming in C#
El Libro del Día: 2014-07-02
Titulo: MCSD Certification Toolkit Exam 70483 Programming in C#
Autor: Tiberiu Covaci, Gerry O'Brien, Rod Stephen, Vincent Varallo
Editorial: Wrox
Nro Paginas: 650
Capítulos:
Chapter 1: Introducing the Programming C# Certification
Chapter 2: Basic Program Structure
Chapter 3: Working with the Type System
Chapter 4: Using Types
Chapter 5: Creating and Implementing Class Hierarchies
Chapter 6: Working with Delegates, Events, and Exceptions
Chapter 7: Multithreading and Asynchronous Processing
Chapter 8: Creating and Using Types with Reflection, Custom Attributes, the CodeDOM, and Lambda Expressions
Chapter 9: Working with Data
Chapter 10: Working with Language Integrated Query (LINQ)
Chapter 11: Input Validation, Debugging, and Instrumentation
Chapter 12: Using Encryption and Managing Assemblies
APPENDIX: Answers to Sample Test Questions
Descarga:
MCSD_CertificationToolkit_Exam70483_ProgrammingC#
Titulo: MCSD Certification Toolkit Exam 70483 Programming in C#
Autor: Tiberiu Covaci, Gerry O'Brien, Rod Stephen, Vincent Varallo
Editorial: Wrox
Nro Paginas: 650
Capítulos:
Chapter 1: Introducing the Programming C# Certification
Chapter 2: Basic Program Structure
Chapter 3: Working with the Type System
Chapter 4: Using Types
Chapter 5: Creating and Implementing Class Hierarchies
Chapter 6: Working with Delegates, Events, and Exceptions
Chapter 7: Multithreading and Asynchronous Processing
Chapter 8: Creating and Using Types with Reflection, Custom Attributes, the CodeDOM, and Lambda Expressions
Chapter 9: Working with Data
Chapter 10: Working with Language Integrated Query (LINQ)
Chapter 11: Input Validation, Debugging, and Instrumentation
Chapter 12: Using Encryption and Managing Assemblies
APPENDIX: Answers to Sample Test Questions
Descarga:
MCSD_CertificationToolkit_Exam70483_ProgrammingC#
martes, 1 de julio de 2014
El Demo del Día: Proteger el Archivo de Configuración
Proteger el Archivo de Configuración
Problema de Seguridad
En .NET, el archivo de configuración de las aplicaciones (App.config o Web.config) se divide en secciones como connectionStrings para guardar cadenas de conexion o appSettings para guardar variables de aplicación, y muchas veces necesitamos proteger la información de una o ambas secciones para que no sea vista fácilmente, por ejemplo el usuario y clave de la cadena de conexión.
Solución al Problema de Seguridad
Podemos implementar un código que permita cifrar la cadena de conexión y luego descifrarla, pero sería muy trabajoso y no tan eficiente. Desde .NET Framework 2.0 podemos proteger una sección del archivo de configuración usando el método "ProtectSection" de la clase "SectionInformation", el cual marca la sección para que se cifre, de modo que se escriba en el disco en formato cifrado.
Sintaxis: ConfigurationElement.SectionInformation.ProtectSection(ProveedorProtección)
Los proveedores de protección incluidos son los siguientes: DPAPIProtectedConfigurationProvider y RSAProtectedConfigurationProvider.
Nota: Por defecto, sino se coloca ningún parámetro con el Proveedor de Protección (nulo o vacío), se
usa por defecto "RSAProtectedConfigurationProvider", pero en .NET Framework 2 y 3.5 puede generar un error, mejor es especificar el proveedor.
Más información: SectionInformation.ProtectSection (Método)
Crear una Aplicación Windows Forms de Prueba
Creamos una aplicación WinForms en C# llamada "Seguridad_AppConfig" y llamamos al formulario "frmPrueba" sobre el cual arrastramos 2 controles Label y 2 Textbox, similar a la siguiente figura:
Escribimos el siguiente código para el formulario:
using System;
using System.Drawing;
using System.Windows.Forms; //Form
using System.Data.SqlClient; //SqlConnection
using System.Configuration; //ConfigurationManager
namespace Seguridad_AppConfig
{
public partial class frmPrueba : Form
{
public frmPrueba()
{
InitializeComponent();
}
private void cargarDatos(object sender, EventArgs e)
{
using (SqlConnection con = new SqlConnection
(ConfigurationManager.ConnectionStrings["conNW"].ConnectionString))
{
con.Open();
txtCadenaConexion.Text = con.ConnectionString;
txtRutaLog.Text = ConfigurationManager.AppSettings["RutaLog"];
}
}
}
}
Nota: La función controladora "cargarDatos" esta asociado al evento "load" del "formulario".
Archivo de Configuración
Definimos las siguiente secciones en el archivo de configuración (App.Config):
<?xml version="1.0" encoding="utf-8" ?>
<configuration>
<connectionStrings>
<add name="conNW" providerName="System.Data.SqlClient" connectionString="uid=UsuarioNW;
pwd=123456;data source=servidor;initial catalog=Northwind"/>
</connectionStrings>
<appSettings>
<add key="RutaLog" value="C:\Logs\"/>
</appSettings>
<startup>
<supportedRuntime version="v4.0" sku=".NETFramework,Version=v4.5" />
</startup>
</configuration>
Clase con Métodos para Proteger Secciones del Archivo de Configuración
Creamos una clase llamada: "ProtegerConfig" con 3 métodos estáticos:
1. ProtegerConexion: Cifra solo la sección "connectionStrings".
2. ProtegerVariables: Cifra solo la sección "appSettings".
3. ProtegerConexionVariables: Cifra las 2 secciones, "connectionStrings" y "appSettings".
using System;
using System.Configuration;
namespace Seguridad_AppConfig
{
public class ProtegerConfig
{
public static void ProtegerConexion()
{
Configuration configura = ConfigurationManager.OpenExeConfiguration
(ConfigurationUserLevel.None);
if (!configura.ConnectionStrings.SectionInformation.IsProtected)
{
configura.ConnectionStrings.SectionInformation.ProtectSection
("RSAProtectedConfigurationProvider");
configura.Save(ConfigurationSaveMode.Full, true);
}
}
public static void ProtegerVariables()
{
Configuration configura = ConfigurationManager.OpenExeConfiguration
(ConfigurationUserLevel.None);
if (!configura.AppSettings.SectionInformation.IsProtected)
{
configura.AppSettings.SectionInformation.ProtectSection
("RSAProtectedConfigurationProvider");
configura.Save(ConfigurationSaveMode.Full, true);
}
}
public static void ProtegerConexionVariables()
{
Configuration configura = ConfigurationManager.OpenExeConfiguration
(ConfigurationUserLevel.None);
bool grabar = false;
if (!configura.ConnectionStrings.SectionInformation.IsProtected)
{
configura.ConnectionStrings.SectionInformation.ProtectSection
("RSAProtectedConfigurationProvider");
grabar = true;
}
if (!configura.AppSettings.SectionInformation.IsProtected)
{
configura.AppSettings.SectionInformation.ProtectSection
("RSAProtectedConfigurationProvider");
grabar = true;
}
if(grabar) configura.Save(ConfigurationSaveMode.Full, true);
}
}
}
Nota: Antes de proteger una sección primero averiguamos si ya fue protegida, ya que si grabamos una sección que ya fue protegida generará una excepción.
Modificar la llamada en el método Main de la clase "Program"
Aumentar en el método Main() de la clase Program.cs la llamada a los 3 método estáticos:
using System;
using System.Windows.Forms;
namespace Seguridad_AppConfig
{
static class Program
{
/// <summary>
/// Punto de entrada principal para la aplicación.
/// </summary>
[STAThread]
static void Main()
{
//ProtegerConfig.ProtegerConexion();
//ProtegerConfig.ProtegerVariables();
//ProtegerConfig.ProtegerConexionVariables();
Application.EnableVisualStyles();
Application.SetCompatibleTextRenderingDefault(false);
Application.Run(new frmPrueba());
}
}
}
Nota: Están comentados para probar uno por uno y ver los resultados.
Probar la aplicación que cifra el archivo de configuración
Primero ejecutamos la aplicación con los métodos comentados y se mostrará la figura:
Ingresar al directorio donde se crea el ejecutable de la aplicación: "Seguridad_AppConfig\bin\Debug\" y abrir con el bloc de notas el archivo de configuración: "Seguridad_AppConfig.exe.config" observar que esta igual como se definió al inicio (su tamaño es 1kb).
Parar la ejecución, descomentar la línea ProtegerConfig.ProtegerConexion(); del método Main(), grabar y compilar nuevamente. Ejecutar el exe desde fuera del Visual Studio, es decir el archivo: "Seguridad_AppConfig.exe" de la carpeta bin y observar el archivo de configuración, que ha cambiado (su tamaño es ahora 58 kb) y se ha cifrado la sección "connectionStrings".
Parar la ejecución, descomentar la línea ProtegerConfig.ProtegerVariables(); del método Main() y comentar la anterior, grabar y compilar nuevamente. Ejecutar el exe desde fuera del Visual Studio, es decir el archivo: "Seguridad_AppConfig.exe" de la carpeta bin y observar el archivo de configuración, que ha cambiado (su tamaño es ahora 58 kb) y se ha cifrado la sección "appSettings".
Finalmente, parar la ejecución, descomentar la línea ProtegerConfig.ProtegerConexionVariables(); del método Main() y comentar la anterior, grabar y compilar nuevamente. Ejecutar el exe desde fuera del Visual Studio, es decir el archivo: "Seguridad_AppConfig.exe" de la carpeta bin y observar el archivo de configuración, que ha cambiado (su tamaño es ahora 59 kb) y se ha cifrado ambas secciones "connectionStrings" y "appSettings".
Comentario Final
Aunque el demo es sobre WinForms, se puede usar el mismo código en todos los tipos de aplicaciones (ASP .NET WebForms, WPF, WCF, Workflow, etc) para cifrar el archivo de configuración usando un algoritmo asimétrico como RSA. Espero les sirva.
Descarga:
Demo08_Seguridad_AppConfig
Problema de Seguridad
En .NET, el archivo de configuración de las aplicaciones (App.config o Web.config) se divide en secciones como connectionStrings para guardar cadenas de conexion o appSettings para guardar variables de aplicación, y muchas veces necesitamos proteger la información de una o ambas secciones para que no sea vista fácilmente, por ejemplo el usuario y clave de la cadena de conexión.
Solución al Problema de Seguridad
Podemos implementar un código que permita cifrar la cadena de conexión y luego descifrarla, pero sería muy trabajoso y no tan eficiente. Desde .NET Framework 2.0 podemos proteger una sección del archivo de configuración usando el método "ProtectSection" de la clase "SectionInformation", el cual marca la sección para que se cifre, de modo que se escriba en el disco en formato cifrado.
Sintaxis: ConfigurationElement.SectionInformation.ProtectSection(ProveedorProtección)
Los proveedores de protección incluidos son los siguientes: DPAPIProtectedConfigurationProvider y RSAProtectedConfigurationProvider.
Nota: Por defecto, sino se coloca ningún parámetro con el Proveedor de Protección (nulo o vacío), se
usa por defecto "RSAProtectedConfigurationProvider", pero en .NET Framework 2 y 3.5 puede generar un error, mejor es especificar el proveedor.
Más información: SectionInformation.ProtectSection (Método)
Crear una Aplicación Windows Forms de Prueba
Creamos una aplicación WinForms en C# llamada "Seguridad_AppConfig" y llamamos al formulario "frmPrueba" sobre el cual arrastramos 2 controles Label y 2 Textbox, similar a la siguiente figura:
Escribimos el siguiente código para el formulario:
using System;
using System.Drawing;
using System.Windows.Forms; //Form
using System.Data.SqlClient; //SqlConnection
using System.Configuration; //ConfigurationManager
namespace Seguridad_AppConfig
{
public partial class frmPrueba : Form
{
public frmPrueba()
{
InitializeComponent();
}
private void cargarDatos(object sender, EventArgs e)
{
using (SqlConnection con = new SqlConnection
(ConfigurationManager.ConnectionStrings["conNW"].ConnectionString))
{
con.Open();
txtCadenaConexion.Text = con.ConnectionString;
txtRutaLog.Text = ConfigurationManager.AppSettings["RutaLog"];
}
}
}
}
Nota: La función controladora "cargarDatos" esta asociado al evento "load" del "formulario".
Archivo de Configuración
Definimos las siguiente secciones en el archivo de configuración (App.Config):
<?xml version="1.0" encoding="utf-8" ?>
<configuration>
<connectionStrings>
<add name="conNW" providerName="System.Data.SqlClient" connectionString="uid=UsuarioNW;
pwd=123456;data source=servidor;initial catalog=Northwind"/>
</connectionStrings>
<appSettings>
<add key="RutaLog" value="C:\Logs\"/>
</appSettings>
<startup>
<supportedRuntime version="v4.0" sku=".NETFramework,Version=v4.5" />
</startup>
</configuration>
Clase con Métodos para Proteger Secciones del Archivo de Configuración
Creamos una clase llamada: "ProtegerConfig" con 3 métodos estáticos:
1. ProtegerConexion: Cifra solo la sección "connectionStrings".
2. ProtegerVariables: Cifra solo la sección "appSettings".
3. ProtegerConexionVariables: Cifra las 2 secciones, "connectionStrings" y "appSettings".
using System;
using System.Configuration;
namespace Seguridad_AppConfig
{
public class ProtegerConfig
{
public static void ProtegerConexion()
{
Configuration configura = ConfigurationManager.OpenExeConfiguration
(ConfigurationUserLevel.None);
if (!configura.ConnectionStrings.SectionInformation.IsProtected)
{
configura.ConnectionStrings.SectionInformation.ProtectSection
("RSAProtectedConfigurationProvider");
configura.Save(ConfigurationSaveMode.Full, true);
}
}
public static void ProtegerVariables()
{
Configuration configura = ConfigurationManager.OpenExeConfiguration
(ConfigurationUserLevel.None);
if (!configura.AppSettings.SectionInformation.IsProtected)
{
configura.AppSettings.SectionInformation.ProtectSection
("RSAProtectedConfigurationProvider");
configura.Save(ConfigurationSaveMode.Full, true);
}
}
public static void ProtegerConexionVariables()
{
Configuration configura = ConfigurationManager.OpenExeConfiguration
(ConfigurationUserLevel.None);
bool grabar = false;
if (!configura.ConnectionStrings.SectionInformation.IsProtected)
{
configura.ConnectionStrings.SectionInformation.ProtectSection
("RSAProtectedConfigurationProvider");
grabar = true;
}
if (!configura.AppSettings.SectionInformation.IsProtected)
{
configura.AppSettings.SectionInformation.ProtectSection
("RSAProtectedConfigurationProvider");
grabar = true;
}
if(grabar) configura.Save(ConfigurationSaveMode.Full, true);
}
}
}
Modificar la llamada en el método Main de la clase "Program"
Aumentar en el método Main() de la clase Program.cs la llamada a los 3 método estáticos:
using System;
using System.Windows.Forms;
namespace Seguridad_AppConfig
{
static class Program
{
/// <summary>
/// Punto de entrada principal para la aplicación.
/// </summary>
[STAThread]
static void Main()
{
//ProtegerConfig.ProtegerConexion();
//ProtegerConfig.ProtegerVariables();
//ProtegerConfig.ProtegerConexionVariables();
Application.EnableVisualStyles();
Application.SetCompatibleTextRenderingDefault(false);
Application.Run(new frmPrueba());
}
}
}
Probar la aplicación que cifra el archivo de configuración
Primero ejecutamos la aplicación con los métodos comentados y se mostrará la figura:
Ingresar al directorio donde se crea el ejecutable de la aplicación: "Seguridad_AppConfig\bin\Debug\" y abrir con el bloc de notas el archivo de configuración: "Seguridad_AppConfig.exe.config" observar que esta igual como se definió al inicio (su tamaño es 1kb).
Parar la ejecución, descomentar la línea ProtegerConfig.ProtegerConexion(); del método Main(), grabar y compilar nuevamente. Ejecutar el exe desde fuera del Visual Studio, es decir el archivo: "Seguridad_AppConfig.exe" de la carpeta bin y observar el archivo de configuración, que ha cambiado (su tamaño es ahora 58 kb) y se ha cifrado la sección "connectionStrings".
Parar la ejecución, descomentar la línea ProtegerConfig.ProtegerVariables(); del método Main() y comentar la anterior, grabar y compilar nuevamente. Ejecutar el exe desde fuera del Visual Studio, es decir el archivo: "Seguridad_AppConfig.exe" de la carpeta bin y observar el archivo de configuración, que ha cambiado (su tamaño es ahora 58 kb) y se ha cifrado la sección "appSettings".
Finalmente, parar la ejecución, descomentar la línea ProtegerConfig.ProtegerConexionVariables(); del método Main() y comentar la anterior, grabar y compilar nuevamente. Ejecutar el exe desde fuera del Visual Studio, es decir el archivo: "Seguridad_AppConfig.exe" de la carpeta bin y observar el archivo de configuración, que ha cambiado (su tamaño es ahora 59 kb) y se ha cifrado ambas secciones "connectionStrings" y "appSettings".
Comentario Final
Aunque el demo es sobre WinForms, se puede usar el mismo código en todos los tipos de aplicaciones (ASP .NET WebForms, WPF, WCF, Workflow, etc) para cifrar el archivo de configuración usando un algoritmo asimétrico como RSA. Espero les sirva.
Descarga:
Demo08_Seguridad_AppConfig
El Libro del Día: JavaScript and JSON Essentials
El Libro del Día: 2014-07-01
Titulo: JavaScript and JSON Essentials
Autor: Sai Srinivas Sriparasa
Editorial: Packt
Nro Paginas: 120
Capítulos:
Chapter 1: JavaScript Basics
Chapter 2: Getting Started with JSON
Chapter 3: Working with Real-time JSON
Chapter 4: AJAX Calls with JSON Data
Chapter 5: Cross-domain Asynchronous Requests
Chapter 6: Building the Carousel Application
Chapter 7: Alternate Implementations of JSON
Chapter 8: Debugging JSON
Descarga:
JavaScript_JSON_Essentials
Titulo: JavaScript and JSON Essentials
Autor: Sai Srinivas Sriparasa
Editorial: Packt
Nro Paginas: 120
Capítulos:
Chapter 1: JavaScript Basics
Chapter 2: Getting Started with JSON
Chapter 3: Working with Real-time JSON
Chapter 4: AJAX Calls with JSON Data
Chapter 5: Cross-domain Asynchronous Requests
Chapter 6: Building the Carousel Application
Chapter 7: Alternate Implementations of JSON
Chapter 8: Debugging JSON
Descarga:
JavaScript_JSON_Essentials
lunes, 30 de junio de 2014
El Libro del Día: jQuery Mobile Web Development Essentials
El Libro del Día: 2014-06-30
Titulo: jQuery Mobile Web Development Essentials
Autor: Raymond Camden, Andy Matthews
Editorial: Packt
Nro Paginas: 243
Capítulos:
Chapter 1: Preparing Your First jQuery Mobile Project
Chapter 2: Working with jQuery Mobile Pages
Chapter 3: Enhancing Pages with Headers, Footers, and Toolbars
Chapter 4: Working with Lists
Chapter 5: Getting Practical – Building a Simple
Chapter 6: Working with Forms and jQuery Mobile
Chapter 7: Creating Modal Dialogs and Widgets
Chapter 8: Moving Further with the Notekeeper Mobile Application
Chapter 9: jQuery Mobile Configuration, Utilities, and JavaScript Methods
Chapter 10: Working with Events
Chapter 11: Enhancing jQuery Mobile
Chapter 12: Creating Native Applications
Chapter 13: Becoming an Expert – Building an RSS Reader Application
Descarga:
jQueryMobile_WebDevelopment_Essentials
Titulo: jQuery Mobile Web Development Essentials
Autor: Raymond Camden, Andy Matthews
Editorial: Packt
Nro Paginas: 243
Capítulos:
Chapter 1: Preparing Your First jQuery Mobile Project
Chapter 2: Working with jQuery Mobile Pages
Chapter 3: Enhancing Pages with Headers, Footers, and Toolbars
Chapter 4: Working with Lists
Chapter 5: Getting Practical – Building a Simple
Chapter 6: Working with Forms and jQuery Mobile
Chapter 7: Creating Modal Dialogs and Widgets
Chapter 8: Moving Further with the Notekeeper Mobile Application
Chapter 9: jQuery Mobile Configuration, Utilities, and JavaScript Methods
Chapter 10: Working with Events
Chapter 11: Enhancing jQuery Mobile
Chapter 12: Creating Native Applications
Chapter 13: Becoming an Expert – Building an RSS Reader Application
Descarga:
jQueryMobile_WebDevelopment_Essentials
viernes, 27 de junio de 2014
El Demo del Día: Comparación al Validar un Formulario con Javascript (Obstrusivo Vs No Obstrusivo)
Comparación al Validar un Formulario con Javascript (Obstrusivo Vs No Obstrusivo)
Cuando queremos enviar datos hacia el servidor a través de un formulario HTML, por ejemplo en ASP .NET Web Forms, necesitamos validar en el cliente los datos para lo cual debemos usar Javascript.
El método tradicional de Javascript usado era asociar una función a un evento de un control dentro del cuerpo del formulario, por ejemplo en el evento onclick de un botón. A este tipo de Javascript se le conoce como "Javascript Obstrusivo" y lo malo es que mezcla el diseño con el código.
Con la aparición de jQuery se habla mucho de "Javascript No Obstrusivo" que consiste en asociar una función a un evento de un control por código sin interferir en el HTML, pero esta técnica nace gracias a DOM Nivel 2 que incorpora los métodos addEventListener, que permiten asociar a un evento de un control una función Javascript explicita (con nombre) o anónima (sin nombre).
Para los que No conocen que es DOM, significa el Modelo de Objetos del Documento, por ejemplo, el DOM Nivel 1 tiene los objetos Document, Window, Browser y el DOM Nivel 2 el método "addEventListener()" que usaremos para asociar eventos en tiempo de ejecución, junto con el método "preventDefault()" para cancelar el envío del formulario en el click del botón.
Validación del Formulario WebForm con Javascript Obstrusivo
<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="Obstrusiva.aspx.cs" Inherits="Validacion.Obstrusiva" %>
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
<title></title>
<script>
function validarDatos() {
if (validarCampo("txtNombre", "Ingresa el Nombre") == false) return false;
if (validarCampo("cboCurso", "Seleccione el Curso") == false) return false;
return true;
}
function validarCampo(idControl, mensaje) {
var campo = document.getElementById(idControl);
if (campo != null) {
if (campo.value == "") {
alert(mensaje);
campo.focus();
return false;
}
}
else return false;
return true;
}
</script>
</head>
<body style="background-color:aqua">
<form id="form1" runat="server">
<div>
<h2>Validación Obstrusiva con Javascript</h2>
<h3>Registro de Alumnos</h3>
Nombre:
<asp:TextBox ID="txtNombre" runat="server" /><p />
Curso: <asp:DropDownList id="cboCurso" runat="server">
<asp:ListItem value="">Seleccione</asp:ListItem>
<asp:ListItem value="NET">NET</asp:ListItem>
<asp:ListItem value="Java">Java</asp:ListItem>
<asp:ListItem value="PHP">PHP</asp:ListItem>
</asp:DropDownList><p />
<asp:Button ID="btnEnviar" OnClientClick="return validarDatos();" Text="Enviar" runat="server" />
</div>
</form>
</body>
</html>
Nota: En el control Web "Button" se está asociando a la propiedad "OnClientClick" la función Javascript: "validarDatos()". Al devolver false la función no irá al servidor.
Validación del Formulario WebForm con Javascript No Obstrusivo
<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="NoObstrusiva.aspx.cs" Inherits="Validacion.NoObstrusivo" %>
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
<title></title>
<script type="text/javascript">
window.addEventListener("load", crearValidacion, false);
function crearValidacion() {
var btn = document.getElementById("btnEnviar");
btn.addEventListener("click", validarDatos, false);
function validarDatos(e) {
if (validarCampo("txtNombre", "Ingresa el Nombre",e) == false) return false;
if (validarCampo("cboCurso", "Seleccione el Curso",e) == false) return false;
return true;
}
function validarCampo(idControl,mensaje,e) {
var campo = document.getElementById(idControl);
if (campo != null) {
if (campo.value == "") {
alert(mensaje);
campo.focus();
e.preventDefault();
return false;
}
}
else return false;
return true;
}
}
</script>
</head>
<body style="background-color:aqua">
<form id="form1" runat="server">
<div>
<h2>Validación No Obstrusiva con Javascript</h2>
<h3>Registro de Alumnos</h3>
Nombre:
<asp:TextBox ID="txtNombre" runat="server" /><p />
Curso: <asp:DropDownList id="cboCurso" runat="server">
<asp:ListItem value="">Seleccione</asp:ListItem>
<asp:ListItem value="NET">NET</asp:ListItem>
<asp:ListItem value="Java">Java</asp:ListItem>
<asp:ListItem value="PHP">PHP</asp:ListItem>
</asp:DropDownList><p />
<asp:Button ID="btnEnviar" Text="Enviar" runat="server" />
</div>
</form>
</body>
</html>
Nota: En el código Javascript se asocia al evento "load" de la ventana (window) la función "crearValidacion()", la cual captura el botón y asocia a su evento "click" la función "validarDatos()". Para evitar enviar el formulario al servidor al estar vacío un campo se usa el método: "preventDefault()".
Comentario Final
En lo posible hay que usar Javascript No Obstrusivo para evitar mezclar el diseño con el código, ya sea usando jQuery o Javascript nativo. Actualmente, todos los navegadores soportan DOM Nivel 2 así es que el método "addEventListener" correrá sin problemas.
Descarga:
Validacion_WebForm_Javascript
Cuando queremos enviar datos hacia el servidor a través de un formulario HTML, por ejemplo en ASP .NET Web Forms, necesitamos validar en el cliente los datos para lo cual debemos usar Javascript.
El método tradicional de Javascript usado era asociar una función a un evento de un control dentro del cuerpo del formulario, por ejemplo en el evento onclick de un botón. A este tipo de Javascript se le conoce como "Javascript Obstrusivo" y lo malo es que mezcla el diseño con el código.
Con la aparición de jQuery se habla mucho de "Javascript No Obstrusivo" que consiste en asociar una función a un evento de un control por código sin interferir en el HTML, pero esta técnica nace gracias a DOM Nivel 2 que incorpora los métodos addEventListener, que permiten asociar a un evento de un control una función Javascript explicita (con nombre) o anónima (sin nombre).
Para los que No conocen que es DOM, significa el Modelo de Objetos del Documento, por ejemplo, el DOM Nivel 1 tiene los objetos Document, Window, Browser y el DOM Nivel 2 el método "addEventListener()" que usaremos para asociar eventos en tiempo de ejecución, junto con el método "preventDefault()" para cancelar el envío del formulario en el click del botón.
Validación del Formulario WebForm con Javascript Obstrusivo
<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="Obstrusiva.aspx.cs" Inherits="Validacion.Obstrusiva" %>
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
<title></title>
<script>
function validarDatos() {
if (validarCampo("txtNombre", "Ingresa el Nombre") == false) return false;
if (validarCampo("cboCurso", "Seleccione el Curso") == false) return false;
return true;
}
function validarCampo(idControl, mensaje) {
var campo = document.getElementById(idControl);
if (campo != null) {
if (campo.value == "") {
alert(mensaje);
campo.focus();
return false;
}
}
else return false;
return true;
}
</script>
</head>
<body style="background-color:aqua">
<form id="form1" runat="server">
<div>
<h2>Validación Obstrusiva con Javascript</h2>
<h3>Registro de Alumnos</h3>
Nombre:
<asp:TextBox ID="txtNombre" runat="server" /><p />
Curso: <asp:DropDownList id="cboCurso" runat="server">
<asp:ListItem value="">Seleccione</asp:ListItem>
<asp:ListItem value="NET">NET</asp:ListItem>
<asp:ListItem value="Java">Java</asp:ListItem>
<asp:ListItem value="PHP">PHP</asp:ListItem>
</asp:DropDownList><p />
<asp:Button ID="btnEnviar" OnClientClick="return validarDatos();" Text="Enviar" runat="server" />
</div>
</form>
</body>
</html>
Nota: En el control Web "Button" se está asociando a la propiedad "OnClientClick" la función Javascript: "validarDatos()". Al devolver false la función no irá al servidor.
Validación del Formulario WebForm con Javascript No Obstrusivo
<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="NoObstrusiva.aspx.cs" Inherits="Validacion.NoObstrusivo" %>
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
<title></title>
<script type="text/javascript">
window.addEventListener("load", crearValidacion, false);
function crearValidacion() {
var btn = document.getElementById("btnEnviar");
btn.addEventListener("click", validarDatos, false);
function validarDatos(e) {
if (validarCampo("txtNombre", "Ingresa el Nombre",e) == false) return false;
if (validarCampo("cboCurso", "Seleccione el Curso",e) == false) return false;
return true;
}
function validarCampo(idControl,mensaje,e) {
var campo = document.getElementById(idControl);
if (campo != null) {
if (campo.value == "") {
alert(mensaje);
campo.focus();
e.preventDefault();
return false;
}
}
else return false;
return true;
}
}
</script>
</head>
<body style="background-color:aqua">
<form id="form1" runat="server">
<div>
<h2>Validación No Obstrusiva con Javascript</h2>
<h3>Registro de Alumnos</h3>
Nombre:
<asp:TextBox ID="txtNombre" runat="server" /><p />
Curso: <asp:DropDownList id="cboCurso" runat="server">
<asp:ListItem value="">Seleccione</asp:ListItem>
<asp:ListItem value="NET">NET</asp:ListItem>
<asp:ListItem value="Java">Java</asp:ListItem>
<asp:ListItem value="PHP">PHP</asp:ListItem>
</asp:DropDownList><p />
<asp:Button ID="btnEnviar" Text="Enviar" runat="server" />
</div>
</form>
</body>
</html>
Nota: En el código Javascript se asocia al evento "load" de la ventana (window) la función "crearValidacion()", la cual captura el botón y asocia a su evento "click" la función "validarDatos()". Para evitar enviar el formulario al servidor al estar vacío un campo se usa el método: "preventDefault()".
Comentario Final
En lo posible hay que usar Javascript No Obstrusivo para evitar mezclar el diseño con el código, ya sea usando jQuery o Javascript nativo. Actualmente, todos los navegadores soportan DOM Nivel 2 así es que el método "addEventListener" correrá sin problemas.
Descarga:
Validacion_WebForm_Javascript
Suscribirse a:
Entradas (Atom)