user1221765 user1221765 - 2 months ago 6
Javascript Question

Add Property dynamically to the JSON array

I would like to two add property Id and ButtonId to the exisiting json result. I have pasted the below js code for reference and I would like to pass the jsonresult to MVC controller. As of now it returns null. please help to proceed. Thanks.

my final result should look like this


json{"Groups":{"Id":"2","ButtonId":"1142","1186","1189"},
{"Id":"3","ButtonId":"1171","1173","1174","1175","1176","1187"},
{"Id":"4","ButtonId":"1177","1178","1179"}} etc..




var btnlist = {Groups: {Id:"", ButtonId: ""}};
$.each($(".buttonData"), function (index, value) {
var values = value.id.split(':');
grpid = values[0].split('-')[1];
btnid = values[1].split('-')[1];

console.log('grpid=' + grpid + ' btnid=' + btnid);

if (typeof (btnlist['Groups'][grpid]) == 'undefined') {
btnlist['Groups'][grpid] = [];
}
btnlist['Groups'][grpid].push(btnid);
});

$.ajax({
type: "POST",
url: "@Url.Action("Home", "Menu")",
dataType: "json",
contentType: "application/json; charset=utf-8",
data: JSON.stringify(btnlist) ,
success: function (result) {
console.log('json' + JSON.stringify(btnlist));
console.debug(result);
},
error: function (request, error) {
console.debug(error);
}
});





This is the json result before pushing into the multidimensional array
result

The json result, where the properties Id and ButtonId is inserted behind.
json result

null result passed to the controller
controller

Answer

With assistance of my colleague, the desired output is as below. This is for other programmers who face similar issue with JSON array. Thanks.

         var btnlist = [];
              btngrps = $('.btn-sort-container');
              $.each(btngrps, function(k, v) {
                btnarr = {};

                gid = $(this).attr('id');
                grpid = gid.split('-')[1];
                btnarr.Id = gid.split('-')[1];

                btnobjs = $(v).find('.buttonData');
                if (btnobjs.length) {
                  btnarr['btnId'] = [];
                  $.each(btnobjs, function(bk, bv) {

                    btnid = $(bv).attr('id').split('-')[2];

                    btnarr['btnId'].push($(bv).attr('id').split('-')[2]);

                  });
                  console.debug(btnarr);
                  btnlist.push(btnarr);
                }
              });
              console.debug(btnlist);

Output on console

]: http://i.stack.imgur.com/oJ3Dy.png

Comments