JOBSHEET Koneksi PHP dan MySQL
Mata Pelajaran Web Programming
Kelas XII RPL
Sub Materi:
1. Perintah koneksi antara basisdata dan php
2. Perintah SQL memasukkan data dari web ke dalam basisdata
Persiapan :
1. Persiapkan XAMPP dan pastikan bahwa Apache berjalan.
2. Persiapkan folder belajar_koneksi yang tersimpan di dalam folder xampp\htdocs
3. Persiapkan dreamweaver
4. Persiapkan Web browser
Langkah Praktikum:
A. Membuat file koneksi antara basis data dengan php
1. Buka dreamweaver > pilih php
2. Hapus semua skrip HTML, kemudian ketikan skrip koneksi berikut:
3. Simpan dengan nama koneksi.php di folder belajar_koneksi
4. Untuk mengecek apakah koneksi berhasil atau tidak, ketikkan pada address bar:
5. Koneksi berhasil jika dia tidak ada tulisan apa-apa
6. Coba jika $db_name diganti dengan nama database lain yang tidak ada.
Misal, “si_rumahsakit”, kemudian Save
7. Refresh localhost/belajar/belajar_koneksi/koneksi.php
Hal tersebut terjadi karena tidak ada database “si_rumahsakit” dalam server
localhost.
8. Jangan lupa! Kembalikan file koneksi.php seperti semula
$db_name = “si_perpustakaan” kemudian Save.
B. Membuat file tampilan untuk memasukkan data ke dalam database
1. Buka dreamweaver > pilih php
2. Sekarang kita akan membuat tampilan web seperti di bawah ini
3. Pertama, buat terlebih dahulu form. Klik simbol seperti ini
Atau klik menu insert form form
4. Ketikkan NIS pada design, kemudian masukkan textfield dengan cara klik
Atau klik menu insert form text field klik OK
5. Ketikkan Nama pada design, kemudian masukkan textfield dengan cara klik
Atau klik menu insert form text field klik OK
6. Ketikkan Jenis Kelamin, kemudian masukkan select (list/menu) dengan cara klik
Atau klik menu insert form select (list/menu) klik OK
7. Ketikkan Alamat pada design, kemudian masukkan textarea dengan cara klik
Atau klik menu insert form textarea klik OK
8. Terakhir, masukkan tombol submit dengan cara klik
Atau klik menu insert form button klik OK
Setelah semua dibuat, tinggal atur setiap atribut nama setiap inputan.
9. Split tampilan dreamweaver, sehingga dapat melihat code dan design
10. Klik inputan yang berada di pinggir NIS, kemudian ganti name di code dengan
NIS
11. Klik inputan yang berada di pinggir Nama, kemudian ganti name di code dengan
nama
12. Klik inputan yang berada di pinggir Jenis Kelamin
13. Kemudian klik List Value yang berada di bawah (di bagian properties)
14. Tambahkan seperti di bawah
Untuk menambahkan baris, klik tanda tambah.
15. Klik OK
16. Ganti name dalam code dengan jk
17. Klik inputan yang berada di pinggir Alamat, kemudian ganti name di code dengan
alamat
18. Terakhir, klik <form> yang berada di bagian bawah code
19. Ganti Action= “tambahsiswa.php” dan method=”post”
20. Save di folder belajar_koneksi dengan nama siswa.php
C. Membuat file aksi untuk menambahkan data ke basisdata
1. Buat halaman php baru
2. Buat tampilan dreamweaver menjadi code
3. Hapus semua skrip HTML
4. Ketikkan skrip berikut
5. Masih disimpan di folder belajar_koneksi dengan nama tambahsiswa.php
6. Masuk ke web browser, ketikkan di address bar :
Localhost/belajar_koneksi/siswa.php
7. Masukkan data siswa, Ingat jangan sampai ada NIS sama yang dimasukkan!
8. Klik Submit
9. Jika berhasil, maka tidak ada tulisan apapun.
10. Untuk mengecek apakah sudah masuk atau belum datanya, lihat di
Localhost/phpmyadmin
11. Pilih si_perpustakaan tabel siswa
12. Maka ada tambahan data yang dimasukkan melalui webbrowser
Tugas:
Buatlah seperti web di atas untuk memasukkan data di tabel buku!
Cumungut eaa ceman-ceman..
Top Related