Métodos Ajax [POST/GET] uso en MVC C#

Definición ( código fuente ejemplo )

AJAX, acrónimo de Asynchronous JavaScript And XML (JavaScript asíncrono y XML), es una técnica de desarrollo web para crear aplicaciones interactivas o RIA (Rich Internet Applications). Estas aplicaciones se ejecutan en el cliente, es decir, en el navegador de los usuarios mientras se mantiene la comunicación asíncrona con el servidor en segundo plano. De esta forma es posible realizar cambios sobre las páginas sin necesidad de recargarlas, mejorando la interactividad, velocidad y usabilidad en las aplicaciones.

Link artículo

Ejemplo métodos POST/GET:

Client-Side:

<h1>Ajax/POST</h1>

Ingrese el valor para enviar al servidor via ajax:<br />

<input id="idInputPost" type="text" />

<div id="idMethodAjaxPost">Clic aquí método <b>POST</b> ajax</div>

<div id="UserMsjPost"></div>

<hr />

<h1>Ajax/GET</h1>

Ingrese el valor para enviar al servidor via ajax:<br />

<input id="idInputGet" type="text" />

<div id="idMethodAjaxGet">Clic aquí método <b>GET</b> ajax</div>

<div id="UserMsjGet"></div>

<script type="text/javascript">

    function ajax_get_method(path, name, labelId, parameterValue) {

        $.ajax({

            type: "GET",

            cache: false,

            url: path,

            data: { name: parameterValue },

            contentType: "application/json; charset=utf-8",

            dataType: "json",

            success: function (data) {

                $("#" + labelId + "").html(data);

            },

            error: function () {

                //alert('Por favor intente de nuevo.');

            }

        });

    }

    function ajax_post_method(path, parameterName, targetId, parameterValue) {

        $.ajax({

            type: "POST",

            cache: false,

            url: path,

            data: '{"' + parameterName + '": "' + parameterValue + '" }',

            contentType: "application/json; charset=utf-8",

            dataType: "json",

            success: function (data) {

                $("#" + targetId + "").html(data);

            },

            error: function () {

                //alert('Por favor intente de nuevo.');

            }

        });

    }

    $(document).ready(function () {

        $("#idMethodAjaxPost").click(function () {

            ajax_post_method("/Home/AjaxPostMethod", "name", "UserMsjPost", $("#idInputPost").val());

        });

        $("#idMethodAjaxGet").click(function () {           

            ajax_get_method("/Home/AjaxGetMethod", "name", "UserMsjGet", $("#idInputGet").val());

        });

    });

    

</script>

Sserver-Side:

        [HttpPost]

        public JsonResult AjaxPostMethod(string name)

        {

            return Json(name);

        }

        public ActionResult AjaxGetMethod(string name)

        {

            return Json(name, JsonRequestBehavior.AllowGet);

        }




------------------------------

https://stackoverflow.com/questions/25050240/ajax-post-parameter-is-always-null-in-mvc-app

Ajax Post Parameter is Always Null in MVC app

You can append the parameter like:

var targeturl = '@Url.Action("Test", "Controller")?id=' + ID;

$.ajax({
    url: targeturl,
    type: "GET",
    success: function(data) { },
    error: function (data) { }
});

Or you may use the jQuery ajax data parameter directly:

$.ajax({
  type: "POST",
  url: '@Url.Action("Test", "Controller")',
  data: { id: "your-id" }
})
  .done(function( msg ) {
    alert( "Data Saved: " + msg );
  });

References: http://api.jquery.com/jquery.ajax/

shareimprove this answer

-------------------------------

Enviar Modelo

Javascript Client side:

     var dataPost = { Nombre: 'titel', Apellido: 'msg' };

            jQuery.ajax({
                type: "POST",
                url: "/DatosIniciales/AjaxMethod",
                data: dataPost,
                dataType: "json",
                success: function (result) {
                    alert("Data Returned: ");
                }
            });

C# Server side method:

 [HttpPost]
        public JsonResult AjaxMethod(Minion minion)
        {
            //person.DateTime = DateTime.Now.ToString();

            return Json("");

        }

-------

function cargarMenuItems() {

    
    var sucessResponse = function (data) {
        debugger
    };

    var errorResponse = function (data) {
        debugger
    };



    ajaxMethod("/Home/CargarMenuItems", null, sucessResponse, errorResponse);

}

function ajaxMethod(path, model, successResponse, errorResponse) {

    jQuery.ajax({
        type: "POST",
        cache: false,
        url: path,
        data: model,
        dataType: "json",
        success: function (data) {
            successResponse(data);
        },
        error: function (data) {
            errorResponse(data);
        }
    });

}