Macromedia DREAMWEAVER

Transkripsi

1 Praktikum 13 Macromedia DREAMWEAVER A. MENAMPILKAN DATA Membuat Recordset Untuk Halaman Penampilan Data : 1. Buat halaman PHP baru. 2. Buka panel Server Behavior dengan mengklik window>servers Behaviors. 3. Pada panel Server Behaviors klik tombol +, lalu pilih Recordset. 4. Isikan setiap item pada kotak dialog recordset seperti pada latihan pemasukan data sebelumnya, Namun pada bagian input Box Sort masukan no. 5. Klik Test untuk mengujinya. Jika berhasil Klik Ok. 6. Setelah proses pembuatan recordset selesi pada panel behavior muncul rs_karyawan Tampilan Layout Untuk Halaman Penampilan Data : 1. Buat sebuah tabel dengan 5 kolom dan 2 baris. 2. Berikan warna bgcolor table:#000000, bgcolor judul: #CCCCCC, bgcolor data: #FFFFFF. Ukuran Border: 0, Cellpadding: 0, Cellspacing:1. 3. Pada setiap kolom di baris pertama masukan teks secara berurutan No, Nama, Gaji, Status, Jumlah Anak. Politeknik Pos Indonesia 1

2 Membuat Data Binding : 1. Klik menu Window> Bindings untuk menampilkan panel binding. 2. Klik tanda + disamping tulisan Recordset (rs_karyawan) maka akan muncul fieldfield dari table karyawan. 3. Seret field satu persatu pada baris kedua sesuai dengan judul kolomnya misal field no dibawah judul No dst. 4. Simpan dengan nama file view_data.php. Menampilkan Sejumlah Data Tertentu Pada Halaman Web : 1. Bloklah baris kedua pada tabel. 2. Pada panel Server Behaviors klik +, lalu pilih Repeat Region. 3. Masukan data pada TextField di jendela Repeat Region dengan ketentuan sebagai berikut : 4. simpan perubahan file. Membuat Navigasi : 1. Letakan kursor dibawah table data. 2. Klik menu Insert > Application Objects > Recordset Navigation Bar. Masukan data seperti dibawah ini. 3. Simpan perubahan file. Membuat Status Navigasi Data : 1. Letakan kursor diantara table dan navigasi. 2. Klik menu Insert > Application Objects > Recordset Navigation Status. Masukan Recordset dengan rs_karyawan lalu klik Ok. 3. Simpan perubahan file. Membuat Link Ke Halaman Detail : Pada halaman view_data.php sorot rs_karyawan_nama di kolom pertama baris kedua. Pada property link masukan kode berikut : detail_page.php?no=<? echo $row_rs_karyawan[ no ];?> Politeknik Pos Indonesia 2

3 Membuat Halaman Detail : 1. Buat halaman baru detail_page.php. 2. Tampilkan panel Server Behaviors, klik tombol + lalu klik menu Recordset. 3. Isikan setiap nilai seperti yang sebelumnya, pada bagian filter diisi seperti pada gambar. 4. Buat table dengan 5 kolom dan 2 baris. 5. Masukan setiap nama field pada kolom pertama dari baris pertama sampai baris terakhir. 6. Pada panel Server Bindings, klik + kemudian seret setiap field pada panel bindings ke tabel kolom kedua sesuai dengan teks di kolom pertama. 7. Simpan dengan nama file detail_page.php. B. MEMBUAT HALAMAN EDIT DATA Membuat Link Untuk Edit Data : 1. Buka halaman file view_data.php, letakan kursor di dalam kolom Jumlah Anak lalu klik kanan mouse, pilih Table> Insert Rows or Columns 2. Pada kotak dialog masukan nilai sebagai berikut: 3. Masukan Judul Kolom dengan nama judul edit, dibawahnya masukan teks edit kemudian blok teks tersebut dan masukan link pada property teks sebagai berikut: form_edit.php?no=<? echo $row_rs_karyawan[ no ];?> 4. Save file untuk menyimpan perubahan. Politeknik Pos Indonesia 3

4 Membuat Recordset Untuk halaman Edit : 1. Buat halaman PHP baru. 2. Aktifkan panel Server Behaviors. Klik tombol +, dan pilih Recordset. Dan buatlah recordset seperti biasanya tapi pada bagian filter diisi data sebagai berikut. 3. Klik Ok. 4. Simpan dengan nama file form_edit.php. Membuat Lay Out halaman Edit : 1. Masih pada halaman form_edit.php. Masukan form untuk input data. 2. Buat tabel dengan jumlah kolom 2 dan baris 6 di dalam form. 3. Masukan teks sesuai dengan nama field tabel karyawan pada kolom pertama dari baris pertama sampai baris kelima. 4. Masukan Text Field, beri nama sesuai dengan nama teks pada kolom pertama dan letakan di kolom kedua disamping text judul. 5. Buka panel Bindings lalu seret setiap setiap field tabel karyawan ke masingmasing TextField yang sudah dibuat. 6. Masukan tombol submit dengan label Update di kolom kedua baris ke enam. 7. Save perubahan file. Behavior Untuk Edit : 1. Buka halaman form_edit.php, buka panel behaviors klik tombol + dan pilih Update Record. 2. Pada jendela update record isikan itemitem seperti pada gambar. Klik Ok. 3. Save file hasil perubahan. Politeknik Pos Indonesia 4

5 C. MEMBUAT HALAMAN HAPUS DATA Membuat Link Untuk Hapus Data : 1. Buka halaman file view_data.php, buatlah kolom baru setelah kolom edit dengan cara seperti proses membuat kolom untuk edit. 2. Masukan Judul Kolom tersebut dengan teks Delete. 3. Dibawah kolom judul Delete masukan teks Delete, kemudian blok teks tersebut dan masukan link pada property teks tersebut dengan : form_delete.php?no=<? echo $row_rs_karyawan[ no ];?> 4. Save file untuk menyimpan perubahan. Membuat Recordset Untuk Hapus data : 1. Buat halaman php baru. 2. Aktifkan panel Behaviors. Klik tombol + lalu pilih recordset. Buatlah recordset seperti pembuatan recordset pada halaman edit. 3. Simpan dengan nama file form_delete.php. Membuat layout untuk hapus Data : 1. Masih pada halaman form_delete.php. Masukan form untuk melakukan input data. 2. Buat table dengan jumlah kolom 2 dan baris Masukan teks sesuai dengan nama field tabel karyawan pada kolom pertama, dari baris pertama sampai baris kelima. 4. Masukan TextField dan beri nama sesuai dengan nama teks pada kolom pertama, letakan di kolom kedua disamping text judul. 5. Buka panel Bindings lalu seret setiap setiap field tabel karyawan ke masingmasing TextField yang sudah dibuat. 6. Masukan tombol submit dengan label Delete di kolom kedua baris terakhir. 7. Simpan file. Politeknik Pos Indonesia 5

6 Membuat Behavior Untuk Hapus Data : 1. Pada file halaman form_delete.php, buka panel Behaviors lalu klik tombol + dan pilih Delete Record. 2. Pada jendela Delete Record isikan itemitem seperti di bawah ini: 3. Klik Ok. 4. Save perubahan file. D. MEMBUAT HALAMAN PENCARIAN DATA Membuat Form Pencarian Data : 1. Buka halaman view_data.php. 2. Letakan kursor diatas table lalu masukan sebuah form dengan method POST, action result_data.php. 3. Di dalam form tersebut masukan teks Nama, input teks dengan name : nama dan tombol submit dengan isi Label Cari. 4. Save perubahan file. Membuat Halaman Untuk Hasil Pencarian Data : 1. Buat halaman php baru. 2. Tampilkan panel Server Behaviors, Klik tombol +, pilih recordset. Isikan setiap item seperti dibawah ini. 3. Buatlah table dengan jumlah kolom 2 dan jumlah baris Masukan teks pada kolom pertama dengan nama field table dari baris pertama sampai baris ke lima. Politeknik Pos Indonesia 6

7 5. Tampilkan panel Bindings, pada bagian detail conn_karyawan seretlah setiap nama field tersebut ke dalam tabel kolom ke dua sesuai dengan teks pada kolom pertama. 6. Blok table. 7. Buka panel Server Behaviors, klik tombol + pilih Repeat Region. Pastikan nama recordset adalah conn_karyawan dan isikan Show dengan Klik Ok. Sehingga akan tampil teks Repeat seperti pada gambar. 9. Simpan file dengan nama result_data.php. TUGAS Buatlah halaman untuk : Menampilkan data Edit data Delete data Pencarian data Field Tipe Data Primary Key npm Char(10) Yes nama Varchar(30) matkul Varchar(30) nilai_matkul Integer pada table tnilai pada database dbnilai (lanjutan tugas praktikum Dreamweaver I). Politeknik Pos Indonesia 7