Passing List of KeyValuePair or IDictionary to Web Api Controller from Javascript

Question

I have a web api controller to which I would like to post two parameters. One is a flat int ID, and the other is an IDictionary or similar equivalent.

[HttpPost]
public void DoStuff(int id, [FromBody]IDictionary<int, int> things)
{
}

var things = new Array();
things.push({ 1: 10 }); // tried things.push({ Key: 1, Value: 10 })
things.push({ 2: 11 });
$.ajax({
    url: '/api/DoStuff?id=' + id,
    data: '=' + JSON.stringify(things), // tried what seems like 100 different things here
    type: 'POST',
    dataType: 'json'
});

No matter what I try in the data param (data: things, data: '=' + things), the Dictionary does not come through to the api controller. It is either null or has one bogus entry ({0, 0}).

I have also tried to send the Dictionary in the Uri - no go.

How can I send the dictionary or key value pair to the api controller?

Answer 1

You don't need an array - you need a simple JS object (which maps to a dictionary). This code should work:

var things = {};
things['1'] = 10;
things['2'] = 11;
$.ajax({
    url: '/api/DoStuff?id=' + id,
    data: JSON.stringify(things),
    contentType: 'application/json'
    type: 'POST',
    dataType: 'json'
});

Answer 2

This one worked for me:

var settings = [];
settings.push({ key: "setting01", value: "Value01" });
settings.push({ key: "setting02", value: "Value02" });