2009-08-12 5 views
1

J'essaye de créer une table, avec quelques en-têtes de groupe. Tout va bien quand j'ai 1 groupe, mais comment créer des groupes dynamiques?Javascript Dynamic Grouping

C'est ce que j'ai jusqu'à présent (pour 1 groupe):

var groupby = ''; 
arrdata.each(function(element){ 
    if (groupby != element.groupby) { 
     groupby = element.groupby; 
     tbody.push(groupby) 
    } 
    tbody.push(element) 
}) 

Comment puis-je faire créer des groupes dynamiques?

+0

comment la structure de arrdata? –

Répondre

0

essayer avec cette structure:

arrdata = [ 
    { 
     "groupby": {fields}, 
     "data":[{fields},{fields},{fields}] 
    }, 
    { 
     "groupby": {fields}, 
     "data":[{fields},{fields},{fields}] 
    }, 
    { 
     "groupby": {fields}, 
     "data":[{fields},{fields},{fields}] 
    }, 
] 

jQuery.each(arrdata, function(element){ 
    tbody.push(element.groupby) 
    jQuery.each(element.data , function(elementData){ 
     tbody.push(elementData); 
    }) 
}) 
+0

Oui, mais je considère que les données sont regroupées de cette manière, mais que se passe-t-il si je n'ai que les données dans un groupe et que les groupes sont dans un autre groupe? – R0b0tn1k

+0

Vous devrez ensuite passer un exemple, il serait donc plus facile de donner une solution –

2

Vous groupe pourrait les dans un premier Object:

Array.prototype.groupBy = function(keyName) { 
    var res = {}; 
    this.forEach(function(x) { 
    var k = x[keyName]; 
    var v = res[k]; 
    if (!v) v = res[k] = []; 
    v.push(x); 
    }); 
    return res; 
}; 

Ensuite, pour .. en travers de l'objet:

var employees = [{first: ..., last: ..., job: ...}, ...]; 
var byJob = employees.groupBy('job'); 
for (var job in byJob) { 
    document.write('<h3>Job: '+job+'</h3>'); 
    byJob[job].forEach(function(e) { 
    document.write('<p>'+e.last+', '+e.first+'</p>'); 
    }); 
} 
0

Plus générique Solution. Vous pouvez l'utiliser directement. Copie profonde des objets utilisés. S'il vous plaît noter que cette solution est de temps polynomiale

Array.prototype.groupBy=function(property){ 
"use strict";function deepCopy(p) { 
var c = {}; 
for (var i in p) { 
     if (typeof p[i] === 'object') { 
     c[i] = (p[i].constructor === Array)?[]:{}; 
     deepCopy(p[i],c[i]); 
     } 
else { 
     c[i] = p[i]; 
     } 
} 
return c; 
} 
var retarr=[]; 
var len=this.length; 
for(var i=0;i<len;i++){ 
    var groupedlen=retarr.length,found=false; 
    for(var j=0;j<groupedlen;j++){ 
     if(this[i][property]===retarr[j].key){ 
      retarr[j].values.push(deepCopy(this[i])); 
      found=true; 
      break; 
     } 
    } 
    if (found === false) { 
     retarr.push({ 
      key: this[i][property], 
      values: [] 
     }); 
     retarr[retarr.length-1].values.push(deepCopy(this[i])); 
    } 
} 
return retarr;  
}; 

cas de test:

var arr=[{num: 1,key:911},{num: 2,key:22},{num: 3,key:23},{num: 4,key:222},{num: 4,key:2222},{num: 2,key:2},{num: 1,key:29},{num: 3,key:26},{num: 4,key:24}]; 

var grouped=arr.groupBy('num'); 

console.log(grouped);