Generic placeholder image

cara menggunakan operasi perulangan di dalam ajax

Ditanyakan pada tanggal 27 February 2019 oleh NUR IMAN

berikut table html yang saya buat : link pastebin table_html : https://pastebin.com/PjHFPZy1

berikut ajax yang saya buat: link pastebin ajax : https://pastebin.com/Pc5uApTM

saya mempunyai json seperti ini :

{ hari: { 1: { 1: 0, 2: 0, 3: 0, 4: 0, 5: 1, 6: 2, 7: 3 }, 2: { 1: 4, 2: 5, 3: 6, 4: 7, 5: 8, 6: 9, 7: 10 }, 3: { 1: 11, 2: 12, 3: 13, 4: 14, 5: 15, 6: 16, 7: 17 }, 4: { 1: 18, 2: 19, 3: 20, 4: 21, 5: 22, 6: 23, 7: 24 }, 5: { 1: 25, 2: 26, 3: 27, 4: 28 } }, bulan_tahun: "February-2019", clc_format: [ "W24", "2H1", "W25", "W26", "W27" ] }

nah yang ingin melakukan perulangan dari index hari yang mempunyai index 1 sampai 5 dan index tersebut mempunyai index lagi. data tersebut akan dibuat untuk calender.

Comment ..

Apakah ini kurang jelas?

Dikomentari pada tanggal 28 February 2019 oleh NUR IMAN

3 JAWABAN

Generic placeholder image
NUR IMAN menjawab 6 hari yang lalu

SOLVED

semoga bermanfaat, saya menggunakan cara lama. belum terbiasa menggunakan cara baru function data_calendar(data) { var nama_bulan = data.bulan_tahun; bulan = $("#input_bulan").val(data.bulan); tahun = $("#input_tahun").val(data.tahun); clc_format_length = data.clc_format.length; html_clc_format = ""; for (i = 0; i < clc_format_length; i++) { var clc_format = data.clc_format[i]; hari = data.hari[i+1]; day_length = Object.keys(hari).length; html_hari = ""; week = hari[1];

for (j = 1; j <= day_length; j++) {
                    var data_hari   = hari[j];
                        if (data_hari == "0") {
                            data_hari = "";
                        }
                        html_hari   += `<td class="text-center">`+data_hari+`</td>`;
                }
                html_clc_format += `<tr>
                                    <td>
                                        <input type="hidden" class="form-control text-center" name="dayofweek`+i+`" id="dayofweek`+i+`" value="`+week+`">
                                        <input type="text" class="form-control text-center" name="week`+i+`" id="week`+i+`" value="`+clc_format+`"></input>
                                    </td>
                                    `+html_hari+`
                                    </tr>`;
        }
        document.getElementById("table").innerHTML = html_clc_format;
        document.getElementById("bulan").innerText = nama_bulan;
}
Generic placeholder image
Hermansyah menjawab pada tanggal 27 February 2019
Comment ..

Untuk 1 kali perulangan yang langsung append ke html ane memang sudah berhasil kak. Terimakasih referensinya

Dikomentari pada tanggal 28 February 2019 oleh NUR IMAN
Comment ..

apakah sudah solved mas?

Dikomentari pada tanggal 28 February 2019 oleh Muhammad Alif
Comment ..

belum mas, saya masih cari cara lain juga.

Dikomentari pada tanggal 28 February 2019 oleh NUR IMAN
Generic placeholder image
Ahmad Oriza menjawab pada tanggal 28 February 2019

Halo mas,

Setelah membaca kodingannya saya agak bingung datanya. Kalau gitu saya coba contohkan saja yang sederhana seperti ini cara update table data :

HTML

<table class="table table-striped">
    <thead>
        <tr>
            <th>Nama Produk</th>
            <!--<th width="20%">Qty</th>-->
            <th class="text-right">Harga</th>
            <th class="text-right">Subtotal</th>
            <th class="text-right">Pilihan</th>
        </tr>
    </thead>
    <tbody class="tbody">
    </tbody>
    <tfoot class="tfoot">
    </tfoot>
</table>

JS

$.getJSON('http://link.json', function( data ) {

    $.each( data.cart_contents, function( key, value ) {
        var tbody = `
        <tr class="tr-${value.rowid}">
        <td>${value.name} (${value.type})</td>
        <td class="text-right">${value.price}</td>
        <td class="text-right">${value.subtotal}</td>
        <td class="text-right"><a href="#" class="btn-cancel-cart" data-id="${value.rowid}">[Cancel]</a></td>
        </tr>
        `;

        $('.tbody').append(tbody);
    });
});
Comment ..

untuk ini kan 1 kali perulangan data tersebut langsung di kirimkan ke tag html mas, nah yang saya bingungkan apakah ketika sudah kita kirimkan data ke html, kita melakukan looping lagi di dalam tag yang akan dikirimkan ke tag html.

Dikomentari pada tanggal 28 February 2019 oleh NUR IMAN
Comment ..

Berarti ada looping dalam looping. Sebenernya hasil dari GET JSON atau AJAX kan JSON. Dan ketika dibaca javascript jadi object. Tinggal looping aja datanya. Kalau memang dalam data ada data lagi, ya looping aja lagi.

Dikomentari pada tanggal 28 February 2019 oleh Ahmad Oriza
Comment ..

Oke mas saya akan coba dulu.

Semoga saja berhasil

Dikomentari pada tanggal 28 February 2019 oleh NUR IMAN