Retool memudahkan Anda membuat aplikasi dengan data Google Sheets, termasuk menghubungkan Google Sheets dengan API lain. Retool mendukung membaca dan menulis data dari Google Sheets, dan dengan permintaan JSON kami melalui SQL, Anda dapat dengan mudah menggabungkan Google Sheets dengan sumber data lainnya
👋
Tutorial ini menganggap Anda telah menyiapkan sumber daya Google Sheets di Retool. Lihat dokumentasi Google Spreadsheet kami untuk panduan menghubungkan akun Spreadsheet Anda dalam beberapa langkah cepat
Buat aplikasi pertama Anda dengan Google Spreadsheet
Katakanlah Anda ingin membuat aplikasi Retool untuk mengirim undangan ke pengguna yang telah mendaftar untuk menjadi penguji beta produk baru Anda. Informasi kontak mereka disimpan dalam spreadsheet Google Sheets di Google Drive yang Anda siapkan sebagai sumber daya baru Anda. Untuk memulai pembuatan aplikasi Anda, pertama-tama pastikan spreadsheet Anda diformat dengan benar
Persyaratan lembar bentang
Di Retool, Anda dapat menentukan sheet mana di spreadsheet Google tempat Anda ingin meminta data. Baris pertama dalam sheet tersebut harus memiliki nama kolom yang dipetakan ke data yang tercantum dalam baris di bawahnya. Inilah tampilan sheet yang diformat dengan baik
Sama seperti contoh di atas, sheet yang Anda kueri di Retool seharusnya tidak memiliki data tambahan
- Baris pertama nama kolom Anda
- Baris data Anda
Seharusnya tidak ada kolom kosong di antara nama kolom Anda. Anda juga harus menghindari baris kosong, karena dapat menyebabkan masalah offset saat menambahkan data
Untuk mereferensikan nama kolom Anda dengan mudah di Retool, kami merekomendasikan konvensi penamaan berikut
- Gunakan karakter alfanumerik
- Gunakan huruf kecil
- Gunakan garis bawah untuk memisahkan kata, bukan spasi
Jika Anda memiliki lembar yang memiliki beberapa data tambahan di dalamnya (mis. g. beberapa ringkasan statistik ke kanan) Anda malah dapat menggunakan opsi kami. Ini membutuhkan sedikit lebih banyak pekerjaan untuk disiapkan, jadi untuk tutorial ini kami malah menyarankan untuk membuat lembar baru yang mereferensikan data yang Anda inginkan, dan memformat lembar baru itu seperti di atas
Alat ulang juga menanyakan maksimum 26 kolom, A:Z, secara default. Jika Anda memiliki lebih dari 26 kolom dalam data, Anda harus menggunakan. (Misalnya, jika Anda memiliki 28 kolom, notasi A1 Anda adalah A:AB. )
Membaca data Anda ke dalam komponen Tabel
Di aplikasi Anda, buat kueri baru yang akan Anda gunakan untuk membaca data dari sheet Anda
Pilih sumber daya Google Sheets Anda dari dropdown Resource, untuk contoh ini adalah "David's Google Sheets". Kemudian pilih spreadsheet yang Anda inginkan, ini dia "Pendaftaran beta". (Jika dibiarkan kosong, Retool akan menggunakan lembar pertama dalam spreadsheet. )
📘
Memilih spreadsheet berdasarkan ID
Selain memilih nama spreadsheet dari menu tarik-turun, Anda juga dapat memasukkan ID spreadsheet sebagaimana ditentukan dalam URL-nya. Misalnya, jika URL lembar Google adalah //docs.google.com/spreadsheets/d/1L2h7HMrHjcpU_-vpT8pGVKNlfBaxh8FUEN-UHXt--mU/edit#gid=0, ID akan menjadi 1L2h7HMrHjcpU_-vpT8pGVKNlfBaxh8FUEN-UHXt--mU
Klik Pratinjau untuk melihat data Anda di Retool
Untuk menyimpan, klik Simpan & Jalankan. Selanjutnya, seret komponen Tabel ke kanvas Anda
Secara default, komponen Tabel Retool secara otomatis terisi dengan .data kueri pertama yang Anda buat (mis. g. query1). Di Retool, [ { "name":"Ines", "phone_number":"303-555-0132", "interested_in_beta_testing":"FALSE", "beta_invite_sent":"FALSE", }, { "name":"Oliver", "phone_number":"907-555-0146", "interested_in_beta_testing":"TRUE", "beta_invite_sent":"FALSE", } ] 0 adalah larik objek JSON, satu untuk setiap baris yang terstruktur seperti miliknya
{ "name":"Ines", "phone_number":"303-555-0132", "interested_in_beta_testing":"FALSE", "beta_invite_sent":"FALSE", } _Opsi pada kueri baca Anda
Retool menyediakan beberapa opsi berbeda untuk kueri baca dengan Google Sheets
Membatasi. menetapkan batas bilangan bulat pada baris yang dikembalikan dari lembar Anda, tidak termasuk baris nama kolom Anda
Di lembar contoh
Kueri baca dengan batas 2 akan mengembalikan baris untuk Ines dan Oliver, tidak termasuk baris untuk Priya, Asia, dan Isaac. JSON berikut akan dikembalikan
[ { "name":"Ines", "phone_number":"303-555-0132", "interested_in_beta_testing":"FALSE", "beta_invite_sent":"FALSE", }, { "name":"Oliver", "phone_number":"907-555-0146", "interested_in_beta_testing":"TRUE", "beta_invite_sent":"FALSE", } ]Mengimbangi. menyetel offset bilangan bulat pada baris yang dikembalikan dari lembar Anda, tidak termasuk baris nama kolom Anda
Sekali lagi, di lembar contoh
Kueri baca dengan offset 1 akan mengembalikan baris untuk Oliver, Priya, Asia, dan Isaac serta mengecualikan baris untuk Ines. JSON berikut akan dikembalikan
JSON
[ { "name": "Oliver", "phone_number": "907-555-0146", "interested_in_beta_testing": "TRUE", "beta_invite_sent": "FALSE" }, { "name": "Priya", "phone_number": "312-555-0188", "interested_in_beta_testing": "FALSE", "beta_invite_sent": "FALSE" }, { "name": "Asia", "phone_number": "818-555-0173", "interested_in_beta_testing": "TRUE", "beta_invite_sent": "FALSE" }, { "name": "Isaac", "phone_number": "415-555-1045", "interested_in_beta_testing": "TRUE", "beta_invite_sent": "FALSE" } ]
Notasi A1
Jika Anda perlu memilih bagian tertentu dari sebuah sheet, Anda dapat menggunakan di Retool. Dalam spreadsheet contoh ini, data baris dimulai dari kolom B dan ada beberapa ringkasan statistik di sebelah kanan
Untuk memilih data dari lembar ini, Anda dapat menulis notasi A1 untuk mendapatkan sel persis di atas dengan [ { "name":"Ines", "phone_number":"303-555-0132", "interested_in_beta_testing":"FALSE", "beta_invite_sent":"FALSE", }, { "name":"Oliver", "phone_number":"907-555-0146", "interested_in_beta_testing":"TRUE", "beta_invite_sent":"FALSE", } ] 1, atau untuk menambahkan baris apa pun di masa mendatang, [ { "name":"Ines", "phone_number":"303-555-0132", "interested_in_beta_testing":"FALSE", "beta_invite_sent":"FALSE", }, { "name":"Oliver", "phone_number":"907-555-0146", "interested_in_beta_testing":"TRUE", "beta_invite_sent":"FALSE", } ] 2. Untuk menggunakan notasi A1, klik [ { "name":"Ines", "phone_number":"303-555-0132", "interested_in_beta_testing":"FALSE", "beta_invite_sent":"FALSE", }, { "name":"Oliver", "phone_number":"907-555-0146", "interested_in_beta_testing":"TRUE", "beta_invite_sent":"FALSE", } ] 3
Tambahkan notasi A1 Anda, di sini [ { "name":"Ines", "phone_number":"303-555-0132", "interested_in_beta_testing":"FALSE", "beta_invite_sent":"FALSE", }, { "name":"Oliver", "phone_number":"907-555-0146", "interested_in_beta_testing":"TRUE", "beta_invite_sent":"FALSE", } ] 2, dan data Anda akan dikembalikan sebagai larik objek JSON
Menambahkan baris ke data Anda
Dalam contoh ini, Anda akan memungkinkan pengguna aplikasi Anda menambahkan penguji beta baru ke tabel. Data baru ini kemudian akan ditambahkan ke spreadsheet Anda
Persiapkan meja Anda untuk menerima baris baru
Pertama, klik [ { "name":"Ines", "phone_number":"303-555-0132", "interested_in_beta_testing":"FALSE", "beta_invite_sent":"FALSE", }, { "name":"Oliver", "phone_number":"907-555-0146", "interested_in_beta_testing":"TRUE", "beta_invite_sent":"FALSE", } ] _5 di kanvas, dan di Inspektur, buat setiap kolom dapat diedit
Selanjutnya, masih di Inspektur, aktifkan tombol Tampilkan tambahkan baris
Untuk mengujinya dan melihat bagaimana Retool menyimpan baris yang baru ditambahkan ini, klik tombol + dan isi informasi untuk penguji beta baru
Setelah mengisi baris di [ { "name":"Ines", "phone_number":"303-555-0132", "interested_in_beta_testing":"FALSE", "beta_invite_sent":"FALSE", }, { "name":"Oliver", "phone_number":"907-555-0146", "interested_in_beta_testing":"TRUE", "beta_invite_sent":"FALSE", } ] _5, data untuk penguji beta baru disimpan di [ { "name":"Ines", "phone_number":"303-555-0132", "interested_in_beta_testing":"FALSE", "beta_invite_sent":"FALSE", }, { "name":"Oliver", "phone_number":"907-555-0146", "interested_in_beta_testing":"TRUE", "beta_invite_sent":"FALSE", } ] 7
Buat kueri untuk menambahkan baris ke spreadsheet Anda
Selanjutnya, buat kueri bernama [ { "name":"Ines", "phone_number":"303-555-0132", "interested_in_beta_testing":"FALSE", "beta_invite_sent":"FALSE", }, { "name":"Oliver", "phone_number":"907-555-0146", "interested_in_beta_testing":"TRUE", "beta_invite_sent":"FALSE", } ] 8 menggunakan sumber daya Google Sheets Anda dan konfigurasikan dengan pengaturan berikut
- Di tarik-turun Jenis tindakan, pilih Tambahkan data ke spreadsheet
- Di dropdown Spreadsheet, pilih spreadsheet Google Sheets Anda
- Di bidang Nilai untuk ditambahkan, masukkan [ { "name":"Ines", "phone_number":"303-555-0132", "interested_in_beta_testing":"FALSE", "beta_invite_sent":"FALSE", }, { "name":"Oliver", "phone_number":"907-555-0146", "interested_in_beta_testing":"TRUE", "beta_invite_sent":"FALSE", } ] 9. Ini mengisi spreadsheet Anda dengan baris baru di [ { "name":"Ines", "phone_number":"303-555-0132", "interested_in_beta_testing":"FALSE", "beta_invite_sent":"FALSE", }, { "name":"Oliver", "phone_number":"907-555-0146", "interested_in_beta_testing":"TRUE", "beta_invite_sent":"FALSE", } ] 5. Perhatikan bahwa bidang ini dapat berisi berbagai objek JSON, termasuk objek literal, selama kunci objek cocok dengan nama kolom spreadsheet Anda
- Di bagian Penangan peristiwa > Sukses, masukkan [ { "name": "Oliver", "phone_number": "907-555-0146", "interested_in_beta_testing": "TRUE", "beta_invite_sent": "FALSE" }, { "name": "Priya", "phone_number": "312-555-0188", "interested_in_beta_testing": "FALSE", "beta_invite_sent": "FALSE" }, { "name": "Asia", "phone_number": "818-555-0173", "interested_in_beta_testing": "TRUE", "beta_invite_sent": "FALSE" }, { "name": "Isaac", "phone_number": "415-555-1045", "interested_in_beta_testing": "TRUE", "beta_invite_sent": "FALSE" } ] 1. Ini memuat ulang tabel Anda sehingga baris baru segera terlihat
Hubungkan kueri appendRow ke tabel Anda
Langkah terakhir untuk menambahkan baris ke spreadsheet Anda adalah menghubungkan kueri [ { "name":"Ines", "phone_number":"303-555-0132", "interested_in_beta_testing":"FALSE", "beta_invite_sent":"FALSE", }, { "name":"Oliver", "phone_number":"907-555-0146", "interested_in_beta_testing":"TRUE", "beta_invite_sent":"FALSE", } ] 8 ke event handler di [ { "name":"Ines", "phone_number":"303-555-0132", "interested_in_beta_testing":"FALSE", "beta_invite_sent":"FALSE", }, { "name":"Oliver", "phone_number":"907-555-0146", "interested_in_beta_testing":"TRUE", "beta_invite_sent":"FALSE", } ] 5. Pilih [ { "name":"Ines", "phone_number":"303-555-0132", "interested_in_beta_testing":"FALSE", "beta_invite_sent":"FALSE", }, { "name":"Oliver", "phone_number":"907-555-0146", "interested_in_beta_testing":"TRUE", "beta_invite_sent":"FALSE", } ] 5 dan di bagian Interaksi Inspektur
- Klik + Tambahkan di samping Penangan acara
- Di tarik-turun Acara, pilih Simpan baru
- Di tarik-turun Kueri, pilih kueri ________0______8 Anda
Memperbarui baris
Selanjutnya, Anda dapat memasang tombol "Kirim teks undangan". Anda harus menambahkan kolom tombol Tindakan ke tabel. Klik komponen [ { "name":"Ines", "phone_number":"303-555-0132", "interested_in_beta_testing":"FALSE", "beta_invite_sent":"FALSE", }, { "name":"Oliver", "phone_number":"907-555-0146", "interested_in_beta_testing":"TRUE", "beta_invite_sent":"FALSE", } ] _5 untuk memilihnya, lalu klik Tindakan baru di inspektur properti
Kolom baru bernama "Tindakan" akan muncul di tabel Anda, dengan setiap baris menampilkan tombol. Anda dapat mengganti nama tombol dengan mengeklik Tindakan 1 dalam daftar, lalu mengubah teks tombol Tindakan menjadi "Kirim teks undangan"
Anda mungkin ingin menggunakan sesuatu seperti Twilio API untuk mengirim pesan teks saat tombol ini ditekan. Contoh ini, bagaimanapun, hanya akan fokus pada memperbarui spreadsheet seolah-olah Anda telah berhasil mengirim pesan teks
Selanjutnya, Anda ingin menambahkan kolom baru, [ { "name": "Oliver", "phone_number": "907-555-0146", "interested_in_beta_testing": "TRUE", "beta_invite_sent": "FALSE" }, { "name": "Priya", "phone_number": "312-555-0188", "interested_in_beta_testing": "FALSE", "beta_invite_sent": "FALSE" }, { "name": "Asia", "phone_number": "818-555-0173", "interested_in_beta_testing": "TRUE", "beta_invite_sent": "FALSE" }, { "name": "Isaac", "phone_number": "415-555-1045", "interested_in_beta_testing": "TRUE", "beta_invite_sent": "FALSE" } ] 7, ke spreadsheet Anda
Buat kueri baru lainnya, [ { "name": "Oliver", "phone_number": "907-555-0146", "interested_in_beta_testing": "TRUE", "beta_invite_sent": "FALSE" }, { "name": "Priya", "phone_number": "312-555-0188", "interested_in_beta_testing": "FALSE", "beta_invite_sent": "FALSE" }, { "name": "Asia", "phone_number": "818-555-0173", "interested_in_beta_testing": "TRUE", "beta_invite_sent": "FALSE" }, { "name": "Isaac", "phone_number": "415-555-1045", "interested_in_beta_testing": "TRUE", "beta_invite_sent": "FALSE" } ] _8, dan pilih tindakan Perbarui spreadsheet. Retool membutuhkan cara untuk mengetahui baris mana yang ingin Anda perbarui. Untuk melakukannya, Anda harus menentukan kolom unik dan nilai yang sesuai, sehingga Retool dapat mendeteksi satu baris untuk diperbarui
Kandidat yang baik untuk kolom unik Anda akan menjadi kunci utama seperti id, tetapi dalam kasus ini Anda dapat menggunakan kolom [ { "name": "Oliver", "phone_number": "907-555-0146", "interested_in_beta_testing": "TRUE", "beta_invite_sent": "FALSE" }, { "name": "Priya", "phone_number": "312-555-0188", "interested_in_beta_testing": "FALSE", "beta_invite_sent": "FALSE" }, { "name": "Asia", "phone_number": "818-555-0173", "interested_in_beta_testing": "TRUE", "beta_invite_sent": "FALSE" }, { "name": "Isaac", "phone_number": "415-555-1045", "interested_in_beta_testing": "TRUE", "beta_invite_sent": "FALSE" } ] 9, karena unik per penguji beta. Anda ingin mencocokkan nomor telepon untuk baris mana pun tombol "Kirim teks undangan" diklik. Tetapkan Filter menurut kolom menjadi [ { "name": "Oliver", "phone_number": "907-555-0146", "interested_in_beta_testing": "TRUE", "beta_invite_sent": "FALSE" }, { "name": "Priya", "phone_number": "312-555-0188", "interested_in_beta_testing": "FALSE", "beta_invite_sent": "FALSE" }, { "name": "Asia", "phone_number": "818-555-0173", "interested_in_beta_testing": "TRUE", "beta_invite_sent": "FALSE" }, { "name": "Isaac", "phone_number": "415-555-1045", "interested_in_beta_testing": "TRUE", "beta_invite_sent": "FALSE" } ] _9 dan nilainya menjadi const updates = table1.recordUpdates.map((d,i) => { update_row.trigger({ additionalScope: {"i":i}, onSuccess: function(data) { if (i == table1.recordUpdates.length-1) { query1.trigger(); } } }); }); return Promise.all(updates); 1. Selanjutnya, Anda ingin mengubah nilai kolom baru Anda menjadi const updates = table1.recordUpdates.map((d,i) => { update_row.trigger({ additionalScope: {"i":i}, onSuccess: function(data) { if (i == table1.recordUpdates.length-1) { query1.trigger(); } } }); }); return Promise.all(updates); 2, jadi di bidang nilai pembaruan, tambahkan `{ "invite_text_sent". "BENAR" }
Anda selanjutnya harus menghubungkan kueri const updates = table1.recordUpdates.map((d,i) => { update_row.trigger({ additionalScope: {"i":i}, onSuccess: function(data) { if (i == table1.recordUpdates.length-1) { query1.trigger(); } } }); }); return Promise.all(updates); 3 baru ke tombol tindakan di tabel. Dengan tabel yang dipilih, klik Tombol Aksi di inspektur, dan setel kueri Tindakan ke kueri const updates = table1.recordUpdates.map((d,i) => { update_row.trigger({ additionalScope: {"i":i}, onSuccess: function(data) { if (i == table1.recordUpdates.length-1) { query1.trigger(); } } }); }); return Promise.all(updates); 3 baru
Sebagai langkah terakhir, sekali lagi tetapkan read query Anda sebagai on success trigger untuk update query ini, agar data tabel selalu sesuai dengan yang ada di Google sheet
Itu dia. Sekarang, ketika Anda mengklik tombol "Kirim Teks Undangan", Anda akan melihat pembaruan "invite_text_column" dari const updates = table1.recordUpdates.map((d,i) => { update_row.trigger({ additionalScope: {"i":i}, onSuccess: function(data) { if (i == table1.recordUpdates.length-1) { query1.trigger(); } } }); }); return Promise.all(updates); 5 ke const updates = table1.recordUpdates.map((d,i) => { update_row.trigger({ additionalScope: {"i":i}, onSuccess: function(data) { if (i == table1.recordUpdates.length-1) { query1.trigger(); } } }); }); return Promise.all(updates); 2
Pemformatan nilai
Secara default, Retool mengambil data dari Google Sheets sebagai string yang diformat. Misalnya, jika sel spreadsheet Anda memiliki nilai const updates = table1.recordUpdates.map((d,i) => { update_row.trigger({ additionalScope: {"i":i}, onSuccess: function(data) { if (i == table1.recordUpdates.length-1) { query1.trigger(); } } }); }); return Promise.all(updates); 7 yang diformat dalam USD, kueri di Retool dari Google Sheets akan mengembalikan const updates = table1.recordUpdates.map((d,i) => { update_row.trigger({ additionalScope: {"i":i}, onSuccess: function(data) { if (i == table1.recordUpdates.length-1) { query1.trigger(); } } }); }); return Promise.all(updates); 8
Mari kita lihat spreadsheet contoh Undangan Beta kami (kami telah menambahkan satu kolom lagi, const updates = table1.recordUpdates.map((d,i) => { update_row.trigger({ additionalScope: {"i":i}, onSuccess: function(data) { if (i == table1.recordUpdates.length-1) { query1.trigger(); } } }); }); return Promise.all(updates); 9 sehingga kami dapat bekerja dengan nilai numerik)
Saat Anda memeriksa hasil kueri yang dikembalikan dengan mengarahkan kursor ke atasnya, Anda dapat melihat string yang diformat
String yang diformat bekerja dengan baik saat Anda berada
- Menampilkan data dalam tabel persis seperti yang muncul di Google Sheets, dan Anda tidak perlu menggunakan fitur pengurutan atau pemformatan apa pun dari tabel Retool
- Menggunakan format kolom yang didukung oleh Google Sheets yang belum didukung oleh Retool. Berikan kami catatan di [email protected] jika ada permintaan untuk jenis pemformatan lainnya
String yang diformat tidak berfungsi dengan baik saat Anda mencoba menerapkan format kolom Retool ke string tersebut. Misalnya, boolean berformat dari Google Sheets adalah A:Z0 atau A:Z1 , menghasilkan Kotak centang yang selalu dicentang karena kedua nilai bernilai A:Z2
Selain itu, penyortiran kolom apa pun akan berbasis string, yang kemungkinan bukan yang Anda inginkan saat mengurutkan kolom yang berupa angka di spreadsheet Anda, tetapi memformat string saat ditarik ke Retool
Seperti yang Anda lihat, banyak fitur tabel Retool tidak berfungsi dengan baik di luar kotak dengan string yang diformat, jadi kami baru-baru ini membangun kemampuan untuk membaca nilai yang diketik yang tidak diformat dari Google Sheets
Nilai yang diketik tidak diformat
Sekarang, jika spreadsheet Google Anda memiliki beberapa tipe data, seperti boolean dan angka, Anda dapat memilih untuk membaca nilai yang diketik tersebut dengan memilih "Baca data sebagai nilai yang diketik" di bagian Tipe Data dari kueri baca Anda di Editor Kueri. Kami memberi Anda default pada perilaku asli, string yang diformat
Tetapi Anda sekarang dapat beralih untuk membaca dalam nilai yang diketik yang tidak diformat
Berikut adalah contoh mengubah kueri menjadi nilai yang tidak diformat. Anda akan melihat bahwa Retool secara otomatis mendeteksi format kolom dan memungkinkan format lain diterapkan dengan benar. Selain itu, penyortiran sekarang berfungsi seperti yang Anda harapkan
Memperbarui tabel dengan nilai yang tidak diformat
Sebelumnya di tutorial kami, kami membahas cara memperbarui data di spreadsheet Anda dari perubahan di tabel Retool Anda. Jika nilai dalam "Filter menurut" diisi dari tabel, mis. g. A:Z_3, dan tabel tersebut dibaca dari kueri dengan nilai yang tidak diformat, maka kita perlu membuat perbedaan yang sama dalam kueri pembaruan agar kita dapat mencocokkan baris dari spreadsheet Google dengan benar
Sekali lagi, secara default kami akan mencentang "Bandingkan nilai sel spreadsheet yang diformat", tetapi hapus centang seperti pada tangkapan layar di bawah untuk membandingkan melalui nilai yang diketik yang tidak diformat
Memperbarui baris secara massal
Baru. Perbarui spreadsheet secara massal dengan kunci utama
Sebelumnya, memperbarui spreadsheet secara massal dari tabel memerlukan banyak JS khusus di Retool, jadi kami membuat tindakan untuk itu
Pertama, pastikan kumpulan data Anda di Google Sheet Anda memiliki kolom kunci utama — setiap kolom yang memiliki nilai unik per baris adalah kandidat yang baik (mis. g. identitas unik)
Dalam spreadsheet contoh kami, kami dapat menggunakan [ { "name": "Oliver", "phone_number": "907-555-0146", "interested_in_beta_testing": "TRUE", "beta_invite_sent": "FALSE" }, { "name": "Priya", "phone_number": "312-555-0188", "interested_in_beta_testing": "FALSE", "beta_invite_sent": "FALSE" }, { "name": "Asia", "phone_number": "818-555-0173", "interested_in_beta_testing": "TRUE", "beta_invite_sent": "FALSE" }, { "name": "Isaac", "phone_number": "415-555-1045", "interested_in_beta_testing": "TRUE", "beta_invite_sent": "FALSE" } ] _9 sebagai kunci utama
Jika kumpulan data Anda tidak memiliki kunci utama, Anda dapat menambahkan nomor baris sederhana untuk mengidentifikasi baris Anda
Sekarang, katakanlah Anda telah menyiapkan kueri untuk membaca data Anda dari Google Sheet ke dalam tabel
Pastikan bahwa Anda membuat setiap kolom yang ingin Anda ubah dapat diedit (Anda dapat mempelajari lebih lanjut tentang komponen Tabel Retool di Bekerja Dengan Tabel
Sekarang, Anda perlu membuat kueri pembaruan massal dan menyiapkannya agar dipicu saat Anda mengedit tabel
- Pilih Perbarui massal spreadsheet dengan kunci utama dari daftar tindakan
- Tambahkan kunci utama Anda (mis. g. [ { "name": "Oliver", "phone_number": "907-555-0146", "interested_in_beta_testing": "TRUE", "beta_invite_sent": "FALSE" }, { "name": "Priya", "phone_number": "312-555-0188", "interested_in_beta_testing": "FALSE", "beta_invite_sent": "FALSE" }, { "name": "Asia", "phone_number": "818-555-0173", "interested_in_beta_testing": "TRUE", "beta_invite_sent": "FALSE" }, { "name": "Isaac", "phone_number": "415-555-1045", "interested_in_beta_testing": "TRUE", "beta_invite_sent": "FALSE" } ] _9)
- Tambahkan A:Z_6 sebagai Larik baris yang akan diperbarui sehingga Anda menangkap hasil edit yang Anda buat pada tabel
- Pilih kueri tersebut sebagai tindakan Pembaruan massal untuk tabel di bagian Tindakan pembaruan massal di panel sebelah kanan
Terakhir, ingatlah untuk menjalankan kembali kueri baca Anda untuk mengisi tabel Anda dengan nilai yang diperbarui
Sekarang, Anda dapat mengedit beberapa baris sekaligus, klik Simpan Perubahan dan lihat pembaruan tersebut di Google Spreadsheet Anda
Pembaruan massal melalui JS Loop
Jika tindakan untuk memperbarui spreadsheet secara massal dengan kunci utama yang dijelaskan di atas tidak berhasil untuk Anda, kirimkan catatan kepada kami di [email protected] Anda juga masih dapat menggunakan rangkaian petunjuk berikut untuk mengulangi setiap perubahan pada baris dalam tabel,
Inilah tabel yang ada saat ini, setelah sebelumnya membuat semua kolom dapat diedit
Saat Anda mengedit sel apa pun, Retool menambahkan baris yang diperbarui ke larik A:Z7. Selain itu, Anda dapat mengeklik panel kiri untuk melihat nilai A:Z8 kapan saja. Coba ubah status A:Z_9 Priya dari “FALSE” menjadi “TRUE”
Sekarang Anda dapat menulis kueri pembaruan baris yang akan dipetakan ke satu entri di A:Z8. Seperti sebelumnya, Anda perlu memberi tahu Retool baris mana yang akan diperbarui, jadi kami akan menggunakan filter pada [ { "name": "Oliver", "phone_number": "907-555-0146", "interested_in_beta_testing": "TRUE", "beta_invite_sent": "FALSE" }, { "name": "Priya", "phone_number": "312-555-0188", "interested_in_beta_testing": "FALSE", "beta_invite_sent": "FALSE" }, { "name": "Asia", "phone_number": "818-555-0173", "interested_in_beta_testing": "TRUE", "beta_invite_sent": "FALSE" }, { "name": "Isaac", "phone_number": "415-555-1045", "interested_in_beta_testing": "TRUE", "beta_invite_sent": "FALSE" } ] 9 lagi, karena ini adalah nilai kolom unik per baris. Tetapkan nilai pembaruan menjadi A:AB2
Variabel A:AB_3 akan dievaluasi sebagai 0 secara default, menjadikannya pembaruan tunggal untuk baris yang difilter oleh A:AB4. Nilai yang A:AB_5 akan ditulis ke lembar Google Anda, secara efektif menggantikan seluruh baris dengan nilai yang diperbarui dari Retool
Selanjutnya, buat kueri Run JS Code baru untuk memicu kueri A:AB6 untuk setiap item dalam larik A:Z8. Ubah namanya menjadi A:AB_8
Di sini Anda akan menentukan A:AB_3 untuk setiap instance dalam opsi pada Metode JS //docs.google.com/spreadsheets/d/1L2h7HMrHjcpU_-vpT8pGVKNlfBaxh8FUEN-UHXt--mU/edit#gid=00, dan nilai A:AB3 itu akan menimpa nilai default. Jika item tersebut adalah pembaruan terakhir, maka Anda akan memicu kueri baca Anda, query1 , untuk memuat ulang dan menampilkan semua perubahan pada tabel
Berikut kode di atas
const updates = table1.recordUpdates.map((d,i) => { update_row.trigger({ additionalScope: {"i":i}, onSuccess: function(data) { if (i == table1.recordUpdates.length-1) { query1.trigger(); } } }); }); return Promise.all(updates);Langkah terakhir. Tetapkan tabel untuk menggunakan Kueri JS ini sebagai pengaturan "Tindakan pembaruan massal" di inspektur di bawah bagian "Kueri Edit Tabel" dari pengaturan tabel. Itu akan menyebabkan tabel memicu kueri //docs.google.com/spreadsheets/d/1L2h7HMrHjcpU_-vpT8pGVKNlfBaxh8FUEN-UHXt--mU/edit#gid=03 saat tombol "Simpan Perubahan" diklik oleh pengguna