Passing JSON to Controller MVC3 C# .NET

Question

I´m trying to pass my data(json) from view through ajax to my controller but this arrive null. Thanks in advance fro any help or suggestion.

This is my model.

public class TipificacionModel
{
    public int Existente { get; set; }
    public string Campo { get; set; }
    public int Regla { get; set; }

}

public class ListasSeleccionModel{
    public List<string> DatosSeleccion { get; set; }
}

public class ListaTipificaciones
{
    public string NombreCampaña { get; set; }
    public List<TipificacionModel> Tipificacion { get; set; }
}

public class DatosSeleccionMultiple
{
    public List<String> Columnas { get; set; }
    public List<ListasSeleccionModel> ListasSeleccion { get; set; }
}

public class TipificacionGeneralCampaña
{
    public ListaTipificaciones CamposCreados { get; set; }
    public List<DatosSeleccionMultiple> ListasDeSeleccion { get; set; }

}

This is my ajax function.

        jsonListaGeneral = [];

        jsonListaGeneral.push(jsonTipificacion);
        jsonListaGeneral.push(jsonListasSeleccion);

        console.log(jsonListaGeneral);

        $.ajax({
            url: '@Url.Action("crearCampManual", "DPS")',
            type: 'post',
            data: JSON.stringify(jsonListaGeneral),
            contentType: 'application/json; charset=utf-8;',
            dataType: 'json',
            success: function (response) {
                alert(response)
                return;
            },
            error: function (x) {
                alert(x.responseText);
            }
        });

This is my controller.

    [HttpPost]
    public ActionResult crearCampManual(TipificacionGeneralCampaña model)
    { //Here the model value is null, why?}

When i print the json in my browser console everything is good. But something bad happends, im making something wrong.

Console Browser

Break Point Controller

Answer 1

One issue is that the data you are sending through your AJAX call appears to be an Array:

jsonListaGeneral = [];

But your C# model isn't an array or collection:

public ActionResult crearCampManual(TipificacionGeneralCampaña model)

If you are sending an array of TipificacionGeneralCampaña objects from your AJAX to your C# Controller, then you would want your Controller definition to look like this:

public ActionResult crearCampManual(List<TipificacionGeneralCampaña> model)

And also to reiterate what @Hackereman stated in his comment, you do not need to use the JSON.Stringify function on your data before you pass it to your Controller:

$.ajax({
        url: '@Url.Action("crearCampManual", "DPS")',
        type: 'post',
        data: jsonListaGeneral,
        contentType: 'application/json; charset=utf-8;',
        dataType: 'json',
        success: function (response) {
            alert(response)
            return;
        },
        error: function (x) {
            alert(x.responseText);
        }
    });

Another issue that I noticed from your Console Browser screenshot: you seem to be adding two different objects to the same JSON array before sending to your controller:

    jsonListaGeneral.push(jsonTipificacion);
    jsonListaGeneral.push(jsonListasSeleccion);

When creating a collection in C#, all objects in the collect need to be of the same type, meaning that they have the same Property Names and Property Types.

With how your C# Controller is currently setup, it will accept a JSON object that is structured like this:

{
    CamposCreados : {
        NombreCampaña : "",
        Tipificacion : [
            {
                Existente  : 0,
                Campo : "",
                Regla : 0
            },
            {
                Existente  : 1,
                Campo : "",
                Regla : 1
            }
        ]
    }
    ListasDeSeleccion : [
        {
            Columnas : "",
            ListasSeleccion : [
                {
                    DatosSeleccion : [
                        {
                            "",
                            "",
                            ""
                        }
                    ]
                },
                {
                    DatosSeleccion : [
                        {
                            "",
                            "",
                            ""
                        }
                    ]
                }
            ]
        }
    ]
}

Answer 2

The solution is change the declaration of the Json Object.

var jsonListaGeneral = {
    "CamposCreados": jsonTipificacion,
    "ListasDeSeleccion": jsonListasSeleccion
}