Membuat Tampil, Input, Edit dan Hapus Data dengan

DreamweaverSaiful Isnandar, MTI

Tampil Data Tampil Data

Input Data

Edit Data

Hapus Data

Keluar

Pastikan bahwa xampp (apache dan Mysql sudah Running), Koneksi sudah benar serta database telah konek

Tampil Data

Input Data

Edit Data

Hapus Data

Keluar

Tambahkan folder baru pada Site berturut-turut Server dan didalam Server buat News Tampil Data

Input Data

Edit Data

Hapus Data

Keluar

Klik kanan disini

Pilih New Folder

Buat seperti ini

Pada Folder News buat New File dengan tampilan sebagai berikut Tampil Data

Input Data

Edit Data

Hapus Data

Keluar

Klik kanan disini

Pilih New File

Buat 4 file seperti ini

Buka file Tampil.phpTampil Data

Input Data

Edit Data

Hapus Data

Keluar

Klik 2x file Tampil.php

Pada Panel Application, pilih BindingTampil Data

Input Data

Edit Data

Hapus Data

Keluar

Klik pada tanda + kemudian pilih Recordser(Query)

Klik pilihan ini

Klik tanda ini

Buat settingan seperti iniTampil Data

Input Data

Edit Data

Hapus Data

Keluar

Klik OK

Hasilnya pada Panel Application dan Tab Binding akan tampil seperti dibawah ini Tampil Data

Input Data

Edit Data

Hapus Data

Keluar

Lihat kembali tampilan Tampil.php, ketikkan seperti dibawah ini Tampil Data

Input Data

Edit Data

Hapus Data

Keluar

Blok pada teks “Tambah Baru” kemudian pada Properti Link ketikkan Tambah.php kemudian Enter

1 2

3

45

Letakkan kursor pada bagian bawah Tambah BaruTampil Data

Input Data

Edit Data

Hapus Data

Keluar

Pilih Tool Dynamic Table pada Application

Atur propertinya seperti dibawah iniTampil Data

Input Data

Edit Data

Hapus Data

Keluar

Recordset yang

ditampilkan

Jumlah data yang akan

tampil

Border atau Bingkai pada

Table

Jarak antara garis tabel

dengan Teks

Jarak antar Cell

Klik OK

Hasilnya :Tampil Data

Input Data

Edit Data

Hapus Data

Keluar

Hapus pada kolom isi, agar data yang ditampilkan tidak terlalu lebar kebawah dikarenakan isi dari Field Isi memang beisi banyak teks

Tampil Data

Input Data

Edit Data

Hapus Data

Keluar

1

2

3

Blok Kolom Isi

Klik kanan pilih[Table] >[Delete

Coloumn]

Hasilnya Kolom Isi sudah terhapus

Simpan kemudian Tekan F12 maka hasilnya akan seperti dibawah iniTampil Data

Input Data

Edit Data

Hapus Data

Keluar

Ubah Warna background pada setiap Cell dengan mengganti Properti BgColor Tampil Data

Input Data

Edit Data

Hapus Data

Keluar

1

Blok Baris Judul (baris pertama)

2

Setting propertinya

sebagai berikut

3

Hasilnya

4

Dengan langkah yang hampir sama buat

untuk isi (baris kedua)

Simpan kemudian Tekan F12 di keyboard maka hasilnyaTampil Data

Input Data

Edit Data

Hapus Data

Keluar

Membuat Link Edit dan HapusTampil Data

Input Data

Edit Data

Hapus Data

Keluar

1

Ubah Kolom No menjadi

Aksi

Ubah pula Isinya

menjadi Edit - Hapus

2

Tampil Data

Input Data

Edit Data

Hapus Data

Keluar

Blok Teks Edit

Ketikkan link seperti berikut

Teks Edit.php ini karena halaman yang kita buat adalah Edit.php jadi sesuaikan

dengan nama file

Ubah tampilan menjadi Code

Tampil Data

Input Data

Edit Data

Hapus Data

Keluar

Perhatikan Code berikut

Tarik Field No ini letakkan ke dalam rumus

atau kode diatas setelah =

Hasilnya

Lakukan hal yang sama dengan Link Hapus

Tampil Data

Input Data

Edit Data

Hapus Data

Keluar

Simpan kemudian Tekan F12 dikeyboardTampil Data

Input Data

Edit Data

Hapus Data

Keluar

Input Data Tampil Data

Input Data

Edit Data

Hapus Data

Keluar

Tampil Data

Input Data

Edit Data

Hapus Data

Keluar

Buka file Tambah.php

Tampil Data

Input Data

Edit Data

Hapus Data

Keluar

Ubah tampilannya

menjadi Design

Pada Toolbar Application Pilih

Record Insertion Form Wizard

Sesuaikan dengan koneksi Database yang

dibuatSesuaikan

dengan Table yang akan dibuat

Inputan

Halaman yang berfungsi

menampilkan data

Tampil Data

Input Data

Edit Data

Hapus Data

Keluar

Setting pada Field No dengan Display as = Hidden FiledSetting pada Field

No dengan Display as = Hidden Filed

Tampil Data

Input Data

Edit Data

Hapus Data

Keluar

Field Display As Value

Id_kat TextField

Judul TextField

Pengirim TextField

Isi TextArea

Tgl HiddenField <?php echo date('d-m-Y'); ?>

Gb TextField

Wktu HiddenField <?php echo date(‘h:i:s'); ?>

Baca HiddenField <?php echo ‘1’; ?>

Bulan HiddenField <?php echo date(‘M'); ?>

Ubah semua Field dengan Setting seperti dibawah ini

Tampil Data

Input Data

Edit Data

Hapus Data

Keluar

Klik OK

Tampil Data

Input Data

Edit Data

Hapus Data

Keluar

Hasilnya :

Tampil Data

Input Data

Edit Data

Hapus Data

Keluar

Tampil Data

Input Data

Edit Data

Hapus Data

Keluar

Tampil Data

Input Data

Edit Data

Hapus Data

Keluar

Edit Data Tampil Data

Input Data

Edit Data

Hapus Data

Keluar

Hapus Data Tampil Data

Input Data

Edit Data

Hapus Data

Keluar