Cara Mendesain Form Tambah Berbasis GUI Untuk PHP Dengan Macromedia Dreamweaver 8

Kupas Tuntas Kuliah Jurusan Sistem Informasi

Sebagian orang suka membuat desain menggunakan script. Memang ini akan bermanfaat karena di Notepad juga sudah bisa dilakukan. Namun bagi pemula, kadang-kadang mengingat coding/script itu masih agak sulit, sehingga akan terasa lebih mudah jika menggunakan software seperti Dreamweaver.

Dalam Dreamweaver juga kita bisa membuat desain langsung menggunakan script, namun kita juga bisa membuat desain dengan berbasis GUI (klik sana, klik sini, seperti kita membuat struktur organisasi di Microsoft Word).

Mari saya mulai latihannya:

1.      Buka Macromedia Dreamweaver 8

2.      Buat file tambah_entri_gui.php

3.      Pastikan halaman Desin yang aktif (atau bisa diklik saja tab Design)

4.      Klik Insert – Form – Form

5.      Klik Insert – Table

6.      Ubah setting menjadi:

Rows: 5

Columns: 3

Border thickness: 0

7.      OK

8.      Buatlah desain seperti ini:

Kode Barang	:
Nama Barang	:
Harga	:
Keterangan	:

Keterangan:

Untuk menggabungkan tiga cell pada baris 5:

·         Blok A5:C5 (baris yang terakhir)

·         Klik kanan

·         Klik Table

·         Klik Merge Cells

9.      Klik C1 (Di depan tulisan Kode Barang)

10.  Klik Insert – Form – Text Field – OK

11.  Langkah 10 di atas ulangi untuk meletakkan kotak di depan tulisan Nama Barang, Harga, dan Keterangan

12.  Klik Baris kelima (di bawah tulisan Keterangan)

13.  Klik Insert – Form – Button – OK

14.  Muncul tombol yang bertuliskan Submit

15.  Klik tombol Submit tersebut

16.  Di bawah, ada tulisan Value. Ganti tulisan “Submit” dengan tulisan “Simpan”

17.  Perhatikan gambar berikut:

Agar desain di atas dapat digunakan untuk menginput data, kita hanya menambahkan sedikit script, yaitu:

a.       Klik tab Code

b.      Di depan tulisan <form

Ketik action="tambah.php" (tambah.php sesuaikan dengan file masing-masing)

c.       Kemudian tulisan textfield1 (pada name="textfield1") diganti dengan nama field yang ada di tabel database kita, misal: KodeBarang (Hasilnya seperti ini: name="KodeBarang"

Perhatikan gambar berikut:

Keterangan:

Pada gambar di atas, yang harus diubah adalah yang ditandai merah.

"Boleh Konsultasi Masuk Jurusan Sistem Informasi via IG atau Tiktok."

Tips Skripsi Program Studi Sistem Informasi