2103191002-IGedeRakaSadiantara Praktek Regex&data - Manipulation - Asd
2103191002-IGedeRakaSadiantara Praktek Regex&data - Manipulation - Asd
PEMROGRAMAN WEB
Oleh :
D3 Teknik Informatika A
2103191002
TAHUN AJARAN
2019/2020
Tugas :
Dari tampilan tersebut, implementasikan REGEX PHP pada form tersebut dengan aturan sbb :
1. Nama hanya huruf, Huruf di depan kata harus huruf besar,
cth :
Andri Setiawan => Benar
Andri setiawan => Salah
Jawab :
Jadi hal yang pertama kali siapkan untuk membuat skrip PHP itu adalah lingkungan
pengembangan webnya. Karena PHP tidak client side namun server side maka harus
menyiapkan webserver, php dan data basenya. Tapi untuk memudahkan nya kita disini
langsung menggunakan all in one packages application, dan kali ini kita menggunakan
XAMPP. Untuk menjalankan webnya nanti aplikasi dari XAMPP ini harus senantiasa berjalan.
Berikut adalah contoh tampilannya :
Kita dapat menggunakan module yang ada, dan kali ini saya menggunakan apache
sebagai webservernya. Pastikan untuk background dari body itu berwarna hijau yang
menandakan aplikasi sudah berjalan sempurna sehingga nantinya tidak ada masalah saat
menjalankan web.
Langkah selanjutnya adalah dengan membuat file php nya yang kali ini saya
menggunakan visual studio untuk menuliskan source codenya. Untuk script lengkap tidak saya
berikan disini karena sudah dicantumkan pada google class room. Disini saya akan
menjelaskan bagian perbagian dari codingan saya, di mulai dari bagian pertama yakni sebagai
berikut :
<html>
<head>
<title>Formulir DATA MAHASISWA</title>
</head>
<body>
<form name="form1" method="POST" action="regex.php">
<table border="0">
<tr>
<td colspan="6"><h3><center> Homepage DATA ENTRY </center></h1
></td><br>
</tr>
<tr>
<td colspan="6"><h2><center> FORMULIR DATA MAHASISWA </center>
</h1></td><br>
</tr>
<tr>
<td><b>1. Nama :</b> </td>
<td colspan="5"><input name="nama" type="text" id="nama"></td>
</tr>
<tr>
<td><b>2. NRP : </b></td>
<td colspan="5"><input name="nrp" type="text" id="nrp"></td>
</tr>
<tr>
<td><b>3. Kelas :</b> </td>
<td colspan="5"><input name="kelas" type="text" id="kelas" ></
td>
</tr>
<tr>
<td><b>4. Jenis Kelamin :</b> </td>
<td><input type="radio" name="gender" value="L">Laki-Laki</td>
<td><input type="radio" name="gender"value="P">Perempuan</td>
</tr>
Analisa :
Kita tahu bahwa Struktur umum dari html itu sendiri adalah sebagai berikut :
<html>
<head>
</head>
<body>
</body>
</html>
Bentuk penulisan HTML secara umum terdiri dari elemen, attribute, dan value serta
kali ini : Yang tulisan berwarna biru merupakan elemennya. Lalu untuk tulisan yang berwarna
hijau merupakan attribute dan yang berwarna orange merupakan value atau nilainya.
Selanjutnya terdapat tag <head> yang biasanya di tag ini akan memuat tag <tittle> yang
berfungsi untuk menampilkan judul dari halaman web. Dan nanti jika kita lihat dibrowser akan
ditampilkan pada bagian tab. Dan seperti biasa tag dari header akan ditutup dengan tag
</head>.
Pada bagian selanjutnya saya gunakan Tag <body> berfungsi untuk menampilkan text,
image, link, serta semua yang akan kita tampilkan di web page. Sebuah form didefinisikan
dengan tag <form>. <form> …</form>. Disini saya meggunakan method yakni post dengan
action yakni regex.php yang nantinya source phpnya terdapat pada file tersebut dan dari
sanalah prosesnya akan berjalan. <table> element merepresentasikan data dengan lebih dari
satu dimensi dalam bentuk sebuah tabel (table). Diawal saya menggunakan block level h2 dan
h3 untuk membuat judul dari form dan juga menggunakan colspan agar tersedia ruang untuk
menuliskan judul tersebut. Dan tag center yang berguna untuk menaruh tulisan berada di tengah
tengah table atau form.
Lalu saya menggunakan tag <tr></tr> yang digunakan untuk menambah baris pada
table, sehingga nanti akan muncul baris untuk bagian nama. Didalam tag <tr> saya memberikan
2 tag <td> yang bertujuan untuk membuat 2 kolom dalam satu baris nama itu, kolom satu saya
beri tulisan nama, lalu untuk kolom 2 saya menggunakan tag input dengan attribute type dengan
value text yang bertujuan untuk membuat kotak inputan untuk teks saja. Lalu untuk kolom ini
saya juga menggunakan attribute colspan yang bertujuan untuk menggabungkan beberapa
kolom menjadi satu. Lalu seperti biasa saya menutup tag tag tersebut dengan </(tag
yangdigunakan)>. Lalu untuk setiap informasi pada form saya tuliskan dengan huruf cetak
tebal agar memudahkan para user untuk membaca form yang kita buat dengan menggunakan
tag <b>.
Untuk informasi nama, NRP, dan Kelas mirip dengan yang saya jelaskan diatas. Namun
untuk iinformasi jenis kelamin sedikit berbeda dengan sebelumnya. Tepatnya pada bagian
inputnya, disini saya menggunakan type radio button. Sehingga nanti user hanya bisa memilih
satu dari pilihan yang ada.
<tr>
<td><b>7. Alamat : </b></td>
</tr>
<tr>
<td></td>
<td><textarea name="alamat" id="alamat"></textarea> </td>
</tr>
<tr>
Hampir sama dengan bagian sebelumnya disini saya menggunakan tag tr dan td untuk
membuat baris dan kolomnya. Perbedaanya kembali terletak pada jenis inputan pada informasi
yang kelima. Disini saya menggunakan combo box. Dengan tag yang digunakan yakni
<select>, dan untuk isi dari boxnya tersebut kita dapat isi dengan tag option.
Untuk informasi yang keenam cara pembuatannya sama dengan pembuatan informasi
nama, hanya menggunakan tag tr dan td serta untuk type inputannya adalah text box.
Lalu untuk informasi yang ketujuh, yang membedakannya adalah type inputannya
yakni ia menggunakan textbox multiline, sehingga kita bisa menginputkan beberapa baris
kalimat atau informasi pada box yang disediakan. Untuk tag nya sendiri kita bisa menggunakan
tag <textarea>
Disini untuk informasi 9 dan 10 pembuatannya sama dengan pembuatan form informasi
yang nomer satu yakni bagian nama. Disini saya hanya menggunakan tag td dan tr untuk
membuat baris dan juga kolom pada formulir, lalu saya juga menggunakan colspan dengan
value lima yang digunakan untuk menggabungkan 5 kolom menjadi satu, dan type dari inputan
nya adalah text box.
Yang berbeda disini adalah bagian no. 8, karena disini terdapat penjabaran dari
informasi riwayat Pendidikan. Agar form riwayat Pendidikan disamping kanannya kosong kita
bisa memberikan kolom kosong sehingga disamping tulisan Pendidikan tidak terdapat text box.
Lalu untuk memberikan jarak antara batas kiri dengan tulisan sd smp smanya kita hanya perlu
membuat kolom yang kosong sehingga tulisan dan text boxnya dapat lebih menjorok ke tengah.
<tr>
<td><b>11. Hobby :</b> </td>
</tr>
<tr>
<td></td>
<td><textarea name="hobby" id="hobby"></textarea> </td>
</tr>
<tr>
<tr>
<td><b>12. Interest : </b></td>
<td><input name="minat1" type="checkbox" id="minat1" value="ch
eckbox">Komputer</td>
<td><input name="minat2" type="checkbox" id="minat2" value="ch
eckbox">Sport</td>
<td><input name="minat3" type="checkbox" id="minat3" value="ch
eckbox">Traveling</td>
</table>
<br><br>
</form>
</body>
</html>
Untuk hobby sama pembuatannya dengan alamat yang ada pada bagian sebelumnya,
menggunakan tipe inputan yakni text box. Namun pada bagian ini yang membedakan adalah
pada bagian interst menggunakan inputan type check box dengan menggunakan attribute type
dan value : checkbox.
Lalu untuk bagian bawah yang mirip seperti button itu kita bisa menggunakan type
inputan yakni submit dan juga reset dengan value sesuai dengan tulisan yang kita ingin
tampilkan , disini saya memberi tulisan/ valuenya yakni SIMPAN & RESET.
FILE regex.php
<?php
if(isset($_POST['submit'])){
function match($nama){
$pattern = ucwords($nama);
if($nama==$pattern){
echo "Nama Sesuai !";
}else{
echo "Nama Tidak Sesuai ! Coba Lagi";
}
echo "<br><br>";
}
$nama=$_POST['nama'];
match($nama);
}
?>
Analisa :
Diawal tentu saja saya memberikan snytax bahwa ini merupakan file php dengan membuat
<?php dan ditutup dengan ?>. lalu saya menggunakan pengambilan keputusan if yang bilamana
fungsi isset atau fungsi yang bertujuan mengecek apakah value $_POST[‘submit’] sudah terisi
21031910002 | I Gede Raka Sadiantara 7
dan bernilai true akan menjalankan langkah selanjutnya yakni dengan membuat fungsi yang
bernama match dengan parameternya yakni $nama. Fungsi tersebut didalamnnya diawali
dengan membuat variabel pattern yang valuenya yakni fungsi ucwords untuk nama. Sehingga
jika nanti user memasukan nama dalam form maka setiap huruf depan perkatanya harus besar
jika ingin bernilai true. Nah lalu saya lanjutkan dengan membuat pengambilan keputusan if
else. Jika variabel nama sama nilainya dengan pattern maka nantinya akan dicetak Nama
Sesuai, namun jika tidak bernilai sama atau user memasukkan nama dengan awal katanya tidak
huruf kapital maka akan dicetak Nama Tidak Sesuai ! Coba Lagi. Diakhir saya mencetak line
break sebanyak tiga kali untuk memisahkan hasil No. 1 dan No. 2.
Berikut adalah hasil Percobaan No. 1 :
Percobaan 1 (bernilai benar)
function match2($nrp){
$pattern = '/^21101810(3[1-9]|[4-5][0-9]|60)$/';
if(preg_match($pattern,$nrp)){
echo "NRP Sesuai !";
}else{
echo "NRP Tidak Sesuai ! Coba Lagi";
}
echo "<br><br>";
}
No.2 ini merupakan kelanjutan dari No. 1 tadi saya buat seperti itu. Yang diawali
dengan pembuatan fungsi match2 yang parameternya adalah variabel nrp. Lalu didalam
fungsinya sendiri diawali dengan pembuatan variabel pattern yang didalamnya berisikan
regular expression yang yang diapit oleh tanda petik satu (‘) dan juga slash (/). Lalu untuk capit
dan juga tanda dolar itu berarti yang diantaranya itu merupakan satu kesatan utuh dan
berkesinambungan. Yang diawali dengan format angka yang tidak berubah yakni 21101810
dan rentang nilai antara 31 sampai dengan 60 yang jika dibuat regex yakni (3[1-9]|[4-5][0-
9]|60) dibuat seperti itu karena diregex tidak dapat menuliskan rentangan nilai lebih dari satu
digit sehingga jika itu diartikan maka dapat ditulis dengan awalan puluhan 3 dengan satuannya
dari 1-9 karena nilai 30 tak termasuk atau juga dapat ditulis dengan nilai puluhan 4 dan 5
dengan nilai satuannya 0 sampai dengan 9 karena angka dari 40 sampai dengan 59 masuk atau
bernilai benar. Dan terakhir 60.
Lalu saya membuat pengambilan keputusan kembali dengan menggunakan if else dan
jika nilai preg_match (yang merupakan fungsi php yang digunakan untuk pencarian ekspresi
regular pada objek string) bernilai true maka akan dicetak NRP sesuai ! Namun, jika nilainya
false maka akan dicetak NRP tidak sesuai ! Coba Lagi. Lalu diakhir saya mencetak line break
sebanyak 2 untuk memisahkan hasil dari No. 1 dan No. 2.
Percobaan 1 (True)
Jawab :
function match3($tanggal){
$pattern = '/^(([0-9])|([0-2][0-9])|([3][0-1]))\-
(Jan|Feb|Mar|Apr|Mai|Jun|Jul|Agu|Sep|Okt|Nop|Des)\-\d{4}$/';
if(preg_match($pattern,$tanggal)){
echo "Tanggal Sesuai !";
}else{
echo "Tanggal Tidak Sesuai ! Coba Lagi";
}
echo "<br><br>";
}
$nama=$_POST['nama'];
Ini merupakan lanjutan juga dari No. 1 dan No. 2. Disini saya mulai dengan membuat
fungsi match3 dengan parameter variabel tanggal. Lalu untuk fungsinya sendiri dimulai dari
membuat variabel dengan valuenya yakni merupaka regular ekspresion yakni untuk membuat
tanggal. Dengan penulisannya seperti diatas awalnya saya membuat ahrinya terlebih dahulu
([0-9]|[0-2][0-9]|[3][0-1]) ini artinya saya dapat membuat tanggal dari 1 sampai dengan 9 lalu
kita juga bisa memasukkan angka belasan dan dua puluhan dengan satuannya 0 sampai dengan
9 dan terakhir bisa juga dengan tiga puluhan dengan satuannya 0 sampai dengan 1. Lalu untuk
bulannya karena harus berbahasa Indonesia maka kita harus menggunakan or sehingga bisa
menampilkan singakatan bulan dari Januari sampai dengan desember. Lalu terakhir untuk
tahunnya saya menggunakan \d yang merupakan digit angka yang diulang sebanya 4 kali
dengan dinyatakan dengan {4}.
Lalu saya menggunakan pengambilan keputusan yakni if else. Jika fungsi preg_match
dengan parameter pattern dan tanggal bernilai true maka akan mencetak tanggal sesuai. Lalu
jika else atau bernilai false maka akan mencetak tanggal tidak sesuai Coba lagi. Lalu saya
mencetak line break sebanyak 2 kali
Lalu pada bagian akhir saya memberikan value dengan diisi oleh data yang dimasukkan
user yang dibaca dengan $_POST. Mulai dari nama untuk no. 1 nrp untuk no 2 lalu tanggal
untuk no 3 . lalu terakhir saya memanggil setiap fungsinya.
Percobaan 1 (true)