Generowanie tabelki HTML w jQuery

Witam

Mam problem, nad którym siedzę 3ci dzień i nie mogę sobie z nim poradzić. Mam w javascript 3 tablice (ich zawartość pobierana jest ajaxem z BD). Te tabelki to: rodzaje_posilkow (obiad, lunch, 2 sniadanie), podrodzaje_posilkow (każdy rodzaj posiłku ma przyporządkowane poprzez id podrodzaje, np. obiad ma 1 danie, zupę i deser). Mam w końcu tabelę wykupione_posilki, w której mam numer dnia, id_wykupionego_rodzaju_posilku i id_wykupionego_podrodzaju_posilku).

Chcę teraz wyprodukować następującą tabelę HTML:

rodzaj      | dzień 1 | dzień 2
------------+---------+---------
obiad       | 1 danie | zestaw
            |   zupa  |         
 -----------+---------+---------
2 sniadanie |  zestaw |         
 -----------+---------+---------
lunch       |  zestaw | kanapka

Częściowo sobie poradziłem, ale nie potrafię napisać kodu, który wypełniłby mi tabelę wartościami.

Cały kod, który można zapisać w pliku HTML i przetestować:

<script src="http://code.jquery.com/jquery-1.10.1.min.js"></script>
<style>
    td,th{
        border: solid black 1px;
    }
</style>
<script>
    
$(function(){
    
    var rodzaje_posilkow = [];
        rodzaje_posilkow[0] = {id_rodzaju: 1, nazwa:'obiad'};
        rodzaje_posilkow[1] = {id_rodzaju: 2, nazwa:'2 sniadanie'};
        rodzaje_posilkow[2] = {id_rodzaju: 3, nazwa:'lunch'};
    
    var podrodzaje_posilkow = [];
        podrodzaje_posilkow[0] = {id_podrodzaju: 1, id_rodzaju: 1, nazwa: '1 danie'};
        podrodzaje_posilkow[1] = {id_podrodzaju: 2, id_rodzaju: 1, nazwa: 'zupa'};
        podrodzaje_posilkow[2] = {id_podrodzaju: 3, id_rodzaju: 1, nazwa: 'deser'};
        podrodzaje_posilkow[3] = {id_podrodzaju: 4, id_rodzaju: 2, nazwa: 'kanapka'};
        podrodzaje_posilkow[4] = {id_podrodzaju: 5, id_rodzaju: 2, nazwa: 'kompot'};
        podrodzaje_posilkow[5] = {id_podrodzaju: 6, id_rodzaju: 1, nazwa: 'zestaw'};
        podrodzaje_posilkow[6] = {id_podrodzaju: 7, id_rodzaju: 2, nazwa: 'zestaw'};
        podrodzaje_posilkow[7] = {id_podrodzaju: 8, id_rodzaju: 3, nazwa: 'zestaw'};
    
    var wykupione_posilki = [];
        wykupione_posilki[0] = {id_rodzaju: 1, id_podrodzaju: 1, dzien: 1};
        wykupione_posilki[1] = {id_rodzaju: 1, id_podrodzaju: 2, dzien: 1};
        wykupione_posilki[2] = {id_rodzaju: 1, id_podrodzaju: 5, dzien: 2};
        wykupione_posilki[3] = {id_rodzaju: 2, id_podrodzaju: 7, dzien: 1};
        wykupione_posilki[4] = {id_rodzaju: 3, id_podrodzaju: 8, dzien: 1};
        wykupione_posilki[5] = {id_rodzaju: 3, id_podrodzaju: 4, dzien: 2};
    
    var html = '';

    function isInArray(a_array,needle) {
        var count=0;
        for(var i in a_array) 
        {
            if(a_array[i] == needle) 
                count++;
        }
        return count;
    };

    
    var dni = [];
    
    html += '<tr><th>Rodzaj</th>';
    //leć po wszystkich wykupionych posiłkach
    $.each(wykupione_posilki,function(index,posilek){
        //zebyśmy mieli każdy dzień tylko raz
        if(!isInArray(dni,posilek.dzien))
        {
            dni.push(posilek.dzien);
            html+='<th>'+posilek.dzien+'</th>'; 
        }
    });
    html+='</tr>';
    
    $.each(rodzaje_posilkow,function(index,rodzaj_posilku){
       html+='<tr>';
       html+='<th>'+rodzaj_posilku.nazwa+'</th>';
       
       //no i pewnie tutaj trzeba dać jeszcze pętle od podrodzaju i wykupionych posilkow
       //z jakimis ifami
       
       
       
       html+='</tr>';
    });
    
    $('table').html(html);
})
    
</script>

<table>
    
</table>

Te 3 tabele na początku to po co? Tylko w ramach testu je sobie stworzyłeś, tak? Bo ogólnie sprawa jest prosta, tylko nie wiem dokładnie jak chcesz to uzyskać? Pobierz przez sql jednym zapytaniem wszystko z bazy i ajaxem prześlij do js. Później to już bajka, zależy w jakiej formie zapytanie zwróci Ci dane, ale z jedna, dwie pętle i po sprawie:) Po co warunki ? warunki masz już w zapytani sql? :)

poniatowski napisał(a):

Te 3 tabele na początku to po co? Tylko w ramach testu je sobie stworzyłeś, tak? Bo ogólnie sprawa jest prosta, tylko nie wiem dokładnie jak chcesz to uzyskać? Pobierz przez sql jednym zapytaniem wszystko z bazy i ajaxem prześlij do js. Później to już bajka, zależy w jakiej formie zapytanie zwróci Ci dane, ale z jedna, dwie pętle i po sprawie:) Po co warunki ? warunki masz już w zapytani sql? :)

Tablice na początku to tylko przykładowe dane, oczywiście są one przesyłane ajaxem z bazy.
Czy mógłbyś mi pokazać tablicę, o której mówisz, jaką powinna mieć struktruę i jak za pomocą pętli stworzyć tabelę html o którą mi chodzi?

pokaż jak wybierasz zapytanie SQL ? Ile będziesz miał tam tych dni ? 7 ? czy może lepiej datę wstawić? jak to będzie ?

--wybieram dane wykupionych posiłków z danego miesiąca i numery poszczególnych dni
SELECT *,extract(day FROM data) as dzien FROM wykupione_posilki
			 			extract(year FROM data)=2013 AND 
			 			extract(month FROM data)=10

--wybieram wszystkie rodzaje posilkow
SELECT * FROM rodzaje_posilkow

--wybieram wszystkie podrodzaje posilkow
SELECT * FROM podrodzaje_posilkow

Jak widać zapytania są banalnie proste i zwracają dane takie jak pokazałem w tablicach w pierwszym poście.