Ajax JQuery Paginas Parciales con ASP.NET MVC y Visual Studio 2015

Cuando HTTP fue construido en la década de 1990, fue para un tipo de cliente muy específico: navegadores web. Antes de la creación de JavaScript en 1995, HTML utilizaba dos de las tres métodos HTTP HTTP 1.0: GET y POST.

Con el método GET generalmente se invocan mediante la introducción de un URI en la barra de direcciones o en las clases de hipertexto referencias como .img y escritura de etiquetas. Es decir estaba en su pleno auge el lenguaje de marcado.

Por ejemplo, con la siguiente url

http://localhost:70486/api/flights/

Se generaba la siguiente petición GET invocada por un Web Browser:

GET http://localhost:70486/Locations HTTP/1.1

Accept: text/html, application/xhtml+xml, */*

Accept-Language: en-US,en;q=0.7,he;q=0.3

User-Agent: Mozilla/5.0 (compatible; MSIE 10.0; Windows NT 6.2; WOW64; Trident/6.0)

Accept-Encoding: gzip, deflate

Host: localhost:70486

DNT: 1

Connection: Keep-Alive

Otra forma de iniciar las solicitudes HTTP de un navegador fue utilizando formularios HTML los cuales permitian a los usuarios enviar una nueva ubicación en el servidor desde un navegador web, generando una solicitud POST.

El mecanismo más flexible para empezar HTTP desde un navegador fue utilizando JavaScript.

JavaScript proporciona dos capacidades principales que son los pilares o técnicas basadas en el navegador:

Control completo de solicitudes HTTP (incluyendo método HTTP, cabeceras y cuerpo).
Asynchronous JavaScript y XML (AJAX). Utilizando AJAX, pueden enviarse solicitudes desde el cliente sin esperar que el navegador complete la carga de una pagina HTML.

Basado en el resultado de las llamadas, puedes utilizar JavaScript para actualizar partes de la página HTML.

Mas tarde nacio JQuery una de las librerías JavaScript más populares en existencia y sigue siendo un proyecto Open Source. Puedes encontrar las últimas descargas, documentación y plugins en jquery.com. Al crear una aplicación con la plantilla ASP.NET MVC tendrás por defecto la última versión de esta librería, incluso con Nuget.

Lo mejor de todo, es que jQuery es compatible con todos los navegadores modernos (incluido Internet Explorer, Firefox, Safari, Opera y Chrome).

JQuery simplifica la adición de JavaScript a las páginas HTML y ayuda a reducir la cantidad de código que debe escribir para realizar tareas como acceder y modificar los elementos HTML de una página web. Además puedes agregar funcionalidad Ajax para realizar llamadas hacia el servidor.

AJAX es un modelo de desarrollo que nos permite actualizar parcialmente segmentos de página de manera asíncrona sin tener que volver a recargar la página. Los datos transferidos entre el cliente y el servidor son generalmente XML o JSON (JavaScript Object Notation). AJAX es una tecnología útil a tener en cuenta al diseñar una aplicación ASP.NET MVC. Uno de los ejemplos más comunes de AJAX en uso es una caja de búsqueda. Cuando un usuario comienza a escribir datos en el cuadro de búsqueda, aparece un menú desplegable con los resultados.

Una característica del framework ASP.NET MVC que más me gusta son las vistas parciales, y lo mejor de todo es que podemos usarlas en conjunto con AJAX de una manera realmente simple, ya que ofrece Helpers mediante la adición del espacio de nombres System.Web.MVC que permiten con extensiones realizar tareas comunes.

Microsoft incluye una característica en ASP.NET llamado actualizaciones parciales de página que funciona junto con AJAX para reducir la necesidad de actualizar una página web entera, cada vez que se produce una actualización.

Si tienes curiosidad por saber como es el código que he utilizado en esta demo, lo puedes descargar desde mi GitHub.

Espero que te halla gustado este post,

Hasta la próxima!