Ir al contenido principal

AJAX, El complemento perfecto. Parte 2


En esta segunda parte de AJAX, El complemento perfecto, les mostrare como trabajar AJAX desde javascript, haciendo uso de los pagemethods.
Esto permite llamar metodos que se encuentren en el servidor desde javascript sin refrescar la pagina, asi lograremos trabajar asincronamente y daremos mucha mas funcionalidad a nuestra aplicacion.
El proceso es muy sencillo y puedes modificarlo de acuerdo a tus necesidades.
Para que esto sea posible necesitaremos un ScriptManager en la pagina con la propiedad:
EnablePageMethods en True.

<asp:ScriptManager ID="ScriptManager1" 
    EnablePageMethods="true" 
    EnablePartialRendering="true" runat="server" />

Ahora el siguiente paso sera agregar el codigo JavaScript haciendo el llamado a la funcion que tenemos en el servidor, y esto se hace llamando el metodo como si estuviera localmente pero anteponiendole PageMethods, y para obtener el valor devuelto por la funcion en el servidor, agregaremos un parametro al metodo pero solo en el javascript. Este parametro sera el nombre de una funcion javascript que recibira un parametro y el valor de ese parametro sea el valor devuelto por el servidor.
El codigo quedaria asi:

<script>
     function test() {
            PageMethods.MiMetodo("Jairo Ortiz",fncorrecto);
        }

        function fncorrecto(status) {
            alert(status);
        }
</script>

Aqui estamos llamando al metodo "MiMetodo" que esta en el servidor y le anteponemos la palabra PageMethods seguida de un punto. Esto se hace con el fin de decirle a ajax que ese metodo se encuentra en el servidor y que lo llame.
Ademas le decimos que el valor retornado se procesara en la funcion fncorrecto.
La funcion fncorrecto recibe un parametro el cual es el return de la funcion en el servidor, este parametro es invisble en MiMetodo.

Acontinuacion vamos a crear la funcion en el servidor, la cual tendra que ser Public Static y tendra arriba el  atributo  [WebMethod]. para esto tendras que agregar el espacio de nombres:
using System.Web.Services
Y el codigo del lado del servidor quedaria asi:

[WebMethod]
public static string MiMetodo(string nombre)
{
    return "Hola " + nombre;
}  

La funcion test podremos llamarla desde cualquier parte de nuestra pagina como por ejemplo en un elemento <a>:

<a href="#" onclick="test();">Aqui se devuelve el nombre</a> 

Aqui les dejo la aplicacion de ejemplo:

Ajax - WebMethods

Quedo atento a sus comentarios. :)

Comentarios

  1. Excelente articulo! Gracias! esperamos mas para ajax .net avanzado ;)

    ResponderEliminar

Publicar un comentario

Entradas populares de este blog

Guía completa de .NET MAUI para el desarrollo de aplicaciones móviles multiplataforma

Guía completa de .NET MAUI para el desarrollo de aplicaciones móviles multiplataforma ⏱️ Tiempo de lectura: 30 minutos 🎯 Nivel: Intermedio ¡Prepárate para revolucionar el desarrollo móvil! Descubre .NET MAUI, el marco multiplataforma que te permite crear aplicaciones nativas para iOS, Android y escritorio con una sola base de código. Adéntrate en los fundamentos, implementaciones prácticas, ejemplos avanzados y mejores prácticas para dominar .NET MAUI y llevar tus habilidades de desarrollo móvil al siguiente nivel. 📑 Contenido del Artículo Introducción a .NET MAUI para móviles Fundamentos y Conceptos Clave Arquitectura de .NET MAUI ...

🔥 Microservicios con .NET: Guía Definitiva para Principiantes y Desarrolladores Intermedios

🔥 Microservicios con .NET: Guía Definitiva para Principiantes y Desarrolladores Intermedios ⏱️ Tiempo de lectura: 15 minutos 🎯 Nivel: Intermedio ¡Prepárate para sumergirte en el fascinante mundo de los microservicios con .NET! Esta guía integral te equipará con los conocimientos esenciales y las técnicas prácticas que necesitas para dominar esta arquitectura moderna. Tanto si eres un principiante que busca una base sólida como un desarrollador experimentado que busca ampliar tus habilidades, este artículo te guiará paso a paso a través de los conceptos fundamentales, la implementación y los mejores prácticas de los microservicios. 📑 Contenido del Artículo 🚀 Introducción a los Microservicios con .NET 💡 Fundamentos y Conceptos Clave ¿Qué son los Microservicios? Ventajas de los Microservicios Desafíos de los Microservicios ...

🚀 Domain-Driven Design (DDD): Guía Completa para Desarrolladores

🚀 Domain-Driven Design (DDD): Guía Completa para Desarrolladores ⏱️ Tiempo de lectura: 30 minutos 🎯 Nivel: Intermedio ¡Sumérgete en el mundo de Domain-Driven Design (DDD) y descubre cómo modelar tu dominio de manera efectiva para crear software flexible y mantenible! Este artículo te guiará a través de los fundamentos, la implementación práctica y las mejores prácticas de DDD. 📑 Contenido del Artículo Introducción a Domain-Driven Design (DDD) Fundamentos y Conceptos Clave Conceptos Clave de DDD Principios de DDD Patrones de DDD Implementación Práctica Implementando DDD en Diferentes Lenguajes Herramientas para DDD ...