Question posted in
You can find the official documentation here.

Jquery ajax – group JSON in Javascript called using Ajax

I am trying to group my JSON object that I get when calling Ajax so I later implement it in my dependable dropdown list. I tried to group the values by CI, but all it did is split each character of all values :/ I tried _.groupBy, for loops ,but nothings seems to work .
The call is now just to test if I would be able to split the files as I want, to work on it later :

 $('#my_id').on('change', '#CISelect', function(){
        $.ajax({
            type:'GET',
            url:"{{url_for('CIType')}}",
            success:function(data){
                console.log(data);
                var result = {}, 
                i = 0;
                $(data).each(function(key,item){
                    dataValue = item[i].CI;
                    if(!result[dataValue]){
                        result[dataValue] = [];
                        i++;
                    }
                    result[dataValue].push(item[i].CI);
                    i++;
                });
                console.log(result);
            }
        })

my JSON looks like this :

[{"CI":"GDV","Type":"Backup","TypeValue":20613},
{"CI":"GDV","Type":"Carepack","TypeValue":20642},
{"CI":"UNV","Type":"Digitalkamera","TypeValue":335}, 
{"CI":"UNV","Type":"Dockingstation","TypeValue":250},
{"CI":"PRT","Type":"Fax","TypeValue":325}, 
{"CI":"MOB","Type":"GSM Gateway","TypeValue":20648}]

what I want is this :

    {GDV : [{"Type":"Backup","TypeValue":20613},
            {"Type":"Carepack","TypeValue":20642}],
     UNV : [{"Type":"Digitalkamera","TypeValue":335}, 
            {"Type":"Dockingstation","TypeValue":250}],
     PRT : [{"Type":"Fax","TypeValue":325}}, 
     MOB : {{"Type":"GSM Gateway","TypeValue":20648}]}

Any help would be great.

Tags:

3

Answers


  1. 0 
    const raw = [
  { CI: "GDV", Type: "Backup", TypeValue: 20613 },
  { CI: "GDV", Type: "Carepack", TypeValue: 20642 },
  { CI: "UNV", Type: "Digitalkamera", TypeValue: 335 },
  { CI: "UNV", Type: "Dockingstation", TypeValue: 250 },
  { CI: "PRT", Type: "Fax", TypeValue: 325 },
  { CI: "MOB", Type: "GSM Gateway", TypeValue: 20648 }
];

// Distinc CI values
const dist_CI = [... new Set(raw.map(r => r.CI))];

const result = {};
for (let ci of dist_CI) {
  result[ci] = raw
    .filter(r => r.CI === ci)
    .map(r => {
      return {
        Type: r.Type,
        TypeValue: r.TypeValue
      };
    });
};

    Result:

    {
   "GDV":[
      {
         "Type":"Backup",
         "TypeValue":20613
      },
      {
         "Type":"Carepack",
         "TypeValue":20642
      }
   ],
   "UNV":[
      {
         "Type":"Digitalkamera",
         "TypeValue":335
      },
      {
         "Type":"Dockingstation",
         "TypeValue":250
      }
   ],
   "PRT":[
      {
         "Type":"Fax",
         "TypeValue":325
      }
   ],
   "MOB":[
      {
         "Type":"GSM Gateway",
         "TypeValue":20648
      }
   ]
}
    Login or Signup to reply.
  2. 0

    You need to make minor adjustment

    each iterator needs to be updated

    $('#my_id').on('change', '#CISelect', function(){
$.ajax({
    type:'GET',
    url:"{{url_for('CIType')}}",
    success:function(data){
        console.log(data);
        var result = {}, 
        $.each(data,function(key,item){
            let dataValue = item["CI"]
            if(!result[dataValue]){
                result[dataValue] = [];
                result[dataValue].push({Type:item["Type"], TypeValue:item["TypeValue"]}); 
            }else{
            result[dataValue].push({Type:item["Type"], TypeValue:item["TypeValue"]}); 
            }
        });
        console.log(result);
    }
})
    Login or Signup to reply.
  3. 0

    my solution… ( more simple… )

    let data =
  [ { CI: 'GDV', Type: 'Backup',         TypeValue: 20613 } 
  , { CI: 'PRT', Type: 'Fax',            TypeValue: 325   } 
  , { CI: 'GDV', Type: 'Carepack',       TypeValue: 20642 } 
  , { CI: 'UNV', Type: 'Digitalkamera',  TypeValue: 335   } 
  , { CI: 'UNV', Type: 'Dockingstation', TypeValue: 250   } 
  , { CI: 'MOB', Type: 'GSM Gateway',    TypeValue: 20648 } 
  ] 

result = data.reduce((acc,elm)=>{
  if ( acc[elm.CI] ) acc[elm.CI].push( { Type:elm.Type, TypeValue:elm.TypeValue } )
  else               acc[elm.CI] = [{ Type:elm.Type, TypeValue:elm.TypeValue }]
  return acc
},{})

console.log( result )

    so your code should be :

    $('#my_id').on('change', '#CISelect', function(){
  $.ajax({
    type:'GET',
    url:"{{url_for('CIType')}}",
    success:function(data){
      result = JSON.parse(data).reduce((acc,elm)=>{
        if ( acc[elm.CI] ) acc[elm.CI].push( { Type:elm.Type, TypeValue:elm.TypeValue } )
        else               acc[elm.CI] = [{ Type:elm.Type, TypeValue:elm.TypeValue }]
        return acc
      },{})
      console.log(result);
    }
  })
...
    Login or Signup to reply.
Please signup or login to give your own answer.

Back To Top
Search