Passing key-value pair array to Controller action in .NET

Question

I have a key-value pair through which I send down values like this:

   $(document).on('click', '.chkAll', function () {
        $("#tableProducts thead tr th input:checkbox").change(function () {
            $(".chkItem").prop('checked', $(this).prop("checked"));
            if ($(this).prop('checked')) {
                $('tbody tr td input[type="checkbox"]').each(function () {
                    product_ids[$(this).attr('id')] = "Checked";
                    productLocation[$(this).attr('id')] = $(this).attr('location');
                });
            } else {
                $('tbody tr td input[type="checkbox"]').each(function () {
                    delete product_ids[$(this).attr('id')];
                    delete productLocation[$(this).attr('id')];
                });
            }
        });

And this is how I post all the keys into the .NET MVC Action:

values: Object.keys(product_ids)

And fetching it in Controller:

public ActionResult GetValues(List<string> values)
{
// now I have all the keys here but now I'd like values as well...
}

The way I imagine this to be done is by passing down the entire name-value pair array directly into the function and then fetching it, so that then I'd have:

// key (product id) => 0124914815DD29
// value => checked

Both strings ...

I've tried by doing simply like this:

values: product_ids // in jquery post

And then fetching the value like this:

public ActionResult GetValues(Dictionary<string,string> values)
{
// but now the values dictionary is always empty
}

How can I do this?

Edit:

This is the part where the data is posted:

$(".btnAnalyze").click(function () {
            if (jQuery.isEmptyObject(product_ids) == true) {
                ShowMessage("You haven't selected any product!");
                return;
            }
            else {
                var guid = '@Guid.NewGuid()'
                var postData = { values: Object.keys(product_ids), drange: $('.range').val(), ID: guid, type: $('input[name=type]:checked').val(), shipping: $('input[name=shipping]:checked').val(), condition: $('input[name=condition]:checked').val(), minprice: $('.txtmin').val(), maxprice: $('.txtmax').val(), Title: $('.txtSearch').val(), negative: $('.txtNegativeKeywords').val(),locations: productLocation };
                $.ajax({
                    type: "POST",
                    url: "/Analyze/GetAllProducts",
                    data: postData,
                    success: function (data) {
                        if (data == "Error") {
                            alert("Something went wrong");
                        } else if (data=="Ok"){
                            window.location.href = '/Analyze/Index/' + guid // redirect to another page
                        }
                    },
                    dataType: "json",
                    traditional: true
                });
            }
        });

And mapped header of the Action:

  [HttpPost]
        public async Task<JsonResult> GetAllProducts(List<string> values, string drange, string ID, string type, string shipping, string condition, string minprice, string maxprice, string Title,string negative,string minFeedback, string maxFeedback, Dictionary<string,string> locations)

@Haim Please see the last parameter that I'm passing into function , that's the one I'm trying to turn into a dictionary...

Why do you need the value if it is always "Checked" (if it's unchecked, you're already removing it from `product_ids`)? — haim770, Jan 22 '17 at 13:17
Anyone guys? I think this should work but I'm missing a slight details probably... ? — User987, Jan 22 '17 at 13:17
@haim770 I'll change this value from checked to item quantity.. — User987, Jan 22 '17 at 13:17
Please add the part where you actually post the data to the server — haim770, Jan 22 '17 at 13:18
@haim770 I've edited my question, just like that.. =) Okay one second — User987, Jan 22 '17 at 13:18
@haim770 an array, this is how I declare it: var product_ids = {}; — User987, Jan 22 '17 at 13:21
@haim770 please check m updated question, I've provided contents of ProductLocation as well, it is basically a key-value pair array as well just little bit different contents.. — User987, Jan 22 '17 at 13:25
Try to use JSON instead: `$.ajax({ data: JSON.stringify(postData), contentType: 'application/json', ... })`. Alternatively, try with `traditional: false`. The bottom line is that the data is not received in a format that the default model-binder can understand. — haim770, Jan 22 '17 at 13:29
@haim770 all parameters are null now when I do JSON.Stringify... — User987, Jan 22 '17 at 13:32
Did you add `contentType: 'application/json'` as well? Have you tried with `traditional: false`? — haim770, Jan 22 '17 at 13:33
@haim770 Yes I set content type to this, and haven't tried with traditional:false, I will now one moment — User987, Jan 22 '17 at 13:34
@haim770 do u wanna write an answer so that I can accept it ? — User987, Jan 22 '17 at 13:37

score 1 · Accepted Answer · edited May 23 '17 at 12:24

1

Apparently, the default model binder expects the following format when trying to bind a Dictionary:

locations[1]=val1&locations[2]=val2

But using jQuery's traditional parameterization you'll get the following instead:

locations=[object+Object]

See https://stackoverflow.com/a/5497151/1625737

edited May 23 '17 at 12:24

Community

1
1

answered Jan 22 '17 at 13:41

haim770

48,394
7
105
133

Side note: The format you have shown only works for a `Dictionary` where the key and value are simple value types or `string`. Other wise, the format is `name[indexer].Key=value&name[indexer].Value.propertyName=value&...` – Jan 22 '17 at 22:04

Passing key-value pair array to Controller action in .NET

1 Answers1