Pass an array to MVC Controller from ajax

Question

0.00/5 (No votes)

See more:

Hi,
I am trying to pass a JS array to a MVC Controller. By using the same code i was able to do the same for API Controller. But i am not able to do the same using MVC Controller.

Can anyone please help

This is the JS side

JavaScript

function GetColumnmappingValue() {
    var columnMappings = [];
    var count = 0;
    $('.row').each(function () {
        if (count > 0) {
            var sourceColumn = "";
            var destinationColumn = "";
            var sourceColumnIndex = "";

            $(this).find(".column").each(function () {

                var input = $(this).find("select").each(function (i) {
                    if (sourceColumn == "") {
                        sourceColumn = $(this).find("option:selected").text();
                        sourceColumnIndex = $(this).find("option:selected").val();
                    }
                    else {
                        destinationColumn = $(this).find("option:selected").text();
                    }
                });
            });

            //if (sourceColumn.toLowerCase() != "select" && destinationColumn.toLowerCase() != "select")
            columnMappings.push({ SourceColumnIndex: sourceColumnIndex, SourceColumn: sourceColumn, DestinationColumn: destinationColumn });
        }
        count++;
    });


    $.ajax({
        type: "POST",
        url: "/ExcelImport/SaveMappings",
        data: { '': columnMappings },
        dataType: "json",
        success: function () { alert("Mapping Successful") },
        failure: function () { alert("not working..."); }
    });

}

and this is the controller

C#

[HttpPost]
        public IEnumerable<ColumnMapping> SaveMappings(IEnumerable<ColumnMapping> columnMappings)
        {
            // do some registration work
            CreateXML(columnMappings);
            return columnMappings;
        }

The problem is that i am getting the array count , but all values inside it are null ..

Thanks
Arjun Menon

Posted 29-Oct-14 4:25am

Arjun Menon U.K

Updated 28-Mar-23 17:31pm

Add a Solution

3 solutions

Solution 2

JavaScript

var Mapping= new Object();
Mapping.Column1= "EmployeeID";
Mapping.Column2= "Name";
Mapping.Column3= "Salary";


var param = new Object();
paramArray.columnMappings= new Array();
paramArray.columnMappings.push(Mapping);

$.ajax({
        type: "POST",
        url: "/ExcelImport/SaveMappings",
        data: JSON.stringify(paramArray),
        dataType: "json",
        contentType: "application/json; charset=utf-8",
        success: function () { alert("Mapping Successful") },
        failure: function () { alert("not working..."); }
});

Posted 10-Nov-14 23:33pm

Sachin__Sharma

Updated 10-Nov-14 23:34pm

v2

Solution 3

can this work i want to send list data from mvc view to controler for insert if any sugestaion plz replay

function save(CART_NO, CATRIDGE) {
alert('hi');
var daten = {
CART_NO: 100,
CATRIDGE: 'Aman'
}
$.ajax({
type: 'post',
url: '@Url.Action("saveDetails", "Home")',
data: JSON.stringify(daten),
dataType: "json",
contentType: 'application/json',
success: function (response) {
alert("succese");
},
failure: function (response) {
},
error: function (response) {
},
});
}

[HttpPost]
public JsonResult saveDetails(Catridges_Model Catridges_Model)
{
var Result = service.saveDetailsCheckWise(Catridges_Model);
return Json(Result, JsonRequestBehavior.AllowGet);

}

Posted 28-Mar-23 17:31pm

Member 15964607

Add a Solution

Add your solution here

Treat my content as plain text, not as HTML

Preview 0

…

Existing Members

Sign in to your account

...or Join us

Download, Vote, Comment, Publish.

Your Email
Password
Forgot your password?

Your Email
This email is in use. Do you need your password?
Optional Password

I have read and agree to the Terms of Service and Privacy Policy
Please subscribe me to the CodeProject newsletters

When answering a question please:

Read the question carefully.
Understand that English isn't everyone's first language so be lenient of bad spelling and grammar.
If a question is poorly phrased then either ask for clarification, ignore it, or edit the question and fix the problem. Insults are not welcome.
Don't tell someone to read the manual. Chances are they have and don't get it. Provide an answer or move on to the next question.

Let's work to help developers, not make them feel stupid.

This content, along with any associated source code and files, is licensed under The Code Project Open License (CPOL)

Nathan Minier · Accepted Answer · 2014-10-30T01:21:00

You're seeing those results because MVC uses Newtonsoft to deserialize. It's aware than an array is there, but it doesn't know how to assign values because the object key is being mapped to null.

This should work fine if you fix the JSON:

JavaScript

$.ajax({
           type: "POST",
           url: "/ExcelImport/SaveMappings",
           data: { columnMappings: columnMappings },
           dataType: "json",
           success: function () { alert("Mapping Successful") },
           failure: function () { alert("not working..."); }
       });

This works in my jquery powered MVC implementations.

Pass an array to MVC Controller from ajax

3 solutions

Solution 1

Solution 2

Solution 3

Add your solution here

Preview 0

Existing Members

...or Join us