PROJECT SEDERHANA JAVASCRIPT #7 MODUL 7

 



Route Generator Web Page





  1. 1)Textarea Input: Terdapat sebuah textarea di mana pengguna dapat memasukkan data trayek. Lebar dan tinggi textarea ditentukan oleh CSS.

  2. 2)Generate dan Reset Buttons:

    • Tombol "Generate Trayek" memanggil fungsi generateTrayek() untuk mengolah dan menampilkan data trayek.
    • Tombol "Reset Trayek" memanggil fungsi resetTrayek() untuk mengosongkan textarea.

  3. 3)Tabel Hasil Trayek:

    • Tabel digunakan untuk menampilkan hasil trayek dalam dua kolom: "No" dan "Trayek."
    • Setiap baris tabel menunjukkan nomor urut dan detail trayek.

  4. 4)JavaScript Functions:

    • generateTrayek(): Mengambil data trayek dari textarea, membersihkan hasil sebelumnya, dan menampilkan hasil trayek dalam tabel.
    • resetTrayek(): Mengosongkan textarea.

  5. 5)Data Processing:

    • Data trayek diambil dari textarea, dipisahkan berdasarkan koma, dan ditampilkan dalam tabel.

Halaman ini memberikan penggunaan sederhana untuk memasukkan data trayek dan melihat hasilnya dalam bentuk tabel pada halaman web.


PREVIEW AND SOURCE CODE:

https://github.com/2ndmurphy/Route-Generator-Web-Page




Komentar

Posting Komentar

Postingan populer dari blog ini

PROJECT SEDERHANA JAVASCRIPT #14 MODUL 8

Gambar
 Inventory with pages Body Section: <body> : Bagian utama yang berisi elemen-elemen yang akan ditampilkan di halaman web. Input form untuk memasukkan data barang. Tabel untuk menampilkan data barang. Daftar untuk menampilkan navigasi halaman (pagination). <script> : Bagian ini berisi script JavaScript untuk mengatur logika interaksi pengguna. JavaScript Section: Variabel seperti dataStore , itemsPerPage , dan currentPage digunakan untuk menyimpan data dan mengatur pagination. Fungsi tambahData() : Menambahkan data ke tabel ketika tombol "Tambah" ditekan. Fungsi editBaris() : Mengubah baris tabel menjadi form input untuk pengeditan. Fungsi saveBaris() : Menyimpan perubahan setelah pengeditan. Fungsi hapusBaris() : Menghapus baris dari tabel. Fungsi tampilkanData() : Menampilkan data pada tabel dan membuat navigasi halaman. Load Data on Page Load: Terdapat pemanggilan fungsi tampilkanData() untuk menampilkan data saat halaman dimuat. Dokumen ini memberikan fungsio...
Baca selengkapnya