Pada kesempatan kali ini saya akan menjelaskan cara input data statis dengan jquery. Perlu teman-teman ketahui lagi sebelumnya, untuk menginput data statis dengan jquery kedalam tabel teman-teman bisa menggunakan method appendTo. dari method tersebut bisa teman-teman manfaatkan untuk menambahkan td (table data) sebagai pembungkus dari data yang dimasukan di form input. Pada contoh kasus disini saya membuat form inputan yang terdiri dari satu buah komponen input text. dari nilai yang dimasukan pada komponen input text tersebut nantinya dimasukan kedalam tabel yang ada dibawah form tersebut.

Untuk memasukan nilai inputan text tersebut ke dalam tabel, teman-teman bisa memanfaatkan method jquery appaendTo. Untuk method tersebut fungsinya adalah untuk menambahkan element baru setelah element yang dijadikan sebagai acuannya. dan dari method bisa teman-teman terapkan di kasus lainnya yang lebih kompleks dari kasus yang saya buat disini.

Langsung saja untuk membuatnya, teman-teman bisa ikuti tahapan yang saya berikan dibawah ini.

Berikut Tahapannya

  • Teman-teman buat terlebih dahulu satu buah file dengan nama index.html
  • Selanjutnya ketikan kode seperti berikut :

  • Selanjutnya jika sudah, teman-teman save terlebih dahulu file tersebut dan lihat hasilnya melalui browser.
  • Maka akan menampilkan output seperti berikut :

cara input data statis dengan jquery

  • Untuk mengujinya, teman-teman isi data tersebut dengan data-data nama lengkap, dan klik tombol Simpan.

Sampai disini penjelasan saya mengenai cara input data statis dengan jquery, semoga bermanfaat.

WhatsApp chat