8 Memanipulasi tabel
Gambar 5-8 Memanipulasi tabel
Rangkuman
4. Untuk memanipulasi elemen – elemen yang ada dalam halaman web dapat menggunakan CSS (Cascading Style Sheets)
5. Terdapat 3 (tiga) penempatan CSS pada halaman web dengan perbedaan – perbedaan yang ditampilkan pada tabel perbandingan di bawah ini :
Inline Style Embedded Style Linked Style Sheet
Sheet Penulisan CSS
Sheet
Dalam elemen Menjadi bagian Terpisah dengan / tag pada file header dari file file HTML HTML
HTML
Pengubahan Pada setiap tag Pada bagian Pada file yang style
pada tiap file header tiap file digunakan untuk HTML
HTML
menyimpan style-nya
saja, tanpa merubah file HTML
Penggunaan Hanya satu Memungkinkan Memungkinkan property
property yang penggunaan
penggunaan bisa digunakan
sekaligus Kemudahan
sekaligus
mudah Paling mudah, peng-update-an
Lebih
susah Lebih
karena harus daripada inline karena style
sheet pengubahan semua
mengganti
style
style karena
yang style dilakukan
pada tag yang pengubahan
pada satu file ada dalam file style dilakukan saja HTML
6. Dalam memanipulasi objek – objek yang ada pada file HTML, diperbolehkan menggunakan beberapa property secara bersamaan.
Jurnal
Amati penggunaan CSS pada website yang sudah Anda pilih, kemudian lakukanlah modifikasi – modifikasi style pada website tersebut. Minimal modifikasi yang dilakukan adalah 15 (lima belas) bentuk, kemudian tulis dan laporkan modifikasi yang Anda lakukan dan perubahan yang dihasilkan dari modifikasi tersebut.
6 Javascript -1
7 Javascript -2
8 Object, Frame dan Form pada JavaScript
Overview
Untuk menangani permintaan dan pengolahan input data dari user, JavaScript menyediakan objek-objek yang dapat digunakan sesuai kebutuhan. Pada sebuah web berbasis basisdata, dibutuhkan pula penanganan form validasi input dari user dan kemudian dilakukan pengiriman ke server.
Tujuan
1. Mengerti esensi penggunaan Objek dalam JavaScript.
2. Mampu menciptakan objek sendiri.
3. Mampu membuat properti dan metoda untuk suatu objek.
4. Mampu menggunakan objek-objek bawaan pada JavaScript.
5. Memahami Hirarki Objek Browser dan Objek HTML.
6. Mengenal Macam-macam Objek Browser pada JavaScript.
7. Mengerti esensi penggunaan Frame dalam JavaScript.
8. Mengerti esensi penggunaan Form dalam JavaScript.
9. Mampu memecahkan masalah dengan menggunakan Frame dan Form serta mengimplementasikan ke dalam program JavaScript.
8.1 Penggunaan Object
Cara mendefinisikan objek :
nama_objek.nama_properti
Mendefinisikan objek dengan fungsi :
function nama_objek(nama_properti1, nama_properti2) {
this.nama_properti1 = nama_properti1; this.nama_properti = nama_properti2;
Contoh :
<HTML> <HEAD> <TITLE> ::Menciptakan Objek:: </TITLE> <SCRIPT LANGUAGE="JavaScript"> <!-- // Definisi objek Mahasiswa function Mahasiswa(NIM, Nama, Umur) {
this.NIM
= NIM;
this.Nama
= Nama;
this.Umur
= Umur;
//Menulis properti-properti objek function Tulis (objek) {
for (var j in objek) document.writeln (objek[j]); document.writeln (" "); }
//--> </SCRIPT></HEAD>
<BODY> <SCRIPT LANGUAGE="JavaScript"> <!--
document.writeln ("<PRE>");
// menciptakan instan objek mahasiswa var Mahasiswa1 = new Mahasiswa("90401010", "Adhit", 18); var Mahasiswa2 = new Mahasiswa("90101013", "Budi", 18); var Mahasiswa3 = new Mahasiswa("90201025", "Wati", 19);
//menuliskan masing-masing instan objek ke jendela browser document.writeln ('Nilai objek Mahasiswa1'); Tulis (Mahasiswa1); document.writeln ('Nilai objek Mahasiswa2'); Tulis (Mahasiswa2); document.writeln ('Nilai objek Mahasiswa3'); Tulis (Mahasiswa3); /*mengisi kembali objek Mahasiswa1 dengan nilai baru
--> array assosiatif */
document.writeln ('Nilai Baru objek Mahasiswa1'); Mahasiswa1["NIM"] = "90401056"; Mahasiswa1["Nama"] = "Faishal"; Mahasiswa1["Umur"] = 17;
Tulis (Mahasiswa1);
document.writeln ("</PRE>"); //--> </SCRIPT> </BODY> </HTML>
Output :
8.1.1 Metoda
Pada JavaScript kita dapat membuat satu metoda untuk satu jenis objek yang kita buat sendiri, dengan menggunakan fungsi sebagai properti dari satu objek, perhatikan contoh di bawah ini :
<HTML> <HEAD> <TITLE> ::Menciptakan Objek:: </TITLE> <SCRIPT LANGUAGE="JavaScript"> <!--
// Definisi objek Mahasiswa function Mahasiswa(NIM, Nama, Umur) {
//deklarasi properti this.NIM = NIM; this.Nama = Nama; this.Umur = Umur;
//deklarasi metoda this.Universitas = UniversitasObj; this.TampilkanInfo = TampilkanInfo;
//Menulis properti-properti objek function Tulis (objek) {
for (var j in objek) document.writeln (objek[j]); document.writeln (" "); }
//metoda universitas function UniversitasObj(NamaUniv, AlamatUniv) {
this.NamaUniv = NamaUniv; this.AlamatUniv = AlamatUniv;
//menampilkan info function TampilkanInfo() {
alert(this.Nama + ' dengan NIM: ' + this.NIM + ', kuliah di : ' + this.NamaUniv + ' alamat : ' + this.AlamatUniv); }
//--> </SCRIPT></HEAD>
<BODY> <SCRIPT LANGUAGE="JavaScript"> <!--
document.writeln ("<PRE>");
// menciptakan instan objek mahasiswa var Mahasiswa1 = new Mahasiswa("30401010", "Adhit", 18); var Mahasiswa2 = new Mahasiswa("30101013", "Budi", 18); var Mahasiswa3 = new Mahasiswa("30201025", "Wati", 19);
// mengisi metoda Universitas pada objek Mahasiswa1 Mahasiswa1.Universitas("Politeknik Telkom", "Jl.Telekomunikasi No.1 Bandung");
Mahasiswa1.TampilkanInfo();
document.writeln ("</PRE>");
//--> </SCRIPT> </BODY> </HTML>
Output :
Untuk menghapus instan objek yang telah kita buat yaitu dengan memberi nilai null, contoh :
Mahasiswa1 = null; Mahasiswa2 = null; Mahasiswa3 = null;
8.1.2 Object Browser
Objek ini telah disediakan oleh JavaScript, sehingga memudahkan programmer untuk penggunaannya. Berikut ini adalah contoh penerapannya :
<HTML> <HEAD> <TITLE> ::Properti Status dari Objek window:: </TITLE> <SCRIPT LANGUAGE="JavaScript"> <!-- var tanda
= 0; var posisi = 0; var IsAnim = false; var IsKanan = true; var kata
function evTimeOut(){ if (IsKanan) status = kata.substring(0,posisi); else status = kata.substring(posisi, posisi + kata.length);
if (posisi++ > kata.length) { posisi
IsKanan = !IsKanan; } tanda = setTimeout("evTimeOut()",250); IsAnim = true;
function evMulai(){ kata = document.frform.txKata.value; evSelesai(); evTimeOut();
function evSelesai(){ if (IsAnim) { clearTimeout (tanda); IsAnim = false; posisi = 0; IsKanan = true; function evSelesai(){ if (IsAnim) { clearTimeout (tanda); IsAnim = false; posisi = 0; IsKanan = true;
<BODY> <FORM NAME="frform"> Teks berikut akan ditampilkan pada <I>status bar</I> <BR> <INPUT TYPE="text" NAME="txKata" SIZE=50 MAXLENGTH=100> <BR><BR> <INPUT TYPE="button" VALUE="Mulai" onClick="evMulai()"> <INPUT TYPE="button" VALUE="Selesai" onClick="evSelesai()"> </FORM> </BODY> </HTML>
Output :
8.2 Penanganan Frame dan Form pada JavaScript
8.2.1 Window dan Frame
Contoh penerapan objek window pada halaman web yang menggunakan frame :
1. Buat halaman frameset, beri nama frame_javascript.html
<html> <head>
<title>Tutorial JavaScript</title> <frameset cols=175,*>
<frame src="menu.html" name="kiri"> <frame src="topik1.html" name="kanan">
</frameset> </head> </html>
2. Buat halaman untuk frame bagian kiri
<html> <head> <script language="JavaScript">
function buka(x) { top.kanan.location=x; // membuka halaman x pada frame kanan
return false } </script> </head>
<body> <h1>Daftar Isi</h1> <a href="" onclick="return buka('topik1.html')">
Memasukan JavaScript ke dalam HTML</a><hr> <a href="" onclick="return buka('topik2.html')"> Variabel dan Literal</a><hr> <a href="" onclick="return buka('topik3.html')"> Ekspresi dan Operator</a><hr> <a href="" onclick="return buka('topik4.html')"> Struktur Kendali dan Fungsi</a><hr> </body> </html>
3. Buat halaman untuk frame bagian kanan
<html> <head>
<title> New Document </title> </head>
<body> Ini Halaman untuk Topik 1 </body> </html>
8.2.2 Form
Contoh penerapan objek window pada form HTML :
<html> <head> <title> Mengubah Temperatur </title> </head>
<body> <form>
Farenheit: <input type="text" name="F" value="32"><br> Celcius: <input type="text" name="C" value="0" ><br> <input type="button" name="FtoC" value="To Celcius"
onClick="C.value = 100/(212-32) * (F.value - 32 )"> <input type="button" name="CtoF" value="To Farenheit" onClick="F.value = (212-32)/100 * C.value + 32 "> </form> </body> </html>
Hasil keluaran :
Rangkuman
7. JavaScript memperlakukan elemen-elemen yang tampil di jendela navigator kita sebagai suatu objek.
8. Programer dapat menciptakan sendiri objek yang ingin ditampilkan dalam halaman web, tetapi JavaScript juga menyediakan objek yang telah terdefinisi.
9. Setiap objek mempunyai metoda yaitu suatu fungsi yang diasosiasikan dengan satu objek, satu aksi yang bisa di eksekusi pada satu objek.
10. Untuk menangani frame dan form pada JavaScript, programer tinggal menggunakan objek browser beserta metoda ataupun properti yang sesuai dengan kebutuhan.
Jurnal
8. Buatlah objek initBuku yang mempunyai tiga properti, yaitu Judul,
Penulis, dan Harga. Di samping itu, tambahlah dua metoda, yaitu Tulis
untuk menulis nilai dari properti-properti objek ini dan Ubah untuk mengubah properti initBuku. Tampilkan hasil keluaran dengan menggunakan metode objek window alert()!
Output : Judul
: Tip dan Trik Pemrograman JavaScript Penulis
: Budi Raharjo
Harga
Judul Buku diubah Judul
: Dasar-dasar Pemrograman JavaScript Penulis
: Budi Raharjo
Harga
9. Buat sebuah program pengecekan tanggal, yang meminta user memasukkan suatu tanggal (pada kotak teks Tanggal, Bulan dan Tahun). Tambahkan sebuah tombol dengan value [Tekan ini]. Setelah memasukkan sembarang tanggal dan klik tombol [Tekan ini], halaman akan menampilkan informasi yang berhubungan dengan tanggal yang user masukkan.
Perhatikan :
a. Tanggal yang dimasukkan antara 1 – 31
b. Bulan yang dimasukkan antara 1 – 12
c. Tahun yang dimasukkan minimal tahun 1970
d. Program dapat mengecek sah tidaknya tanggal yang dimasukkan user, sebagai contoh, bila user memasukkan tanggal 31 Juni 2004, program menyatakan bahwa tanggal yang dimasukkan salah (Juni hanya memiliki tanggal sampai dengan 30). Contoh lain, tanggal 29 Februari 2003 juga tidak sah (2003 bukan tahun kabisat sehingga bulan Februari hanya sampai tanggal 28)
Output :
10. Modifikasi program no.2 dimana tanggal, bulan dan tahun dimasukkan melalui objek window dengan metoda prompt()!
9 Pengantar Pemrograman Web dengan PHP
Overview
PHP adalah bahasa scripting yang menyatu dengan HTML dan dijalankan pada serverside. Artinya semua sintaks yang diberikan akan sepenuhnya dijalankan pada server sedangkan yang dikirimkan ke browser hanya hasilnya saja. Ketika seorang pengguna internet membuka suatu situs yang menggunakan fasilitas server side scripting PHP, maka terlebih dahulu server yang bersangkutan akan memproses semua perintah PHP di server lalu mengirimkan hasilnya dalam format HTML ke web server pengguna internet tadi. Sehingga kode asli yang ditulis dengan PHP tidak terlihat di browser pengguna. PHP merupakan software yang open source bebas. Jadi anda dapat merubah source code dan mendistribusikan secara bebas dan gratis. PHP juga dapat berjalan lintas platform, yaitu dapat digunakan dengan sistem operasi (Windows dan Linux) dan web server apapun (misalnya: PWS, IIS, Apache).
Tujuan
10. Memahami cara melakukan instalasi Apache Web Server, PHP dan MySQL
11. Memahami cara melakukan konfigurasi pada web server
12. Mampu membuat halaman web sederhana dengan PHP
13. Mengenal Tipe Data PHP
14. Mengenal Variable PHP
15. Menggunakan Operator Aritmatika
16. Menggunakan Operator Logika
17. Menggunakan Operator Penggabungan String
9.1 Pengenalan Lingkungan Kerja Web Server
9.1.1 Instalasi Apache Web Server, PHP dan MySQL sebagai
DBMS pendukung
Untuk menjalankan PHP, dibutuhkan beberapa perangkat lunak hal sebagai berikut :
a. Apache Web Server
b. PHP (www.php.net)
c. MySQL (http://www.mysql.com). Tiap versi paket baik apache, php ataupun mysql terkadang
mempunyai cara instalasi yang berbeda-beda. Pada praktikum ini, kita akan menggunakan versi paket dibawah ini:
apache_2.2.3-win32-x86-no_ssl.msi php-5.2.0-Win32.zip mysql-5.0.27-win32.exe
Berikut ini merupakan langkah-langkah instalasi pada platform windows xp profesional edtion service pack 2.
1. Install web server
Lakukan instalasi apache web server dan pilih typical installation. Setelah selesai jalankan web browser dan ketikan (pilih salah satu cara dibawah ini)
http://localhost http://127.0.0.1 http://[ip komputer anda] misal http://192.168.0.5
Setelah anda tekan enter, apa yang anda lihat? Pada kondisi normal, web server anda telah aktif, untuk mengetahui status web server apakah dalam keadaan start atau stop. Anda dapat melihatnya dari windows service.
Gambar 10.1 Window Service
Sekarang anda coba membuat file web html yang kemudian anda letakan ke web server, sehingga client lain di jaringan dapat mengaksesnya. Buat file index1.html yang berisi:
<h1>Web server Apache</h1>
Kemudian letakan pada direktori htdocs web server. (Secara default berada
pada
C:\Program
Files\Apache Software
Foundation\Apache2.2\htdocs\). Selanjutnya coba akses dari browser dengan mengetikan http://localhost/index1.html. Apakah sudah tampak seperti yang seharusnya? Coba akses dari client lain yang terhubung ke web server anda. Jangan lupa untuk menuliskan alamat web servernya. (misal: http://192.168.0.5/index1.html).
Sekarang kita akan mencoba, apakah web server yang telah dibuat dapat mengintepretasikan script php. Sekarang buat file lagi dengan nama index2.php yang berisi:
<? Hi <? echo "PHP "; ?> Developer ?>
Jangan lupa letakan di htdocs kemudian coba akses melalui browser (dengan alamat http://localhost/index2.php). Apa yang tertulis disana? Pada tahap ini pada kondisi normal, komputer anda telah menjadi web server.
2. Install paket PHP
Sebelum menginstal paket PHP, anda perlu membaca file install.txt yang disertakan bersama paket PHP. File tersebut berisi langkah instalasi yang terkadang terdapat perbedaan antara versi satu dengan lainnya. Buka file tersebut dan cari baris yang menjelaskan cara installasi PHP versi yang akan diinstal dengan web server yang digunakan.
Pada modul ini, akan dijelaskan bagaimana menginstall paket PHP sebagai module di apache web server.
a. Unzip file php-5.2.0-Win32.zip ke c:\php
b. Rename php.ini-dist menjadi php.ini
c. Buka file httpd.conf dengan text editor (secara default terdapat pada C:\Program Files\Apache Software Foundation\Apache2.2\conf)
d. Tambahkan statement dibawah ini pada baris terakhir httpd.conf
LoadModule php5_module "C:/php/php5apache2_2.dll" AddType application/x-httpd-php .php PHPIniDir "C:/php/"
e. Save file tersebut dan restart apache. Perlu anda perhatikan bahwa setiap anda merubah konfigurasi file httpd.conf anda perlu melakukan restart web server.
Selanjutnya anda dapat mencoba mengakses script php yang tadi dibuat (http://localhost/index2.php). Apa yang tertulis disana? Pada tahap ini dengan kondisi normal, engine PHP telah menjadi module di apache web server sehingga anda dapat membuat web berbasis PHP.
Selanjutnya, anda ingin membuat website php dengan database. Maka anda harus menginstal DBMSnya.
3. Install MySQL 5
Run mysql-5.0.27-win32.exe untuk menginstalnya, pilih typical installation dan ikuti langkah instalasi serta isikan password sesuai kebutuhan. Pada modul ini, kita sepakat password root mysql server kita adalah root.
Setelah instalasi buat file dengan nama db.php yang berisi:
<?php $conn = mysql_connect('localhost', 'root', 'root'); if (!$conn) {
die('Tidak dapat koneksi ke mysql: ' . mysql_error()); } echo 'Koneksi ke mysql berhasil'; mysql_close($conn);
Coba akses dari browser (http://localhost/db.php). Apa yang tertulis disana? Pada saat ini dengan kondisi normal, mysql telah terinstal. Tapi coba anda lihat, jika script tersebut dijalankan maka akan tampil pesan error.
Hal ini menandakan bahwa PHP tidak mengenal fungsi mysql_connect(). Pada PHP5, fungsi-fungsi untuk berkomunikasi dengan mysql secara default tidak aktif, fungsi tersebut merupakan fungsi terpisah. Kumpulan fungsi mysql tersebut terdapat pada DLL yang perlu diinstal dan diaktifkan jika ingin digunakan. Lakukan modifikasi pada file php.ini yang terdapat pada C:\php\.
Buka file php.ini dengan text editor, kemudian lakukan search php_mysql.dll. File ekstension pada php biasanya berupa DLL dengan prefix php_. Setelah anda temukan php_mysql.dll, hilangkan tanda titik koma di depannya seperti gambar dibawah:
Kemudian pastikan bahwa file php_mysql.dll terdapat pada direktori ext di direktori paket php. (c:\php\ext\).
Cari text “extension_dir” kemudian ubah, dari ./ menjadi c:/php/ext/ agar php dapat menemukan direktori DLL.
Karena DLL mysql mempunyai DLL tambahan dengan nama libmysql.dll, selanjutnya letakan file libmysql.dll yang terdapat pada c:\php\ ke c:\windows\system32. Lakukan restart werbserver dan refresh browser yang membuka http://localhost/db.php.
Gambar 10.2 Hasil Eksekusi Koneksi ke Database Server Pada tahap ini dengan kondisi normal, extension mysql telah aktif dan dapat digunakan oleh PHP. Kesimpulannya, lingkungan pengembangan aplikasi web berbasis PHP dengan DBMS mysql telah siap digunakan.
9.1.2 Konfigurasi Wen Server
Setelah melalui bagian sebelumnya instalasi paket WAMP (Windows Apache MySQL PHP) selesai dilaksanakan. Pada bagian ini akan sedikit ditinjau Setelah melalui bagian sebelumnya instalasi paket WAMP (Windows Apache MySQL PHP) selesai dilaksanakan. Pada bagian ini akan sedikit ditinjau
a. ThreadsPerChild Directive Jumlah thread yang bekerja pada server. Nilai default = 250
b. MaxRequestsPerChild Directive Jumlah maximum request suatu proses ke server. Nilai default 0, dengan kata lain web server tidak membatasi batas maximum requestnya.
c. Listen Directive Memberikan fasilitas kepada admin untuk melakukan bind apache ke ip adddress dan port tertentu. Disini secara default ditulis 80 (karena protocol http menggunakan port 80). Dari sini administrator dapat merubah port web servernya, misalnya karena ia menginstal web server produk lain dan web server lamanya dirubah menjadi listen 6800 agar tidak crash.
d. ServerAdmin Directive Merupakan ditulis berupa alamat email dari administrator. Text ini akan muncul pada saat terjadi error request web page. Informasi ini berguna bagi client yang ingin mencari informasi karena web page yang ia buka error. Dengan adanya informasi alamat email tersebut, ia dapat mengirim keluhannya kepada admin.
e. DocumentRoot Directive Merupakan direktori tempat menyimpan file-file web yang dapat diakses melalui web server. Secara default terdapat pada: C:\Program e. DocumentRoot Directive Merupakan direktori tempat menyimpan file-file web yang dapat diakses melalui web server. Secara default terdapat pada: C:\Program
Cari lagi tulisan seperti dibawah dan ubah:
f. DirectoryIndex Directive Merupakan file yang diakses ketika directory direquest. Default value: index.html. Dari sini bisa kita tambahkan misalnya index.php, home.php
Setelah melakukan modifikasi terhadap file httpd.conf, jangan lupa untuk melakukan restart web server.
Instalasi yang dilakukan diatas adalah instalasi manual per paket. Pada saat modul ini dibuat sudah banyak developer PHP yang membuat paket bundle instalasi WAMP/LAMP (Linux Apache MySQL PHP). Berikut merupakan contoh paket bundle WAMP:
Apache Friends XAMPP PHP EasyWindows Installer Apache2Triad
PHPStar
Web-Developer Server Suite
WOS Portable
WinServ
The Uniform Server PHPTriad for Windows Sumber: http://www.hotscripts.com/PHP/Software_and_Servers/Installation_Kits/inde x.html
9.1.3 Membuat halaman web sederhana dengan PHP
Contoh penggunaan:
<HTML> <HEAD> <TITLE>symfony project</TITLE> </HEAD> <BODY>
<p>Mari kita belajar <?php echo 'server side scripting';//perintah menampilkan teks ?> menggunakan PHP </p> </BODY> </HTML>
Hasil Keluaran :
9.2 Tipe data
PHP mengenal 8 jenis tipe data antara lain : boolean, integer, float, array, string, object, resource dan NULL.
Contoh penerapan tipe data pada PHP :
<?php $ia = 4; // decimal $ib = -20; // decimal negatif $ic = 0232; // octal $id = 0x5DF // hexadecimal
$jumlah = $ia + 3; If ( $jumlah == 7 ) {
echo 'Benar'; }else{ echo 'Salah'; }
// Single quoted echo 'simple string single quoted </br>'; echo 'penggunan single quoted untuk penulisan script pada
baris baru </br>'; echo 'Budi berkata, "I\'ll do the PHP code" </br>'; echo 'PHP ini terletak di C:\\php\ </br>'; echo 'Untuk single quoted \n tidak dianggap sebagai baris
baru <br />'; echo 'Bentuk variabel seperti $var tidak akan ditulis valuenya <br />';
// Double quoted echo "Baris pertama \n Baris \t dengan tab \r Baris baru yang
menggunakan return <br />"; echo "DLL library ekstension terdapat pada C:\php\ext\ </br>"; $nama = "Gajah"; echo "Variabel \$nama mempunyai value $nama. </br>";
// Heredoc syntax echo <<<BATAS
$nama adalah salah satu binatang dengan postur tubuh besar. BATAS; ?>
Contoh penggunaan array di PHP :
<?php
// Contoh simple array dengan key dan value yang bervariasi $a = array("Band" => "Blink",
"code" => 182,
); echo $a["Band"]; // Blink echo $a["code"]; // 182 echo $a[5]; // + 311 + echo $a[14]; // 5000
// Contoh penggunaan array didalam array $aa = array("music" => array(1=>"Jazz", 2=>"Classic",
3=>"Metal"), "sport" => array(2=>"basketball", 2=>"golf", 3=>"airsoftgun")
); echo $aa["music"][3]; // Metal echo $aa["music"][1]; // Jazz echo $aa["sport"][3]; // airsoftgun
9.3 Variable PHP
Variable PHP selalu dimulai dengan karakter $ dan bersifat case- sensitive. Contoh penggunaan variable di PHP :
$_wait = 'Pagi'; // Contoh variable yang diisi string
$Œ = &$_wait; // Reference $_wait via $Œ (ASCII 140). echo $Œ;
// Value $Œ dan $_wait akan sama
echo $_wait;
$Œ = "Selamat $_wait"; // $Œ dirubah echo $Œ; // Value $Œ dan $_wait akan sama-sama berubah
echo $_wait;
Pada baris ke dua diberikan contoh melakukan assign value ke variable dengan cara by reference. Variable $_wait diisi „pagi‟, kemudian variable $Œ diisi reference $_wait, sehingga nanti nilai $_wait dan $Œ akan selalu sama meskipun terjadi perubahan pada salah satunya.
9.4 Operator
Pada praktikum ini akan dipraktekkan penggunaan operator aritmatika, operator logika dan operator konkatenasi/penggabungan string di PHP.
Contoh penggunaan operator di PHP : <?php
$a = 20; $b = 5; $c = $a * $b; echo $c;
// $c = 100;
// Contoh penggunaan . $a = "Paris van "; $a = $a."Java!"; echo "$a"; // Paris van Java!
// Contoh penggunaan .= $b = "Bandung "; $b .= "Bermartabat!"; if ($b = "Bandung" || $b = "Jakarta") {
echo "$b"; } // Bandung Bermartabat!
Jurnal
11. Tuliskan secara singkat langkah-langkah instalasi perangkat lunak untuk menjalankan PHP pada komputer Anda!
12. Buatlah program untuk menghitung volume sebuah tabung!
13. Buatlah array arrBuku yang mempunyai tiga key, yaitu Judul, Penulis, dan Harga. Isi value dari key tersebut dengan nilai seperti pada output di bawah ini. Kemudian ubah value judulnya dan tampilkan kembali ke layar. Output :
Judul : Tip dan Trik Pemrograman PHP Penulis
: Onno W Purbo
Harga
Judul Buku diubah Judul
: Dasar-dasar Pemrograman PHP Penulis
: Onno W Purbo
Harga
10 Struktur Kontrol dan Fungsi
Overview
Pada pemrograman web PHP disediakan struktur kontrol berupa statemen kondisional untuk menyelesaikan masalah pemilihan terhadap kasus tertentu dan statemen pengulangan yang dapat digunakan misalnya untuk menampilkan isi dari sebuah basis data. Untuk memudahkan pengaturan struktur program dalam PHP, user dapat membuat fungsi maupun menggunakan fungsi bawaan PHP yang dapat dipanggil setiap kali dibutuhkan.
Tujuan
18. Mengerti esensi penggunaan Percabangan (pemilihan/kodisional) dalam PHP.
19. Memahami bentuk umum Percabangan.
20. Mampu memecahkan masalah sederhana dengan menggunakan Percabangan dan mengimplementasikan ke dalam program PHP.
21. Mengerti esensi penggunaan Pengulangan (Looping) dalam PHP.
22. Memahami bentuk umum Pengulangan.
23. Mampu memecahkan masalah sederhana dengan menggunakan Pengulangan dan mengimplementasikan ke dalam program PHP.
24. Memahami penggunaan Fungsi.
25. Memahami parameter pada fungsi dalam PHP.
26. Memahami bentuk –bentuk fungsi bawaan dalam PHP.
27. Mampu mengimplementasikan Fungsi pada suatu studi kasus PHP.
28. Mengerti esensi penggunaan class di PHP.
29. Membuat sebuah class yang memiliki field dan fungsi.
10.1 Kondisional
Konstruksi IF digunakan untuk melakukan eksekusi suatu statement secara bersyarat atau sesuai dengan kondisi tertentu. Statement yang berkaitan dengan kondisional yaitu statement if else elseif dan statement switch. Contoh menggunakan statement if else elseif sebagai berikut :
<?php $warna = "hitam"; if ($warna == "merah") {
echo "warna adalah merah"; } elseif ($warna == "biru") { echo "warna adalah biru"; } else { echo "warna bukan merah atau biru"; }
// alternatif penggunaan if if ($warna == "merah") :
echo "warna adalah merah"; elseif ($warna == "biru") : echo "warna adalah biru"; else: echo "warna bukan merah atau biru"; endif;
Contoh menggunakan statement switch :
<? switch ($warna){ case "merah": echo "warna adalah merah"; break;
case "biru": echo "warna adalah biru"; break;
default: echo "warna bukan merah atau biru"; break;
10.2 Pengulangan
Statement pengulangan ini digunakan untuk mengulangi sebuah perintah sampai jumlah atau kondisi tertentu terpenuhi. Yang termasuk ke dalam statement pengulangan adalah for, while, do-while dan foreach.
Contoh menggunakan statement while :
$genap = 4; if (isset($genap)) {
$bilgen=intval($genap); echo "Bilangan Genap dari 2 s/d $bilgen adalah: "; echo "<br>"; $gen=0; while ($gen<$genap) {
$gen=$gen+2; echo "$gen"; echo " ";
Contoh menggunakan statement for :
<html> <head>
<title>Latihan Perulangan dengan For</title> </head> <body>
Tanggal: <select name=tanggal> <option value=0 selected>Tanggal <?php
//Bentuk Pilihan tanggal 1 sampai dengan 31 for ($i=1;$i<32;$i++) echo "<option value=$i>$i";
?> </option> </select>
</body> </html>
10.3 Membuat Fungsi
Dalam pembuatan program sering kali dibutuhkan beberapa perintah yang digunakan berulang kali. Hal ini dapat dihindari dengan subrutin. Subrutin adalah sekumpulan perintah yang diberi nama dan dapat dipanggil sewaktu- waktu. Dalam pemrograman PHP terdapat subrutin, yaitu fungsi.
Contoh :
<?php // Contoh fungsi tanpa parameter function dowrite(){
echo "Simple PHP function"; } dowrite(); // Pemanggilan fungsi // Contoh fungsi dengan parameter echo "Simple PHP function"; } dowrite(); // Pemanggilan fungsi // Contoh fungsi dengan parameter
dipanggil
10.4 Menggunakan fungsi bawaan PHP
Fungsi bawaan yang akan dibahas pada praktikum kali ini adalah fungsi matematika dan fungsi string.
Contoh fungsi pengolahan matematika :
<?php echo ceil(7.6); //menghasilkan 7 echo decbin(109); //menghasilkan 1101101 echo mt_rand(1, 10); // menghasilkan angka random antara 1-10
Contoh fungsi pengolahan string :
<?php $mk = "alpro siskom comnet oracle netadmin matdis"; $arr = explode(" ",$mk, 5); foreach ($arr as $vass) {
echo "<br />$vass"; } echo nl2br("Teknik \n Informatika"); $kata2 = "Bahasa Pemrograman Web menggunakan ASP"; echo "Kalimat : ".$kata2."<br />"; echo str_replace("ASP", "PHP",$kata2); echo "Panjang Kalimat ".strlen($kata2)."karakter";
10.5 Class
Class sering disebut juga sebagai objek. Penggunaan objek dapat mempercepat proses pembuatan program, karena user dapat memakai objek yang telah didefinisikan untuk membuat objek yang lain. Contoh :
<?php class sepeda { var $roda="2"; var $warna="kuning"; var $harga; function UbahWarna($warnaBaru) {
$this->warna=$warnaBaru; } function UbahHarga($hargaBaru) {
$this->harga=$hargaBaru; } } echo "<p>Sepeda"; $this->harga=$hargaBaru; } } echo "<p>Sepeda";
<br>"; $kendaraan->UbahWarna("merah"); echo "Warna: ".$kendaraan->warna."<br>";
Jurnal
14. Membuat program penghitung discount. Program ini digunakan untuk mengetahui apakah pembeli dapat diskon atau tidak. Besar diskon tersebut mengikuti aturan sebagai berikut: Jika jumlah bayar 50.000 dapat diskon 5%, jika jumlah bayar 100.000
dapat diskon 10%, dan jika jumlah bayar 500.000 dapat diskon 50%. Selain kreteria tersebut, diskonnya adalah 0%. Contoh keluaran :
15. Membuat Program untuk menampilkan kelipatan sebuah bilangan. Program akan meminta masukan berupa sebuah nilai yang akan diproses untuk menghasilkan kelipatan bilangan tersebut sampai 5 bilangan.
Contoh : Masukan
Keluaran :8
12 16 20 24
Masukan :7 Keluaran
: 14
21 28 35 42
16. Membuat Program kalkulator sederhana. Program yang akan dibuat ini adalah program untuk melakukan beberapa operasi aritmatika, yaitu penjumlahan, pengurangan, perkalian dan pembagian. Setiap operasi yang dilakukan, program akan meminta masukan nilai dua operand yang akan dihitung dalam hal ini adalah A dan
B. Program juga akan meminta masukan dari pemakai untuk memilih operasi apa yang akan dilakukan. (clue : gunakan fungsi untuk membuat masing-masing operasi aritmatika) Contoh keluaran :
11 Mengolah Data Dalam Form
Overview
Proses pengolahan data dalam PHP akan dilakukan di sisi server. Jika ada request data dari client, maka data akan diteruskan ke server untuk diproses, kemudian server akan me-response dengan mengembalikan hasilnya ke sisi client.
Form ini akan sangat berguna pada saat kita akan mengolah web yang mempunyai basis data, karena dengan menggunakan form user dapat memasukkan jumlah data yang banyak.
Terdapat dua cara menangkap variabel pada form, yaitu dengan menggunakan metode get dan metode post.
Tujuan
30. Memahami kegunaan elemen – elemen dalam form
31. Mengolah data yang dimasukkan melalui form
11.1 Menyiapkan Form
Form menyediakan berbagai komponen yang dapat digunakan untuk menerima masukkan data dari user. Untuk mendeklarasikan sebuah form dapat digunakan dua cara, yaitu form dalam tag HTML dan form yang disisipkan pada sintak PHP.
11.1.1 Menangkap Variabel dari Form
Ada dua cara menangkap variabel dari form, yaitu dengan
menggunakan metode get dan metode post. Metode Get merupakan sebuah atribut yang dimiliki oleh form. Dengan menggunakan metode GET, maka data yang diisi di dalam form akan dikirimkan ke server dengan cara diletakkan di belakang URL. Penggunaan metode ini tidak menjamin keamanan data. Dengan menggunakan metode POST maka data yang diisi di dalam form akan dikirim ke server secara terpisah, artinya data tidak terlihat di belakang URL.
Kerjakan contoh skrip-skrip berikut ini : Skrip inputdata.php
<HTML> <HEAD> <TITLE>Menangkap variabel dari form</TITLE> </HEAD> <BODY> <FORM METHOD = GET ACTION = proses.php> Nama: <input type = text name = nama size = 15> NIM : <input type = text name = nim size = 15> Program Studi : <input type = text name = prodi size = 15>
<input type = submit value = Proses> </FORM>
</BODY> </HTML>
Skrip proses.php
<?php if ($prodi ==”Sistem Informasi” || $prodi==”Teknik Informatika”) { echo('Nama Anda : <B>'.$nama. '</B>'); echo('NIM : '.$nim); echo('Program Studi : '.$prodi);
} Else } Else
Contoh diatas menggunakan metode GET. Pertama-tama, jalankan dulu skrip inputdata.php, lalu masukkan nama, NIM, Program Studi dan klik tombol Proses. Perhatikan Addressbar untuk metode GET.
Setelah tombol Proses di klik, nama yang dimasukkan akan disimpan sebagai variabel, sehingga dapat diolah dan ditampilkan sesuai dengan keinginan.
Untuk melihat perbedaan penggunaan metode GET dan metode POST, ubah metode GET pada skrip inputdata.php dengan metode POST seperti di bawah ini :
<FORM METHOD = GET ACTION = proses.php>
Menjadi :
<FORM METHOD = POST ACTION = proses.php>
Jalankan lagi skrip inputdata.html, masukkan nama, NIM, Program Studi, lalu tekan tombol Proses, perhatikan pada Addressbar perbedaan metode GET dan metode POST.
Latihan
17. Buat halaman Login seperti gambar dibawah ini. Tombol Login untuk masuk ke halaman berikutnya jika user adalah administrator atau umum. Halaman berikutnya setelah login tergantung pada jenis user, jika user adalah administrator maka halaman yang dibuka adalah halaman administrator dengan pesan ‟Selamat datang administrator‟, jika user name adalah umum maka yang dibuka adalah halaman user biasa dengan pesan ‟Selamat datang user‟. Sedangkan tombol daftar, digunakan untuk pendaftaran user baru bagi yang belum terdaftar.
LOGIN
User Name Password
Daftar
Login
Gambar 12-1 Form untuk Login
18. Buat halaman pendaftaran yang didalamnya terdapat Form Pendaftaran User Baru seperti gambar berikut (metode GET, action simpan.php):
PENDAFTARAN ANGGOTA
User Name Password Nama Alamat E-mail
Level Administrator User Biasa
Simpan
Reset
Gambar 12-2 Form untuk Pendaftaran User
12 Keamanan pada Web
13 MySQL dengan PHP
Overview
Dalam bahasa SQL pada umumnya informasi tersimpan dalam tabel-tabel yang secara logik merupakan struktur dua dimensi terdiri dari baris (row atau record) dan kolom (column atau field). Sedangkan dalam sebuah database dapat terdiri dari beberapa table. MySQL adalah database jenis RDBMS (Relational Database Management System). Jadi dalam MySQL tetap menggunakan Table, Baris dan Kolom. Sebuah Database dalam MySQL mengandung beberapa table dan satu table dalam database terdiri dari sejumlah baris dan kolom.
Tujuan
1. Menggunakan MySQL untuk mengelola database
2. Mampu membuat database pada MySQL
3. Mampu membuat tabel pada MySQL melalui aplikasi web
4. Mampu memasukkan data ke dalam tabel di database MySQL
5. Mampu menampilkan data dari table
6. Mampu melakukan proses pencarian data pada table
7. Mampu melakukan delete data pada tabel
8. Mampu melakukan update data pada tabel
13.1 Tes Koneksi ke server MySQL
Untuk menjalankan MySQL, klik ganda pada file winmysqladmin.exe yang terletak di folder C:\apache\mysql\bin\winmysqladmin.exe. Tanda bahwa MySQL aktif, lihat ikon lampu lalu lintas dengan warna hijau yang terletak di sebelah kanan bawah dari desktop Windows.
Contoh koneksi ke MySQL (KoneksiMySQL.php):
<?php $koneksi = mysql_connect(("localhost","",""); if ($koneksi) {
echo("Koneksi ke server MySQL sukses"); } else {
echo("Koneksi ke server MySQL gagal"); }
13.2 Membuat Database pada MySQL
Database digunakan sebagai tempat untuk menampung data atau tabel- tabel.
Contoh membuat database pada MySQL :
<?php include("KoneksiMySQL.php"); $buatdb = mysql_create_db("APOTEK_DB"); if ($buatdb) {
echo("<BRDatabase dengan nama : <B>APOTEK_DB</B> sukses dibuat"); } else {
echo("<BR>Database dengan nama : <B>APOTEK_DB</B> gagal dibuat"); }
13.3 Membuat Tabel pada MySQL
Setelah berhasil membuat database, maka langkah selanjutnya adalah membuat tabel-tabel. Contoh :
Skrip BuatTabel.php
<?php include(“KoneksiMySQL.php”); $pilih
db = mysql_select_db(“APOTEK_DB”) or die(“Database APOTEK_DB tidak ditemukan”); $buat tabel = “CREATE TABLE obat(kdobat char(5) PRIMARY KEY, namaobat char(50), harga int(9 ) )”;
$tabel = mysql_db_query(“APOTEK_DB”,$buattabel); if($tabel){
echo(“<BR><BR>Tabel dengan nama : <B>obat</B> sukses dibuat! ”); } else {
echo(“<BR><BR>Tabel dengan nama : <B>mahasiswa</B> gagal
dibuat! ”); } ?>
13.4 Insert Data
Langkah selanjutnya yaitu melakukan pengisian data ke dalam tabel obat yang masih berupa tabel kosong. Untuk lebih jelasnya, cobalah skrip- skrip berikut, FormInput.php digunakan untuk membuat form yang menerima masukan data, sedangkan InputObat.php untuk proses menambahkan data ke tabel obat :
Skrip FormInput.php <HTML>
<HEAD> <TITLE>Memasukkan data ke tabel obat</TITLE> </HEAD> <BODY>
<B>INPUT DATA MAHASISWA</B><BR> <FORM METHOD = POST ACTION = InputObat.php> <TABLE BORDER = 0> <TR> <TD>KODE OBAT :</TD> <TD><INPUT TYPE = TEXT NAME = kdobat SIZE = 10></TD> </TR> <TR> <TD>NAMA OBAT :</TD> <TD><INPUT TYPE = TEXT NAME = nmobat SIZE = 20></TD> </TR> <TR> <TD>HARGA :</TD>
<TD><INPUT TYPE = TEXT NAME = harga SIZE = 10></TD>
<TR> <TD><INPUT TYPE = SUBMIT NAME =submit VALUE =INPUT></TD> <TD><INPUT TYPE = RESET NAME = reset VALUE = BATAL></TD> </TR> </TABLE> </FORM>
</BODY> </HTML>
Skrip InputObat.php <?php
mysql_connect("localhost","",""); mysql_select_db("APOTEK_DB") or die("Database tidak ada"); $perintah="INSERT INTO obat(kdobat,namaobat,harga) VALUES('$kdobat','$nmobat','$harga')"; $isi_data=mysql_query($perintah);
if(isset($isi_data)) { echo("Data Obat :<BR>"); echo("Kode Obat : $kdobat<BR>"); echo("Nama Obat : $nmobat<BR>"); echo("Harga : $harga<BR>"); echo("Telah dimasukan ke dalam table obat <BR>"); echo("<FORM METHOD = POST ACTION = FormInput.php>"); echo("<INPUT TYPE=SUBMIT NAME=SUBMIT VALUE='Daftar
Lagi'></FORM>"); } else { echo("Data obat gagal dimasukkan ke dalam tabel"); }
13.5 View Data
Setelah melakukan pengisian data ke dalam tabel, langkah berikutnya kita akan melihat/menampilkan data yang ada di dalam tabel, cobalah skrip berikut :
Skrip TampilObat.php
<?php echo("DATA OBAT<HR><BR><BR>"); echo("<TABLE BORDER=1>"); echo("<TR><TD>KODE</TD><TD> OBAT</TD><TD>HARGA</TD></TR>"); mysql_connect("localhost","",""); mysql_select_db("APOTEK_DB"); $perintah="SELECT * FROM obat ORDER BY kodeobat"; $tampil_data=mysql_query($perintah); <?php echo("DATA OBAT<HR><BR><BR>"); echo("<TABLE BORDER=1>"); echo("<TR><TD>KODE</TD><TD> OBAT</TD><TD>HARGA</TD></TR>"); mysql_connect("localhost","",""); mysql_select_db("APOTEK_DB"); $perintah="SELECT * FROM obat ORDER BY kodeobat"; $tampil_data=mysql_query($perintah);
?> Pada saat skrip TampilObat.php dijalankan, maka skrip akan menampilkan
data yang ada di dalam tabel obat.
13.6 Searching Data
Searching data dimaksudkan untuk mencari data yang ada pada tabel sehingga bisa menemukan informasi dengan cepat. Cobalah skrip berikut:
Skrip FormCari.php <HTML>
<HEAD> <TITLE>Mencari data obat</TITLE> </HEAD> <BODY> <FORM METHOD=POST ACTION=CariObat.php> Masukkan Kode Obat :<BR> <INPUT TYPE=TEXT NAME=cari SIZE=20><BR> <INPUT TYPE=submit NAME=submit VALUE=CARI> </FORM>
</BODY> </HTML>
Skrip CariObat.php <?php
echo("<H3>HASIL PENCARIAN</H3>"); mysql_connect("localhost","",""); mysql_select_db("APOTEK_DB"); $perintah="SELECT * FROM obat WHERE kodeobat like '%$cari%'"; $hasil=mysql_query($perintah); $jumlah=mysql_num_rows($hasil); if($jumlah>0){
echo("Data yang ditemukan : $jumlah<BR><HR>"); while($data=mysql_fetch_row($hasil)) {
echo("Nama Obat : $data[1]<BR>"); echo("Harga : $data[2]<BR>");
} } else { echo("Maaf, data yang anda cari tidak ada"); } ?>
Pada saat skrip FormCari.php dijalankan, maka ada perintah untuk memasukkan kode obat yang akan dicari. Bila nim yang dimasukkan pada tampilan skrip FormCari.php ada pada tabel obat, maka akan ditampilkan nama obat dan harga dari obat yang bersangkutan.
13.7 Delete Data
Data yang ada di dalam tabel tidak hanya bisa ditambah atau bahkan diubah. Data tersebut juga bisa untuk dihapus. Untuk lebih jelasnya, cobalah skrip-skrip berikut :
Skrip TampilDelete.php
<?php echo("DATA OBAT<HR><BR><BR>"); echo("<TABLE BORDER=1>"); echo("<TR><TD>KODE</TD><TD> OBAT</TD><TD>HARGA</TD></TR>"); mysql_connect("localhost","",""); mysql_select_db("APOTEK_DB"); $perintah="SELECT * FROM obat ORDER BY kodeobat"; $tampil_data=mysql_query($perintah); while($data=mysql_fetch_row($tampil_data)) {
echo("<TR><TD>$data[0]</TD><TD>$data[1]</TD> <TD>$data[2]</TD>"); echo("<TD><a href=\"HapusObat.php?id=$data[0]\">
Hapus</a></TD></TR>"); } echo("</TABLE>");
?> Skrip HapusObat.php
<?php mysql_connect("localhost","",""); mysql_select_db("APOTEK_DB"); $perintah="DELETE FROM obat where kodeobat=$id"; $hapus=mysql_query($perintah); header("Location:TampilDelete.php");
Jika skrip TampilDelete.php dijalankan, maka akan ditampilkan data yang ada di dalam tabel obat. Link untuk hapus terletak di setiap baris pada data yang ditampilkan. Bila link hapus di pilih, maka data yang berada satu baris dengan link hapus tersebut akan dihapus dari tabel obat.
13.8 Update Data
Perintah update data dilakukan untuk mengubah data yang ada di Perintah update data dilakukan untuk mengubah data yang ada di
Skrip TampilUpdate.php
<?php echo("DATA OBAT<HR><BR><BR>"); echo("<TABLE BORDER=1>"); echo("<TR><TD>KODE</TD><TD> OBAT</TD><TD>HARGA</TD></TR>"); mysql_connect("localhost","",""); mysql_select_db("APOTEK_DB"); $perintah="SELECT * FROM obat ORDER BY kodeobat"; $tampil_data=mysql_query($perintah); while($data=mysql_fetch_row($tampil_data)) {
echo("<TR><TD>$data[0]</TD><TD>$data[1]</TD> <TD>$data[2]</TD>"); echo("<TD><ahref=\"FormEdit.php?id=$data[0]\">Ubah</a> </TD></TR>"); } echo("</TABLE>");
?> Skrip FormEdit.php
<?php mysql_connect("localhost","",""); mysql_select_db("APOTEK_DB"); $perintah="SELECT * FROM obat where kodeobat='$id'"; $hasil=mysql_query($perintah); $baris=mysql_fetch_array($hasil);
?> <HTML>
<B>Pengeditan Data Obat</B><HR><BR> <FORM method=post action=EditObat.php> <input type=hidden name="id"
value="<?echo"$baris[kodeobat]"?>"> Nama Obat : <input type=text name=namaobat size=20 value="<?echo"$baris[namaobat]" ?>"><BR> Harga : <input type=text name=harga size=20 value="<?echo"$baris[harga]" ?>"><BR><BR> <input type=submit name=edit value=Simpan> </HTML>
Skrip EditObat.php
<?php mysql_connect("localhost","",""); mysql_select_db("APOTEK_DB"); <?php mysql_connect("localhost","",""); mysql_select_db("APOTEK_DB");
?> Untuk mengubah data pada halaman TampilUpdate.php, pilih link ubah yang
berada satu baris dengan data yang ingin diubah. Pada saat link diklik, maka akan merefer ke skrip FormEdit.php.
Bila tombol Simpan di klik pada FormEdit.php, maka akan menjalankan skrip EditObat.php. Skrip EditObat.php akan mengupdate data sesuai dengan inputan user pada skrip FormEdit.php.
Jurnal
Lihat kembali jurnal pada Bab XII. Buatlah aplikasi pendaftaran/registrasi agar pengunjung mendapatkan hak untuk memasuki halaman web yang di buat. Untuk membuat aplikasi tersebut Anda harus mengikuti aturan- aturan sebagai berikut :
19. Buat database dan tabel menggunakan sintak PHP. Field-field tabel tersebut terdiri dari username, password, nama, alamat, email dan level. Untuk level dibedakan menjadi dua, yaitu user biasa dan administrator.
20. Gunakan form login yang telah Anda buat pada praktikum sebelumnya.
21. Gunakan form pendaftaran anggota untuk daftar yang telah Anda buat pada praktikum sebelumnya.
22. Setelah sukses melakukan pendaftaran, user dapat melakukan login sesuai dengan level user masing-masing. Untuk halaman administrator akan menampilkan data anggota yang telah mendaftar disertai dengan menu edit dan delete data pada setiap baris datanya, terdapat juga menu Tambah Data dan Ganti Password. Sedangkan untuk halaman user biasa terdapat menu Edit Data (miliknya sendiri) dan Ganti Password.