JSON y MVC 3

Supongamos que tenemos una aplicación web y necesitamos recuperar valores de servidor o actualizar a una BD desde la parte del cliente, para este caso podríamos usar JSON. Con JSON podemos ir al servidor de una manera síncrona ó asíncrona y recuperar cualquier valor, tanto como variables y objetos o efectuar cualquier operación que se pueda realizar del lado del servidor. Eso si tenemos que tener cuidado al querer traer objetos con mucha información ya que JSON funciona muy bien, pero si te quieres traer una lista de 2000 objetos (por poner un número =P )...vas a sufrir, para ese caso podrias hacer el uso de un PartialView en MVC por darte un ejemplo !

Pues al lío !  Lo primero que tenemos que hacer es importar Jquery en nuestra página:

<script src="@Url.Content("~/Scripts/jquery-1.5.1.min.js")" type="text/javascript"></script>

En mi caso tengo el 'jquery-1.5.1.min.js' dentro de la carpeta Scripts y estoy usando MVC 3 con RazorEngine pero si estas usando un webForm puedes hacerlo de la siguiente manera:

<script src="/Scripts/jquery-1.5.1.min.js" type="text/javascript"></script>

A continuación llamamos a la función JSON. En mi ejemplo mostraremos un 'alert' con un mensaje que será traido desde el servidor cada vez que se inicializa la página.

Para los que no conocen jquery, eh aquí la explicación:

    (function ($) {
        FunctionJson();
    })(jQuery);

Llamamos a 'function ($)' que es una función que se ejecuta cada vez que se inicializa la página. En este ejemplo, esta función llama a la función FunctionJson en la cual está la llamada json:

   
           $.ajax({
                async: false,
                url: '/Home/RetornaValores',
                dataType: 'json',
                data: { },
                type: "POST",
                cache: false,
                success: function (data) {
                    if (data.ok) {
                        alert(data.mensaje);
                    }
                    else {
                        alert(data.mensaje);
                    }
                }
            });

Donde la llamada json tiene los siguientes parámetros:

• async: que indica si la función va a ser asíncrona o no.
• url: donde se indica la url que tiene el webMethod (para un webForm) o el controlador (para MVC).
• data: aqui se establecen los parámetros si la función del webMethod o del controlador tiene parámetros.
• type: se establece el tipo de llamada 'POST' o 'GET'.
• cache: si la función almacenará en caché.
• success: devuelve el resutado de la operación.

En nuestro caso la funcion JSON llama a la función 'RetornaValores' del controller 'Home'

    public JsonResult RetornaValores()
        {
            try
            {
                return Json(new { ok = true, mensaje = "Hola Mundo" }, JsonRequestBehavior.AllowGet);
            }
            catch (Exception ex)
            {
                return Json(new { ok = false, mensaje = ex.Message }, JsonRequestBehavior.AllowGet);
            }
        }

La función devuelve un objeto Json en el cual le podemos setear los valores que queramos. Si se fijan tambien podriamos manejar los errores de está manera. El resultado final sería el siguiente:

Esta claro que se puede hacer lo que quiera dentro de la función RetornaValores y devolver lo que se nos de la gana, pero siempre teniendo cuidado del tiempo de respuesta y el peso que se quiere devolver a la parte cliente. Nos vemos !!