Hola buenas tardes, el siguiente ejemplo vamos a usar jQuery (Framework hecho en javaScript) en VisualStudio 2008, le vamos a poner un efecto al realizar una consulta, que se mostrará en una grilla mediante un tipo de persona que elijamos, para eliminar el POSTBACK no usaremos AJAX sino llamadas CALLBACK.

Comenzamos con el ejemplo

Paso 01: Copiamos el js jQuery a nuestro proyecto

Paso 02: Para éste ejemplo vamos a usar un DropDownList y un Gridview, estos lo arrastramos hacia nuestra pantalla

Paso 03: Ahora a la grilla la ponemos dentro de un “div” y su ID le pondremos “datosCliente”

Paso 04: Ahora usaremos los metodos JQuery, en éste ejemplo el efecto de ocultar y mostrar, creamos la funcion “Obtienedatos”, y usaremos HIDE (el div se ocultará en 1 milisegundo) y SHOW (el div se mostrara el 1 segundo), eso hacemos para cuando elijamos una opción primero nos oculte el div que contiene la grilla y de ahi nos muestre la grilla con los datos cargados.

Paso 05: Ahora implememtamos la interfaz “ICallBackEventHandler”, luego implementamos el método “RaiseCallbackEvent” y “GetCallbackResult”. Para recuperar los resultados del callback, se debe agregar lógica del lado del cliente (en el método “RaiseCallbackEvent” es donde se encuentra el metodo para cargar la grilla), para invocar el evento que hará la llamada al servidor.

Paso 06: Luego escribir el método(function”llamarServidor”) en JavaScript para procesar el resultado del Callback (click para agrandar la imagen).

Paso 07: Ahora si nuestro ejemplo esta terminado, compilamos y vemos q nos carga un DropDownList(por defecto nos muestra “–seleccionar–”), con opciones de busqueda LOS PAGANTES y los NO PAGANTES, dependiendo de en la grilla nos mostrara la informacion

Paso 08: En este ejemplo eligiremos NO PAGANTE, y vemos que la grilla se cargara mostrandonos los resultados de arriba hacia abajo, ese el efecto que le dio JQUERY:

Como vemos hemos hecho un ejemplo evitando el postback mediante CALLBACK y haciendo que la grilla se nos cargue dinamicamente mediante jquery.

PD: En la misma carpeta donde esta el ejemplo les adjunto backup de la BD (sqlServer 2008).

Saludos =)

Descarga | Aplicación de Ejemplo

→ Entradas Relacionadas:

1. Visual Studio 2010 – Callback – Jquery
2. Visual Studio 2010 – Validación JQuery vía Callback
3. GoogleMaps con Visual Studio 2008 (C#) – Parte 02
4. GoogleMaps con Visual Studio 2008 (C#) – Parte 01
5. TUTORIAL: Como Instalar Ubuntu 10.04 sin formatear Windows