Separate result within each

Navigation
1

I have an ajax function where I read the data inside a $ .each (), the image above contains the result of this each. I am trying to separate this data into two arrays, the data that matches the question and the graph, since I will generate two graphs containing the data, one on the question 1 and the graph Column, and another on the data of question 2 and graph Bar. p>

Thanks for the help!

    
asked by anonymous 28.05.2018 / 19:09

2 answers

2

You can do this by creating the two new arrays and making .push within .each . In the example below you only need to change the variables according to the ones you use in your code: 

var array_original = []; // array original, resultado do each
var array_col = []; // nova array com pergunta1 e Column
var array_bar = []; // nova array com pergunta2 e Bar


$.each($("div"), function(i,e){
   
   var dataPergunta = $(e).data("pergunta");
   var dataGrafico = $(e).data("grafico");
   
   array_original.push({
      "pergunta" : dataPergunta,
      "resposta" : $(e).data("resposta"),
      "grafico" : dataGrafico,
      "qt" : $(e).data("qt").toString()
   });
   
   // adiciona às novas arrays
   var novaArray;
   if(dataPergunta == "pergunta1" && dataGrafico == "Column"){
      novaArray = array_col;
   }else if(dataPergunta == "pergunta2" && dataGrafico == "Bar"){
      novaArray = array_bar;
   }

   if(novaArray){
      novaArray.push({
         "pergunta" : dataPergunta,
         "resposta" : $(e).data("resposta"),
         "grafico" : dataGrafico,
         "qt" : $(e).data("qt").toString()
      });
   }
});

console.log("Original", array_original);
console.log("Column", array_col);
console.log("Bar", array_bar);
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script><divdata-pergunta="pergunta1" data-resposta="item1" data-grafico="Column" data-qt="3">1</div>
<div data-pergunta="pergunta1" data-resposta="item2" data-grafico="Column" data-qt="2">2</div>
<div data-pergunta="pergunta2" data-resposta="item1" data-grafico="Bar" data-qt="1">3</div>
<div data-pergunta="pergunta2" data-resposta="item2" data-grafico="Bar" data-qt="1">4</div>
<div data-pergunta="pergunta2" data-resposta="item3" data-grafico="Bar" data-qt="3">5</div>
<div data-pergunta="pergunta3" data-resposta="item3" data-grafico="Bar" data-qt="3">6</div>
    
28.05.2018 / 19:37
0

Because the data is dynamic you can filter only from the graph column as in the example: 

var original = [
  {pergunta: "pergunta1", resposta: "item1", grafico: "Column", qt: "3"},
  {pergunta: "pergunta1", resposta: "item2", grafico: "Column", qt: "2"},
  {pergunta: "pergunta2", resposta: "item1", grafico: "Bar", qt: "1"},
  {pergunta: "pergunta2", resposta: "item2", grafico: "Bar", qt: "1"},
  {pergunta: "pergunta2", resposta: "item3", grafico: "Bar", qt: "3"},
]

var column = []
var bar    = []
var divColumn = "Column <br>";
var divBar = "Bar <br>";
$.each( original, function(i, j){
    if( j.grafico === 'Bar' ){
      divBar += JSON.stringify( original[i] )+"<br>";
      bar.push(
           original[i]
       )
    }else{
     divColumn += JSON.stringify( original[i] )+"<br>";
     column.push( original[i] )
    }
} )
console.log( bar ) 
console.log( column ) 
$('.bar').append( divBar )
$('.bar').append( divColumn )
<script
  src="https://code.jquery.com/jquery-3.3.1.min.js"integrity="sha256-FgpCb/KJQlLNfOu91ta32o/NMZxltwRo8QtmkMRdAu8="
  crossorigin="anonymous"></script>
  <div class="bar"></div>
  <div class="column"></div>
    
28.05.2018 / 20:02
flexbox: space-between 2 children starting in the middle and then ending vector within vector generates duplicity of values in the second dimension