Membuat input data dan tampil data menggunakan Dreamwever
Pada kesempatan kali ini kita akan mempelajari cara membuat sebuah form input data dan tampi data beserta database yang menggunakan xampp, pada sisi layout disini kami menggunakan dreamwever saja agar teman-teman tidak kesulitan.
software yang dibutuhkan pada tutorial kali ini adalah :
- xampp
- dreamwever
- browser (google chrome, mozila, atau yang lain)
Jika semua software yang dibutuhkan sudah siap mari kita mulai, pertama-tama buka xampp anda ; lalu klik mulai pada apache dan mysql
Jika sudah, maka minimize saja xampp, agar tidak mengganggu, langkah berikutnya adalah membuat databasenya. Buka browser (disini saya menggunakan chorme) kemudian ketikan ” localhost/phpmyadmin ” pada tab bar browser, maka akan muncul tampilan berikut :
Sebelumnya Perlu teman-teman ketahui disini saya akan memberikan sebuah contoh input data untuk data mahasiswa yang meliputi id_mahasiswa (primary key), NIM, nama mahasiswa, Program studi, alamat, username , dan password.
Langkah selanjutnya klik new -> lalu beri nama database anda (penamaan bebas, saya menggunakan nama database campus -> kemudian klik create
Setelah menekan create akan muncul tampilan seperti di bawah ini, disini kita akan membuat sebuah table yang berisi data yang saya jelaskan diatas tadi berupa meliputi id_mahasiswa (primary key), NIM, nama mahasiswa, Program studi, alamat, username , dan password (jumlah 7, no 7) dan menggunakan nama table mahasiswa (6) lalu klik go (8)
Setelah menekan create akan muncul tampilan seerti di bawah ini, disini kita akan membuat sebuah table yang berisi data yang saya jelaskan diatas tadi berupa meliputi id_mahasiswa (primary key), NIM, nama mahasiswa, Program studi, alamat, username , dan password (jumlah 7, no 7) dan menggunakan nama table mahasiswa (6) lalu klik go (8)
Setelahnya klik save (scroll kebawah)
Jika pada sebelah kiri jendela browser anda sudah ada database beserta tabel seperti dibawah ini berarti anda sudah sukses membuat database dan siap digunakan untuk membuat Input data
Ok sampai disini kita sudah berhasil membuat databasenya, dan daya harap temen-temen tidak ada yang kesulitan paling tidak sampai tahapan ini. sekarang minimize browser anda lalu buka dreamweaver anda karena kita akan membuat tampilannya. Pada jendela awal dreamwever pilih PHP
(catatan: sebelum membuka dreamwever sebaiknya anda menyiapkan sebuah folder di dalam disc anda, penempatan bebas noleh D,E,F fungsinya untuk penyimpanan data kita nanti)
Setelah dreamwever terbuka langkah selanjutya adalah membuat sebuah site baru, klik pada site > new site maka akan muncul tampilan seperti di bawah ini. Kemudian pada local info isikan name site, local root folder arahkan pada folder yang sudah anda buat tadi dan pada HTTP addres isikan localhost.
Jika pada local info sudah selesai maka kita akan beranjak ke remot info (bawah local info) pada acces pilih local host. Lalu pada remote folder arahkan ke disc C > xampp > htdocs > xampp. Dan cheklis seperti gambar di bawah ini
Terakir pada new site ini adalah menyetting testing server, pada server model pilih php mysql dan pada acses pilih local/network. Kemudian klik ok
Setelaah itu kemudian kita akan mengyambungkan deamwever dengan database yang sudah kita buat tadi, caranya lihat pada sebelah kanan bar menu dreamwever pilih application > database > pilih mysql connection
Setelah mysql connection tampil maka isilah sesuai dengan gambar dibawah ini, untuk form database arahkan ke database campus
Untuk mengetahui berhasil tersambung dengan database atau belum bias dicoba dengan klik tombol test, jika sudah ada dialog sukses berarti kita sudah berhasil.
Setelah berhasil menyambungkan dengan database kita lanjutkan dengan membuat tampilan input data
- Buat form, insert > form
- Buat table sebanyak 7 colom, seperti gambar dibawah ini
- Dan buat seperti ini
Langkah selanjutnya adalah menyingkronkan antara text field dengan struktur table dalam database, caranya klik pada text field nim dan lihat pada bar menu paling bawah isikan sesuai pada nama pada struktur table (text field = nim)
Lakukan langkah yang sama pada setiap text field, isikan nama sesuai nama stuktur table pada database.
Setelah semua text field sudah diberi nama kemudian kita atur button, seperti gambar dibawah ini
Pada tombol reset pengaturannya sedikit berbeda yaitu seperti gambar dibawah ini
Setelah itu buat recorset pada server behavior,Pilih insert record pada tampilan connection pilih connection dengan nama campus dan pada after inserting go to arahkan ke tampil.php (Jika belum membuat tampil.php langkah ini bias dilakukan setelah membuatnya)
Sampai tahap ini kita sudah berhasil membuat tampilan input data, simpan terlebih dahulu file tersebut dengan nama input.php pada folder campus yang kita buat tadi
Selanjutnya yaitu membuat file untuk tampil data, yaitu dengan file > new > php dan simpan terlebih dahulu dengan nama tampil.php pada folder yang sama dengan tampil.php tadi
Setelah menyimpan maka kita akan membuat tampilan tampil.php, seperti gambar di bawah ini
Setelah membuat tampilan, kemudian buatlah recordset seperti gambar dibawah ini
Sesudah berhasil membuat recordset, sekarang isikan masing-masing recorset sesuai nama formnya
Dan sekarang kita sudah menyelesaikan form input data dan tampil data, simpan terlebih dahulu pekerjaan anda lalu coba run dengan browser pada file input.
Leave a Reply