CODEWITHSUNDEEP
javascriptajaxasp.net-mvc
Percy
Percy

Reputation: 3115

passing an array of int to MVC controller using ajax javascript

What am I doing wrong here?

I can successfully pass 4 bool params to a controller. Now I want to pass an array of int to my controller but it doesn't work - I've left my working code in the example(commented out) so you can see I'm not changing that much - I think I'm missing something simple (it is 17:44 afterall!!!). I can see the array is populated using the alert(rolesChecked); statement:

var rolesChecked = [];
$('[type="checkbox"].role-checkbox').each(function () {
    if (this.checked)
    {
        rolesChecked.push($(this).val());
    }
});

alert(rolesChecked);

//var administrator = $('#cbAdministrator').is(":checked");
//var manager = $('#cbManager').is(":checked");
//var technician = $('#cbTechnician').is(":checked");
//var transcriber = $('#cbTranscriber').is(":checked");

if (rolesChecked.count > 0){//administrator || manager || technician || transcriber) {
    $.ajax({
        url: '@Url.Action("GetFutureHolidays", "Employee")',
        type: 'GET',
        dataType: 'json',
        // we set cache: false because GET requests are often cached by browsers
        // IE is particularly aggressive in that respect
        cache: false,
        data: {
            roleIdXXXs: rolesChecked
            //includeAdministrator: administrator,
            //includeManager: manager,
            //includeTechnician: technician,
            //includeTranscriber: transcriber
        },
        success: function (data) {

            //do something...
        }
    });
}

Controller Action:

public string GetFutureHolidays(List<int> roleIdXXXs)//bool includeAdministrator, bool includeManager, bool includeTechnician, bool includeTranscriber)
{
    //do something
}

with the old code, the controller action would be hit... with the array, it never gets hit... What am I missing here...

also, I think List<int> roleIdXXXs should be fine, but I also tried List<string>, int[] and string[] in case it isn't!!!

Upvotes: 6

Views: 11900

Answers (4)

user3559349
user3559349

Reputation:

You need to add the traditional: true ajax option to post back an array to the collection

$.ajax({
    url: '@Url.Action("GetFutureHolidays", "Employee")',
    type: 'GET',
    dataType: 'json',
    cache: false,
    data: { roleIdXXXs: rolesChecked },
    traditional: true, // add this
    success: function (data) {
    }
});

Refer also the answer to this question for more detail on what the options does and the form data it generates.

Upvotes: 18

Varun Vasishtha
Varun Vasishtha

Reputation: 461

You can't submit a list like this from Ajax, the quickest fix in the process you are using is to use serialization-desalinization process, you can send it as

roleIdXXXs: JSON.stringify(rolesChecked)

on Action:

public ActionResult GetFutureHolidays(string rolesChecked)
{
    var test = new JavaScriptSerializer().Deserialize<List<int>>(rolesChecked);
}

Upvotes: 1

JB06
JB06

Reputation: 1931

In your if statement, instead of rolesChecked.count, use rolesChecked.length

Upvotes: 1

TitusCln
TitusCln

Reputation: 107

You should use JSON.stringify() on you AJAX call lice this:

data: {
            roleIdXXXs: JSON.stringify(rolesChecked)
            //includeAdministrator: administrator,
            //includeManager: manager,
            //includeTechnician: technician,
            //includeTranscriber: transcriber
        }

Upvotes: 0

Related Questions