SlideShare a Scribd company logo
BAB I
BELAJAR HTML
HTML (Hypertext Markup Language) adalah bahasa program yang digunakan untuk
menulis format dokumen yang dapat digunakan dalam Web. Dengan HTML, teks ASCII
(file *.txt) dapat dipoles (di-mark-up) dengan kode-kode tertentu yang disebut tag untuk
menjadi dokumen HTML (file *.htm atau *.html). Oleh karena itu, untuk membuat
dokumen HTML, anda bisa menggunakan semua program teks editor biasa, mulai dari
Notepad hingga MS Word. Untuk mudahnya, kita gunakan program Notepad. Bukalah
program Notepad. Bila anda belum tahu caranya, klik Start > Programs > Accessories
lalu Notepad. Sekarang ikutilah dengan seksama latihan-latihan berikut satu demi satu.
A. PENGENALAN KODE HTML
Dalam program Notepad anda, tulislah seperti ini:
<HTML>
</HTML>
Masing-masing baris di atas disebut tag. Tag adalah kode yang digunakan untuk me-
mark-up (memoles) teks ASCII menjadi file HTML. Setiap tag diapit dengan tanda
kurung runcing. Ada tag pembuka yaitu <HTML> dan ada tag penutup yaitu
</HTML> yang ditandai dengan tanda slash (garis miring) di depan awal tulisannya.
Tag di atas memberikan faidah bahwa yang akan ditulis diantara kedua tag tersebut
adalah isi dari dokumen HTML. Perlu anda ketahui bahwa tag-tag html dapat ditulis
dengan huruf besar ataupun huruf kecil. Artinya, penulisan <HTML> atau <html> atau
<Html> sama saja hasilnya. Namun perlu selalu diingat bahwa penulisan tag yang salah
meskipun hanya satu karakter akan berpengaruh terhadap dokumen HTML anda,
bahkan bisa berakibat dokumen HTML anda tidak bisa ditampilkan dalam browser.
Isi dari dokumen HTML yang sesungguhnya adalah yang ditulis diantara tag <BODY>.
Coba tuliskan:
Pemrograman WEB hal 1 dari 27
<HTML>
<BODY>
Tulisan ini akan tampak dalam browser.
</BODY>
</HTML>
Lihatlah hasil karya anda yang pertama!
Tulisan ini akan tampak dalam browser.
Dalam tag BODY ini bisa kita sisipkan bermacam-macam atribut yang akan
berpengaruh terhadap format atau tampilan halaman web secara keseluruhan.
Tambahkan atribut BGCOLOR dan TEXT ke dalam tag body sebagai berikut:
<HTML>
<BODY BGCOLOR="yellow" TEXT="red">
Tulisan ini akan tampak dalam browser.
</BODY>
</HTML>
Maka akan tampaklah hasilnya:
Tulisan ini akan tampak dalam browser
Penentuan warna pada HTML bisa dengan nama warna (dalam bahasa Inggris) dan bisa
pula dengan kode warna. Kode warna ditulis dalam format heksa #rrggbb. Contoh :
black #000000 blue #0000FF olive #808000
white #FFFFFF fuchsia #FF00FF green #008000
red #FF0000 gray #808080 teal #008080
yellow #FFFF00 silver #C0C0C0 navy #000080
lime #00FF00 maroon #800000 purple #800080
aqua #00FFFF
Dengan demikian, kode HTML untuk contoh di atas bisa ditulis sebagai berikut:
Pemrograman WEB hal 2 dari 27
<HTML>
<BODY BGCOLOR="#FFFF00" TEXT="#FF0000">
Tulisan ini akan tampak dalam browser.
</BODY>
</HTML>
Sekarang bukalah kembali source code tambahkanlah tag-tag berikut ini:
<HTML>
<HEAD>
<TITLE></TITLE>
</HEAD>
<BODY BGCOLOR="yellow" TEXT="red">
Tulisan ini akan tampak dalam browser.
</BODY>
</HTML>
B. MENGUTAK-ATIK HURUF
Tag-tag ini berfungsi untuk mengubah tipe huruf yaitu menebalkan (bold), membuat
tulisan miring (italic) atau memberi garis bawah (underline). Buka lagi program
Notepad kemudian tuliskan seperti berikut ini:
<HTML>
<HEAD>
<TITLE>Tipe-tipe Teks</TILE>
</HEAD>
<BODY>
Ada tiga macam tipe tulisan yang paling sering digunakan
dalam penulisan dokumen apa saja. Ketiga tipe tersebut
ialah tulisan tebal, tulisan miring dan tulisan bergaris
bawah. Bisa pula dua tipe huruf dipadukan misalnya tulisan
tebal dan miring, tulisan tebal dan bergaris bawah atau
tulisan miring dan bergaris bawah. Bahkan bisa pula ketiga
Pemrograman WEB hal 3 dari 27
tipe tulisan tersebut sekaligus bergabung menjadi satu
berupa tulisan tebal, miring dan bergaris bawah.
</BODY>
</HTML>
sehingga menjadi seperti ini:
Ada tiga macam tipe tulisan yang paling sering digunakan dalam penulisan dokumen
apa saja. Ketiga tipe tersebut ialah tulisan tebal, tulisan miringdan tulisan bergaris
bawah. Bisa pula dua tipe huruf dipadukan misalnya tulisan tebal dan miring, tulisan
tebal dan bergaris bawah atau tulisan miring dan bergaris bawah. Bahkan bisa pula
ketiga tipe tulisan tersebut sekaligus bergabung menjadi satu berupa tulisan tebal,
miring dan bergaris bawah.
C. HEADER ATAU KEPALA TULISAN
Untuk menuliskan judul bab atau sub bab. Ada enam tingkatan header mulai dari H1
hingga H6. H1 adalah header yang paling besar dan H6 adalah header yang paling
kecil. Coba tulis dalam Notepad anda sebagai berikut:
<HTML><BODY>
<H1>Header level 1</H1>
<H2>Header level 2</H2>
<H3>Header level 3</H3>
<H4>Header level 4</H4>
<H5>Header level 5</H5>
<H6>Header level 6</H6>
<HTML><BODY>
Simpanlah dalam format file HTML kemudian buka dalam browser. Hasilnya akan
tampak sebagai berikut:
Pemrograman WEB hal 4 dari 27
Header level 1
Header level 2
Header level 3
Header level 4
Header level 5
Header level 6
D. BARIS DAN PARAGRAF
Cobalah membuat tulisan berikut pada Notepad:
<HTML><BODY>
Baris pertama
Baris kedua
Baris ketiga
<HTML><BODY>
Simpanlah sebagai file HTML kemudian bukalah dalam browser. Bagaimana hasilnya?
Ternyata hasilnya hanya seperti ini:
Baris pertama Baris kedua Baris ketiga.
Kesimpulannya, penekanan tombol Enter tidak menghasilkan baris dalam tampilan
browser. Demikianlah sifat penulisan dokumen HTML. Lantas, bagaimana caranya
membuat baris? Gunakanlah tag <BR>. Tag ini tidak mempunyai tag penutup. Bukalah
source kode file HTML tadi lalu edit seperti berikut:
<HTML><BODY>
Baris pertama
<BR>Baris kedua
<BR>Baris ketiga
</HTML></BODY>
Simpan kemudian lihat hasilnya dengan me-refresh pada browser. Hasilnya kurang
lebih akan seperti ini:
Pemrograman WEB hal 5 dari 27
Baris pertama
Baris kedua
Baris ketiga
Membuat baris kalimat, gampang kan ? Tag <BR> tersebut dapat pula digunakan untuk
membuat baris kosong, artinya baris yang tidak mempunyai kalimat apa-apa. Editlah
sekali lagi source code latih4.htm menjadi seperti ini:
<HTML><BODY>
Baris pertama<BR><BR>Baris kedua kosong, dan ini baris
ketiga<BR><BR><BR>Baris keempat dan kelima kosong, dan ini
baris keenam
</BODY></HTML>
Simpan lalu refresh sekali lagi maka hasilnya akan seperti ini:
Baris pertama
Baris kedua kosong, dan ini baris ketiga
Baris keempat dan kelima kosong, dan ini baris keenam
Di sini kita lihat bahwa tag <BR> yang ditulis dua kali akan menghasilkan dua baris,
demikian seterusnya. Setelah pandai membuat baris, sekarang kita akan belajar
membuat paragraf. Perhatikanlah contoh tulisan di bawah ini:
<HTML><BODY>
Paragraf pertama <P>Paragraf kedua <P>Paragraf ketiga
</BODY></HTML>
Bila dilihat dalam browser, hasilnya akan seperti ini:
Paragraf pertama
Paragraf kedua
Pemrograman WEB hal 6 dari 27
Paragraf ketiga
BAB II
BELAJAR PHP
A. MEMBUAT GRAFIK DATA VERTIKAL DENGAN PHP
dengan format Graphic Batang
Ini cara bikin grafik sederhana tanpa gambar di PHP, dengan bentuk vertikal
pertama kita butuh sql data dari database:
bikin database, dengan nama: graph_dbase
contoh :
Code:
CREATE TABLE `report_toko` (
`id` int(11) NOT NULL auto_increment,
`nama_toko` varchar(255) NOT NULL default '',
`laba` int(11) NOT NULL default '0',
PRIMARY KEY (`id`)
) ENGINE=MyISAM DEFAULT CHARSET=latin1 AUTO_INCREMENT=5 ;
--
-- Dumping data for table `report_toko`
--
INSERT INTO `report_toko` VALUES (1, 'Toko A', 100000);
INSERT INTO `report_toko` VALUES (2, 'Toko B', 25000);
INSERT INTO `report_toko` VALUES (3, 'Toko C', 15000);
INSERT INTO `report_toko` VALUES (4, 'Toko D', 5000);
Pemrograman WEB hal 7 dari 27
bikin koneksi :
Code:
$varData = array('localhost', 'root', '', 'graph_dbase');
list($host, $user, $pass, $db) = $varData;
$con = mysql_connect($host, $user, $pass);
mysql_select_db($db, $con) or die('ERROR DBASE CON');
Pemrograman WEB hal 8 dari 27
<td valign="bottom" title="Nama Toko: <? echo $row['nama_toko'];
?>"><table border=0 cellpadding=0 cellspacing=2>
<tr align=center valign=bottom><td style="background-
color:#E0F0FF;"><table border=0 cellspacing=0 cellpadding=0 width=100%>
<tr align=center><td height=102 valign=bottom nowrap
style="color:black;font-family:Arial, Helvetica;font-size:12px;"><? echo
$percent; ?> %</td>
</tr><tr align=center valign=bottom><td><table border=0 cellspacing=0
cellpadding=0><tr><td style="border:2px outset white;" bgcolor="#A0C0F0"
title="<? echo "Rp. ".number_format($graphLineValue,3,"",".").",-"."";
?>"><div style="width:20px; height:<? echo $graphLineValue; ?>px; line-
height:1px; font-
size:1px;"></div></td></tr></table></td></tr></table></td></tr><tr
align=center>
<td style="color:#000000;background-color:#FFFFFF;border:2px
groove white;font-family:Arial, Helvetica;font-size:12px;" nowrap>&nbsp;<?
echo "Rp. ".number_format($graphLineValue,3,"",".").",-".""; ?> &nbsp;</td>
</tr><tr><td bgcolor="#C0E0FF" style="color:#000000;background-
color:#C0E0FF;border:2px groove white;font-family:Arial, Helvetica;font-
size:12px;text-align:center;">&nbsp;<? echo $row['nama_toko'];
?>&nbsp;</td>
</tr></table></td>
<?
}
?>
</tr></table>
<div style="font-family:'Courier New'; font-size:24px; font-weight:bold;
padding-top:20px; text-align:center;">
<?
echo "Total Laba = Rp. ".number_format($ttl[ttlLaba],0,"",".").",-"."";
?>
</div>
sebagai penentu tinggi dari grafiknya ada pada baris:
Code:
$graphLineValue = round(($row[laba] * 100) / $most_value);
NOTE: round = pembulatan digit angka dibelakang koma
sedangkan untuk perhitungan nilai persentasenya ada pada baris:
Code:
$percent = round(($row[laba] * 100) / $ttl[ttlLaba], 2);
jadi kalo di preview di browser, seperti gini:
Pemrograman WEB hal 9 dari 27
B. MENGIRIM EMAIL MASSAL
Pasti anda tidak asing lagi dengan yang namanya email massal. Yah, email massal
merupakan metode pengiriman email ke beberapa orang sekaligus.Biasanya Yahoo
mail, gmail, dan beberapa web mail lainnya telah menyediakan fitur ini. Bahkan bisa
dibilang semuanya pasti sudah menyediakan. Nah, kalau selama ini kita hanya
menggunakan fasilitas tersebut, bagaimana jika kita membuatnya sendiri ? Tentu lebih
bangga bukan ?
Pertama-tama buat databasenya terlebih dahulu.
CREATE DATABASE `emailmassal` ;
CREATE TABLE `emailmassal`.`email` (
`id` MEDIUMINT( 8 ) NOT NULL AUTO_INCREMENT PRIMARY KEY ,
`nama` VARCHAR( 50 ) NOT NULL ,
`email` VARCHAR( 50 ) NOT NULL
) ENGINE = MYISAM
INSERT INTO `emailmassal`.`email` (
`id` ,
`nama` ,
`email`
)
VALUES (
Pemrograman WEB hal 10 dari 27
'1', 'ivan', 'ivan@ilmuwebsite.com'
);
Notes : dalam contoh ini, email yang terdapat di database Cuma 1. Anda dapat
menambah email-email lain jika mau. :)
config.php
<?php
class config {
var $host = "localhost";
var $user = "root";
var $pass = "";
var $nama_db = "emailmassal"; // nama database
function config() {
$this->connect = mysql_connect($this->host,$this->user,$this->pass);
$this->select_db = mysql_select_db($this->nama_db);
if(!$this->connect)
{
print "<center>Gagal koneksi dengan PHPmyAdmin.. !<br>Cek kembali nama host,
user, dan password anda !</center>";
}
} // tutup function config
}
?>
Index.php
<?php
include("config.php");
?>
<form name="form1" method="post" action="?kirim=mail">
<p>
Untuk : <br>
<select name="to" id="to">
<?php
class daftar extends config {
var $sql = "SELECT * FROM email";
function email () {
$this->query = mysql_query($this->sql);
print "<option value=semua selected=selected>-Semua email-</option>";
while($this->run_query = mysql_fetch_array($this->query))
{
print "<option value=".$this->run_query['email'].">".$this-
>run_query['email']."</option>";
}
} // end function email
}
$p = new daftar();
$p->email();
Pemrograman WEB hal 11 dari 27
?>
</select>
</p>
<p>Subject :<br>
<input name="pesan" type="text" id="pesan">
</p>
<p>Pesan :<br>
<textarea name="pesan" cols="40" rows="5" id="pesan"></textarea>
</p>
<p>
<input type="submit" name="Submit" value="Kirim &gt;&gt;">
</p>
</form>
<?php
if($_GET['kirim'])
{
class email extends daftar {
function kirimmail () {
$to = $_POST['to'];
$subject = $_POST['subject'];
$pesan = $_POST['pesan'];
$from = "From: email anda"; // isi dengan email anda
if($to == "semua")
{
$this->query = mysql_query($this->sql);
while($this->run_query = mysql_fetch_array($this->query))
{
mail($to,$subject,$pesan,$from);
}
}
else
{
mail($to,$subject,$pesan,$from);
}
} // end function kirimmail
} // end class
$m = new email();
$m->kirimmail();
}
?>
Sedikit Penjelasan kode diatas :
Pada class config, kita variabelkan nama host,user,dan pass. Lalu kita konekkan
dengan database pada function config. Function config itulah yang dinamakan
constructor. Pada index.php, terdapat class daftar extends config, gunanya adalah
untuk mengkonekkan dengan database, lalu kita variabelkan $sql yang merupakan
perintah query. Lalu perintah query tersebut kita wariskan ke class email. Gunanya
adalah agar tidak perlu melakukan penulisan ulang query tersebut.
Pemrograman WEB hal 12 dari 27
C. LEBIH DALAM MENGENAL ARRAY
Untuk merepresentasikan sebuah array, kita ambil contoh :
$angka = array("Satu", "Dua", "Tiga");
Dari situ timbul pertanyaan-pertanyaan berkenaan dengan array, salah satunya adalah
bagaimana caranya mengambil suatu data yang berada dalam array. Dimisalkan yang
akan diambil adalah "Dua". Hal yang perlu dilakukan cukup dengan menggunakan
nama variable si array tersebut ditambah dengan urutan keberapakah data yang akan
diambil nantinya.
Maka ...
$angka = array("Satu", "Dua", "Tiga");
$ambilarray = $angka[1];
echo $ambilarray ;
Yang ditampilkan dalam browser ..
Dua
Lalu timbul satu pertanyaan lagi, mengapa untuk mengambil data "Dua" itu berada
pada urutan ke 1?. Sebagaimana ditampilkan dalam source code $angka[1];. Yup, ini
terjadi dikarenakan array itu bermula dari angka 0. Sehingga :
"Satu" itu berada pada urutan ke 0
"Dua" itu berada pada urutan ke 1 , sedangkan
"Tiga" itu berada pada urutan ke 2
Hmmm... jika ada variabel dalam variabel. Bagaimana dengan array dalam array ?
Pastinya inilah yang dinamakan array multidimensi. Penulis tidak akan menjelaskan
mengenai array 2 dimensi atau lebih dikarenakan hal ini amat jarang sekali dipakai.
Contohnya ...
Pemrograman WEB hal 13 dari 27
$angka = array("Satu", array("Dua","Tiga") , "Empat");
Untuk mengambil nilai dua yang terdapat dalam array tersebut. Cukup dengan
memanggil nama variabel arraynya seperti ini :
$angka = array("Satu", array("Dua","Tiga") , "Empat");
$ambilarray = $angka[1][0];
echo $ambilarray ;
Hasil di browser adalah ...
Dua
Begitu juga dengan bentuk array yang lain.
$angka = array("Satu", "Dua" => "Satu di tambah Satu", "Tiga");
Perhatikan baris "Dua" => "Satu ditambah Satu" ini berarti variabel "Dua" memiliki
nilai "Satu ditambah satu", sehingga untuk mengambil nilai yang berada dalam
variabel Dua ...
$angka = array("Satu", "Dua" => "Satu di tambah Satu", "Tiga");
$nilaidua = $angka['Dua'];
echo $nilaidua ;
Maka yang akan ditampilkan oleh browser adalah ...
Satu ditambah Satu
Yup, array memiliki banyak sekali peran dalam web development. Penulis sendiri
menggunakan array dalam manajemen artikel., searching database,
dan banyak lagi contoh yang lain dimana pentingnya peranan seorang Array. :D~~
Dari situ penulis akan memberikan sebuah contoh dari implementasi array.
Untuk implementasi kali ini penulis akan menggunakan array sebagai database
penyimpanan kata-kata yang nantinya akan diblokir.
Blokir kata dalam komentar dengan Array
Sebelumnya buat database komentarnya terlebih dahulu.
create database komentar;
use komentar;
create table komentar( id int(5) primary key auto_increment, penulis varchar(50),
email varchar(30), isikomentar text);
insert into komentar values('','Al-k','alkemail@gmail.com','Pada dasarnya Ryuzaki itu
tidak ganteng');
insert into komentar values('','Al-k','alkemail@gmail.com','Pada dasarnya Ryuzaki
manusia juga');
insert into komentar values('','Al-k','alkemail@gmail.com','Pada dasarnya Ryuzaki
adalah manusia yang tidak keren huehueue');
Kemudian file config.php, file ini yang menghubungkan antara database dengan
webserver apache ...
Pemrograman WEB hal 14 dari 27
<?php
$user = "root" ;
$passwd = "";
$host = "localhost" ;
$koneksi = mysql_connect($host, $user, $passwd) ;
mysql_select_db("komentar",$koneksi) or die ("Database tidak bisa dikoneksi");
?>
Selanjutnya file intinya, array.php :
<?php
require_once "config.php";
$perintah = "select * from komentar order by id desc";
$jalankanperintahnya = mysql_query($perintah);
$katayangdiblokir = "keren ganteng";
$potongkata = explode(" ", $katayangdiblokir);
$jumlaharray = count($potongkata);
if ($_REQUEST['isikomentar'] == "iya" )
{
if (ISSET($_POST['isinya']))
{
$isikomentarnyaadalah = $_POST['isinya'];
$namanya = $_POST['namanya'];
$emailnya = $_POST['emailnya'];
mysql_query("insert into komentar values
('','$namanya','$emailnya','$isikomentarnyaadalah')");
header ("location: array.php");
}
}
echo "<b>Komentar :</b><br><hr>";
while ($hasil = mysql_fetch_array($jalankanperintahnya))
{
$nama = $hasil['penulis'];
$email = $hasil['email'];
$komentar = strtolower($hasil['isikomentar']);
$isikomentar = explode(" ",$komentar);
$arraykomentar = count($isikomentar)."<br>";
$total_loop = $arraykomentar + $jumlaharray ;
for ( $i = 0; $i < $jumlaharray ; $i++)
Pemrograman WEB hal 15 dari 27
{
if(in_array($potongkata[$i],$isikomentar))
{
$komentar = "<font color=red><b>no comment</b></font>" ;
}
}
echo "Nama : $nama <br>";
echo "Email : $email <br>";
echo "Komentar : <br>$komentar <hr>";
}
?>
<html><body>
<b>Isi Komentar :</b>
<table border=0>
<form method = 'POST' action = <?php echo
"$_SERVER[PHP_SELF]?isikomentar=iya" ; ?> >
<tr><td>Nama:</td><td><input type=text name=namanya></td></tr>
<tr><td>Email:</td><td><input type=text name=emailnya></td></tr>
<tr><td valign=top>Isinya:</td><td><textarea rows=6 cols=40
name=isinya></textarea></td></tr>
<tr><td></td><td><input type=submit name=submit value=Kirim
style='color: #000000; border: 1px solid #000000; background-color:
#DFDFDF'></td></tr>
</form></table>
</body>
</html>
Dilangsungkan ke script intinya saja.
Perhatikan barisan kalimat ...
require_once "config.php";
$perintah = "select * from komentar order by id desc";
$jalankanperintahnya = mysql_query($perintah);
:D cukup familiar? yups, dengan memanfaatkan file koneksi antara webserver dengan
mysql servernya, yakni file config.php. Lalu tampilkan semua isi dari tabel komentar
dan lakukan sorting berdasarkan id yang terakhir kali disimpan dalam database.
Kemudian ...
$katayangdiblokir = "keren ganteng";
$potongkata = explode(" ", $katayangdiblokir);
$jumlaharray = count($potongkata);
Database kata yang nantinya akan diblokir disisipkan kedalam variabel
$katayangdiblokir. Lalu muncul kembali pertanyaan, mengapa tidak berbentuk seperti
ini :
Pemrograman WEB hal 16 dari 27
$katayangdiblokir = array("keren","ganteng");
Karena penulis akan mencoba mengenalkan penggunaan fungsi explode. Explode
berfungsi untuk memisahkan suatu string menjadi kumpulan variabel-variabel.
explode() yang digunakan dalam implementasi kali ini berfungsi untuk membuat array
dengan memisahkan variabel menggunakan spasi.
kumpulkan databasenya ...
$katayangdiblokir = "keren ganteng";
kemudian pisahkan lalu masukkan ke dalam array $potongkata
$potongkata = explode(" ", $katayangdiblokir);
Sehingga hasilnya nanti sama dengan $katayangdiblokir = array("keren","ganteng");
Kemudian jumlahkan variabel yang berada dalam array
$jumlaharray = count($potongkata);
Lalu perhatikan susunan kalimat ini ...
if ($_REQUEST['isikomentar'] == "iya" )
{
if (ISSET($_POST['isinya']))
{
$isikomentarnyaadalah = $_POST['isinya'];
$namanya = $_POST['namanya'];
$emailnya = $_POST['emailnya'];
mysql_query("insert into komentar values
('','$namanya','$emailnya','$isikomentarnyaadalah')");
header ("location: array.php");
}
}
Sebelum beralih lebih lanjut, coba kita perhatikan form yang dihasilkan dari halaman
array.php
<form method = 'POST' action = <?php echo
"$_SERVER[PHP_SELF]?isikomentar=iya" ; ?> >
<tr><td>Nama:</td><td><input type=text name=namanya></td></tr>
<tr><td>Email:</td><td><input type=text name=emailnya></td></tr>
<tr><td valign=top>Isinya:</td><td><textarea rows=6 cols=40
name=isinya></textarea></td></tr>
<tr><td></td><td><input type=submit name=submit value=Kirim
style='color: #000000; border: 1px solid #000000; background-color:
#DFDFDF'></td></tr>
</form>
Yang dihasilkan oleh form ini adalah :
variabel $ POST['namanya'] yang diambil dari text box "namanya"
Pemrograman WEB hal 17 dari 27
variabel $_POST['emailnya'] yang diambil dari text box "emailnya"
kemudian variabel $_POST['isinya'] yang diambil dari text area dan
variabel $_REQUEST['isikomentar'] yang dihasilkan dari action si form, dalam hal ini
<form method = 'POST' action = <?php echo
"$_SERVER[PHP_SELF]?isikomentar=iya" ; ?> >
Kita kembali ke baris ini
if ($_REQUEST['isikomentar'] == "iya" )
{
if (ISSET($_POST['isinya']))
{
$isikomentarnyaadalah = $_POST['isinya'];
$namanya = $_POST['namanya'];
$emailnya = $_POST['emailnya'];
mysql_query("insert into komentar values
('','$namanya','$emailnya','$isikomentarnyaadalah')");
header ("location: array.php");
}
}
ketika user telah selesai mengisi komentar
if ($_REQUEST['isikomentar'] == "iya" )
dan apabila user telah mempost ( me-submit ) komentarnya
if (ISSET($_POST['isinya']))
maka kenalkan variabel global $_POST['isinya'] sebagai $isikomentarnyaadalah,
kemudian jadikan $_POST['emailnya'] sebagai variabel $emailnya.
$isikomentarnyaadalah = $_POST['isinya'];
$namanya = $_POST['namanya'];
$emailnya = $_POST['emailnya'];
kemudian masukkan kedalam database
mysql_query("insert into komentar values
('','$namanya','$emailnya','$isikomentarnyaadalah')");
setelah selesai, lakukan redirect ke halaman array.php
header ("location: array.php");
sehingga user langsung dapat melihat komentar yang baru saja dimasukkan.
Bisa diperhatikan juga kalimat ini
while ($hasil = mysql_fetch_array($jalankanperintahnya))
{
$nama = $hasil['penulis'];
$email = $hasil['email'];
Pemrograman WEB hal 18 dari 27
$komentar = strtolower($hasil['isikomentar']);
$isikomentar = explode(" ",$komentar);
$arraykomentar = count($isikomentar)."<br>";
$total_loop = $arraykomentar + $jumlaharray ;
for ( $i = 0; $i < $jumlaharray ; $i++)
{
if(in_array($potongkata[$i],$isikomentar))
{
$komentar = "<font color=red><b>no comment</b></font>" ;
}
}
echo "Nama : $nama <br>";
echo "Email : $email <br>";
echo "Komentar : <br>$komentar <hr>";
}
Penulis ambil kalimat intinya :
Selama dalam database masih terdapat record, ambil nilainya dan sisipkan kedalam
variabel $hasil
while ($hasil = mysql_fetch_array($jalankanperintahnya))
lakukan change case pada isikomentar dalam database menjadi huruf kecil semua ...
$komentar = strtolower($hasil['isikomentar']);
jadikan array dengan memanfaatkan spasi yang ada
$isikomentar = explode(" ",$komentar);
Berapakah jumlah variabel yang terdapat dalam array ?
$arraykomentar = count($isikomentar)."<br>";
Sebuah baris lagi yang perlu dipahami ...
$total_loop = $arraykomentar + $jumlaharray ;
ini terjadi dikarenakan adakalanya saat-saat dimana komentar yang dimasukkan oleh
user lebih sedikit dari database kata yang akan diblokir, dan seringkali database kata
yang diblokir itu lebih sedikit jumlah arraynya dibandingkan komentar yang
dimasukkan. Sehingga perlu dijumlahkan antara jumlah array pada komentar yang
diblokir dengan jumlah array dari komentar yang dimasukkan.
Ini dia kalimat intinya ...
for ( $i = 0; $i < $jumlaharray ; $i++)
{
if(in_array($potongkata[$i],$isikomentar))
{
Pemrograman WEB hal 19 dari 27
$komentar = "<font color=red><b>no comment</b></font>" ;
}
}
lakukan pengulangan sebanyak $jumlaharray kesemuanya.
for ( $i = 0; $i < $jumlaharray ; $i++)
jika didalam isi komentar terdapat kata-kata yang diblokir.
if(in_array($potongkata[$i],$isikomentar))
maka tampilkan komentar yang ada menjadi no comment
$komentar = "<font color=red><b>no comment</b></font>" ;
selain itu tampilkan seperti adanya.
Contoh lain penggunaan fungsi in_array( ) :
$buah = array ("Mangga", "Jambu", "Pepaya", "Pisang");
if (in_array ("Jambu", $buah))
{
print "Ada buah Jambu euyyy ... ";
}
Jika terdapat Jambu dalam array buah
if (in_array ("Jambu", $buah))
maka tampilkan Ada buah Jambu euyyy ...
print "Ada buah Jambu euyyy ... ";
Dari situ mungkin anda memiliki ide-ide brilian guna diimplementasikan dalam web
anda tentunya.
Jadi, silahkan kembangkan imajinasi anda dan tuangkan dalam cangkir source code. :-
q
D. MENANGKAP VARIABEL POST
Halo semua, jumpa lagi dengan Phii. Kali ini, Phii akan membahas bagiamana
menangkap variabel post pada form buku tamu sederhana agar ketika pengunjung
memasukkan data dan ada beberapa data yang tidak valid, pengunjung web kita tidak
perlu mengisi ulang dari awal lagi. Bingung? Kira2 begini, misal pengunjung web kita
sudah menulis panjang lebar untuk data pesan, tapi kelupaan nulis data email, padahal
data email wajib ditulis. Nah, ketika dikirim, proses akan dibatalkan karana ada data
yang tidak lengkap dan akan menampilkan kembali form buku tamu yang kosong.
Pemrograman WEB hal 20 dari 27
Kasihan kan kalo harus nulis lagi, bisa jadi malah pengunjung web kita males n ga jadi
nulis buku tamu. sudah cukup jelas? Oke...langsung kita bahas. Mari kita siapkan
file2-nya :
database
create database db_gb ;
use db_gb;
create table guestbook (id int unsigned not null primary key auto_increment, nama
varchar(50) not null, email varchar(100) not null, pesan text not null);
file koneksi.php
<?php
$host="localhost"; $uname="root"; $pass=""; $db="db_gb";
$koneksi=mysql_connect($host,$uname,$pass);
mysql_select_db($db,$koneksi);
?>
file lihatgb.php
<?php
$queryGb = mysql_query("select * from guestbook");
$jmlGb = mysql_num_rows($queryGb);
if($jmlGb==0)
{
echo"Data buku tamu masih kosong";
}
else
{
$queryTampil=mysql_query("select * from guestbook order by id desc");
echo"<p>DATA BUKU TAMU<p>";
while($dataGb=mysql_fetch_row($queryTampil))
{
echo"<b>$dataGb[1]</b><br>";
echo"".wordwrap($dataGb[3],85,"<br>",1)." ";
echo"<hr width=50% align=left>";
}
}
?>
file gb.php
<?php
include'koneksi.php';
if(isset($_POST['kirim']) && ($_POST['kirim']=='Kirim'))
{
$nama=trim(strip_tags($_POST['nama']));
Pemrograman WEB hal 21 dari 27
$email=trim(strip_tags($_POST['email']));
$pesan=trim(strip_tags($_POST['pesan']));
//validasi form
if($nama=='')
$error1= "<font color=red>&nbsp;&nbsp;&laquo; Nama belum
diisi</font><br>";
if($email=='')
$error2= "<font color=red>&nbsp;&nbsp;&laquo; Email belum
diisi</font><br>";
if($pesan=='')
$error3= "<font color=red>&nbsp;&nbsp;&laquo; Pesan belum
diisi</font><br>";
if($email!='')
{
$polaemail = "^.+@.+..+$"; //nyontek tutorial validasi email yg ditulis
b_scorpio :)
$cek=eregi($polaemail,$email);
if(!$cek)
{
$error4="<font color=red>&nbsp;&nbsp;&laquo; Pola email
salah</font>";
}
}
//jika semua data valid
if(($nama!='') && ($email!='') && $cek && ($pesan!=''))
{
//simpan data buku tamu
$queryAddGb=mysql_query("insert into guestbook
values(NULL,'$nama','$email','$pesan')");
if($queryAddGb) //jika query simpan buku tamu berhasil
Pemrograman WEB hal 22 dari 27
{
//tampilkan pesan berhasil
echo"<font color=red><b>Guestbook berhasil disimpan</b></font>";
echo"<meta http-equiv="refresh" content="2; url=./gb.php">";
exit;
}
else //jika query gagal
{
//tampilkan pesan gagal
echo"<font color=red><b>Data gagal disimpan</b></font>";
echo"<meta http-equiv="refresh" content="10; url=./gb.html">";
exit;
}
}
if(isset($error1) || isset($error2) || isset($error3) || isset($error4))
{
//tangkap variabel post untuk menampilkan kembali data yang sudah diisi
pada form
$ex_nama=trim(strip_tags($_POST['nama']));
$ex_email=trim(strip_tags($_POST['email']));
$ex_pesan=trim(strip_tags($_POST['pesan']));
}
}
include'lihatgb.php';
//semua value variabel diset kosong jika belum diisi
if(empty($ex_nama))
{
$ex_nama='';
}
if(empty($ex_email))
{
Pemrograman WEB hal 23 dari 27
$ex_email='';
}
if(empty($ex_pesan))
{
$ex_pesan='';
}
?>
<p><br><br>FORM BUKU TAMU
<form method="post" action="">
Nama *<br><input type="text" name="nama" size="34" value="<?php echo
$ex_nama;?>"><?php
if(isset($error1)) //jika data nama kosong
{
echo $error1; //tampilkan pesan di samping textbox nama
}
?><br>
Email *<br><input type="text" name="email" size="34" value="<?php echo
$ex_email;?>"><?php
if(isset($error2)) //jika data email kosong
{
echo $error2; //tampilkan pesan d isamping textbox email
}
if(isset($error4)) //jika data email tidak sesuai dengan pola email
{
echo $error4; //tampilkan pesan di samping textbox email
}
?><br>
Pesan *<br><textarea name="pesan" rows="8" cols="40"><?php echo
$ex_pesan;?></textarea><?php
if(isset($error3)) //jika data pesan kosong
{
echo $error3; //tampilkan pesan di samping textarea pesan
}
Pemrograman WEB hal 24 dari 27
?>
<br>*) Wajib diisi <br>
<input type="reset" value="Reset" name="kosongkan">
<input type="submit" value="Kirim" name="kirim">
</form>
Mari dicoba :
Jalankan file gb.php
Coba isi beberapa data, misal :
data nama : Bolang
data pesan: Aku senang sekali mengunjungi ilmuwebsite.com, karena disini aku bisa
belajar web programming. Untuk para staf, cayoo...jangan pernah bosan berbagi
ilmu, agar semakin banyak anak2 bangsa ini yang pinter web programming. Selalu
ditunggu artikel2 barunya, n....tetap semangatttttt!!!
Lalu klik Kirim
Apa yang terjadi? Si Bolang ini lupa ga masukin data email. Alhasil proses simpan
buku tamu ditolak karana data email wajib diisi.
Disinilah topik bahasan artikel ini berguna. Yuppp....karena variabel yang sudah
diisi telah ditangkap pak polisi, eh...salah, maksudnya ditangkap oleh variabel
ex_nama dan ex_pesan, maka ketika form buku tamu ditampilkan kembali, data2 yang
sudah diisi tidak kosong tapi sudah terisi oleh data yg sebelumnya sudah dimasukkan.
Jadi Si Bolang tinggal mengisi data email saja.
Pemrograman WEB hal 25 dari 27
Coba masukkan data email : bolang@yahoo, lalu klik Kirim
Aduh..aduhhhh...Si Bolang ini orangnya kurang teliti sama kaya Phii. Jadi ketika
disimpan, lagi2 proses ditolak, karena pola email tidak sesuai dengan pola yang sudah
ditentukan.
Kali ini variabel yang ditangkap tidak hanya nama dan pesan, tapi juga email. Form
yang ditampilkan akan menampilkan data2 yang sudah dimasukkan sebelumnya.
Pemrograman WEB hal 26 dari 27
Kali ini Si Bolang tidak akan melakukan kesalahan input lagi. Si Bolang
menambahkan .com pada data email, sehingga data email menjadi
bolang@yahoo.com. Lalu klik Kirim.
Horeeee....Bolang sukses mengisi form buku tamu.
Pemrograman WEB hal 27 dari 27

More Related Content

What's hot

Belajar html untuk pemula 1
Belajar html untuk pemula 1Belajar html untuk pemula 1
Belajar html untuk pemula 1Ridwan Ajjh
 
Cara membuat html (desma susanti)
Cara membuat html (desma susanti)Cara membuat html (desma susanti)
Cara membuat html (desma susanti)
Desma_susanti
 
Html power point
Html power pointHtml power point
Html power point
minmon
 
MODUL_HTML_TIK_XII
MODUL_HTML_TIK_XIIMODUL_HTML_TIK_XII
MODUL_HTML_TIK_XII
Kartiwa G.S., S.Kom
 
Caramembuat website sederhana
Caramembuat website sederhanaCaramembuat website sederhana
Caramembuat website sederhanaLyadi
 
Modul html
Modul htmlModul html
Modul html
fajaralpindra
 
9. b.. . .
9. b.. . .9. b.. . .
9. b.. . .
vicky alhuda
 
Week 11 (Pengenalan Html 1) Student
Week 11 (Pengenalan Html 1)   StudentWeek 11 (Pengenalan Html 1)   Student
Week 11 (Pengenalan Html 1) Student
imaru.wordpress.com
 
Modul web affif
Modul web affifModul web affif
Modul web affif
Sejahtera Affif
 
Membuat desain website berbasis html dengan notepad
Membuat desain website berbasis html dengan notepadMembuat desain website berbasis html dengan notepad
Membuat desain website berbasis html dengan notepadArdiyanto Top
 
Dasar-dasar H t m l
Dasar-dasar H t m lDasar-dasar H t m l
Presentasi konsep dasar html
Presentasi konsep dasar htmlPresentasi konsep dasar html
Presentasi konsep dasar html
Dedy Setiawan
 
Modul HTML5
Modul HTML5Modul HTML5
Modul HTML5
As Faizin
 
Web html
Web htmlWeb html
Web html
Fajar Baskoro
 
Training HTML
Training HTMLTraining HTML
Training HTML
Yanwar Purnama
 

What's hot (16)

Belajar html untuk pemula 1
Belajar html untuk pemula 1Belajar html untuk pemula 1
Belajar html untuk pemula 1
 
Cara membuat html (desma susanti)
Cara membuat html (desma susanti)Cara membuat html (desma susanti)
Cara membuat html (desma susanti)
 
Html power point
Html power pointHtml power point
Html power point
 
MODUL_HTML_TIK_XII
MODUL_HTML_TIK_XIIMODUL_HTML_TIK_XII
MODUL_HTML_TIK_XII
 
Caramembuat website sederhana
Caramembuat website sederhanaCaramembuat website sederhana
Caramembuat website sederhana
 
Modul html
Modul htmlModul html
Modul html
 
9. b.. . .
9. b.. . .9. b.. . .
9. b.. . .
 
Week 11 (Pengenalan Html 1) Student
Week 11 (Pengenalan Html 1)   StudentWeek 11 (Pengenalan Html 1)   Student
Week 11 (Pengenalan Html 1) Student
 
Modul web affif
Modul web affifModul web affif
Modul web affif
 
Membuat desain website berbasis html dengan notepad
Membuat desain website berbasis html dengan notepadMembuat desain website berbasis html dengan notepad
Membuat desain website berbasis html dengan notepad
 
Dasar-dasar H t m l
Dasar-dasar H t m lDasar-dasar H t m l
Dasar-dasar H t m l
 
Presentasi konsep dasar html
Presentasi konsep dasar htmlPresentasi konsep dasar html
Presentasi konsep dasar html
 
Modul HTML5
Modul HTML5Modul HTML5
Modul HTML5
 
Jamal's dokumen
Jamal's dokumenJamal's dokumen
Jamal's dokumen
 
Web html
Web htmlWeb html
Web html
 
Training HTML
Training HTMLTraining HTML
Training HTML
 

Viewers also liked

Panduan biarkan php-mengabadikannya!
Panduan biarkan php-mengabadikannya!Panduan biarkan php-mengabadikannya!
Panduan biarkan php-mengabadikannya!Haswi Haswi
 
Wawan tutorial-zend-bagian-4
Wawan tutorial-zend-bagian-4Wawan tutorial-zend-bagian-4
Wawan tutorial-zend-bagian-4Haswi Haswi
 
Use Eclipse Technologies to build a modern embedded development IDE
Use Eclipse Technologies to build a modern embedded development IDEUse Eclipse Technologies to build a modern embedded development IDE
Use Eclipse Technologies to build a modern embedded development IDE
Benjamin Cabé
 
Flexter Pulsa Opportunity
Flexter Pulsa OpportunityFlexter Pulsa Opportunity
Flexter Pulsa Opportunity
Business Opportunity
 
Membangun server intranet dengan linux
Membangun server intranet dengan linuxMembangun server intranet dengan linux
Membangun server intranet dengan linux
Didit Septiawan
 
MMR-based active machine learning for Bio named entity recognition
MMR-based active machine learning for Bio named entity recognitionMMR-based active machine learning for Bio named entity recognition
MMR-based active machine learning for Bio named entity recognitionSeokhwan Kim
 
Ebook Internet Sehat
Ebook Internet SehatEbook Internet Sehat
Ebook Internet Sehat
Business Opportunity
 
Penggunaan xampp
Penggunaan xamppPenggunaan xampp
Penggunaan xamppHaswi Haswi
 
Peer to peer dan client server
Peer to peer dan client serverPeer to peer dan client server
Peer to peer dan client serverHaswi Haswi
 
Desain web 2 kolom
Desain web 2 kolomDesain web 2 kolom
Desain web 2 kolomHaswi Haswi
 
Masuun ajarmysql5-2
Masuun ajarmysql5-2Masuun ajarmysql5-2
Masuun ajarmysql5-2Haswi Haswi
 
Wawan tutorial-zend-bagian-1-3
Wawan tutorial-zend-bagian-1-3Wawan tutorial-zend-bagian-1-3
Wawan tutorial-zend-bagian-1-3Haswi Haswi
 
Belajar menjadi developer web
Belajar menjadi developer webBelajar menjadi developer web
Belajar menjadi developer webHaswi Haswi
 

Viewers also liked (20)

Panduan biarkan php-mengabadikannya!
Panduan biarkan php-mengabadikannya!Panduan biarkan php-mengabadikannya!
Panduan biarkan php-mengabadikannya!
 
Wawan tutorial-zend-bagian-4
Wawan tutorial-zend-bagian-4Wawan tutorial-zend-bagian-4
Wawan tutorial-zend-bagian-4
 
Use Eclipse Technologies to build a modern embedded development IDE
Use Eclipse Technologies to build a modern embedded development IDEUse Eclipse Technologies to build a modern embedded development IDE
Use Eclipse Technologies to build a modern embedded development IDE
 
Flexter Pulsa Opportunity
Flexter Pulsa OpportunityFlexter Pulsa Opportunity
Flexter Pulsa Opportunity
 
Membangun server intranet dengan linux
Membangun server intranet dengan linuxMembangun server intranet dengan linux
Membangun server intranet dengan linux
 
MMR-based active machine learning for Bio named entity recognition
MMR-based active machine learning for Bio named entity recognitionMMR-based active machine learning for Bio named entity recognition
MMR-based active machine learning for Bio named entity recognition
 
Ebook Internet Sehat
Ebook Internet SehatEbook Internet Sehat
Ebook Internet Sehat
 
Tutorial php
Tutorial phpTutorial php
Tutorial php
 
Penggunaan xampp
Penggunaan xamppPenggunaan xampp
Penggunaan xampp
 
Modul html
Modul htmlModul html
Modul html
 
Belajar php
Belajar phpBelajar php
Belajar php
 
Peer to peer dan client server
Peer to peer dan client serverPeer to peer dan client server
Peer to peer dan client server
 
Desain web 2 kolom
Desain web 2 kolomDesain web 2 kolom
Desain web 2 kolom
 
Masuun ajarmysql5-2
Masuun ajarmysql5-2Masuun ajarmysql5-2
Masuun ajarmysql5-2
 
Query php
Query phpQuery php
Query php
 
Wawan tutorial-zend-bagian-1-3
Wawan tutorial-zend-bagian-1-3Wawan tutorial-zend-bagian-1-3
Wawan tutorial-zend-bagian-1-3
 
Belajar css
Belajar cssBelajar css
Belajar css
 
Pengantar mysql
Pengantar mysqlPengantar mysql
Pengantar mysql
 
Belajar menjadi developer web
Belajar menjadi developer webBelajar menjadi developer web
Belajar menjadi developer web
 
Gambar php
Gambar phpGambar php
Gambar php
 

Similar to Html dan php

Caramembuat website sederhana
Caramembuat website sederhanaCaramembuat website sederhana
Caramembuat website sederhanaHamdani Nurdin
 
Modul 2a html
Modul 2a htmlModul 2a html
Modul 2a html
Siigit Aziz
 
Belajar membuat website
Belajar membuat websiteBelajar membuat website
Belajar membuat websiteNie Andini
 
Dasar HTML
 Dasar HTML Dasar HTML
Belajar membuat website
Belajar membuat websiteBelajar membuat website
Belajar membuat websiteNadya Olivia
 
Tugas2 1300631019
Tugas2 1300631019Tugas2 1300631019
Tugas2 1300631019
setiyo muji
 
Modul html
Modul htmlModul html
Modul html
adealfarisi
 
Desain web 1
Desain web 1Desain web 1
Desain web 1
Luiz Suarez Zikri
 
fdokumen.com_pengantar-html-56a0e352ed109.ppt
fdokumen.com_pengantar-html-56a0e352ed109.pptfdokumen.com_pengantar-html-56a0e352ed109.ppt
fdokumen.com_pengantar-html-56a0e352ed109.ppt
RizkyRamdan2
 
Pengenalan web minggu kedua
Pengenalan web minggu keduaPengenalan web minggu kedua
Pengenalan web minggu keduaWawan Darmawan
 
Tugas laporan aplikasi web nova muhdalifah
Tugas laporan aplikasi web nova muhdalifahTugas laporan aplikasi web nova muhdalifah
Tugas laporan aplikasi web nova muhdalifahzakianadalina97
 
Praktikum_Pengenalan_HTML
Praktikum_Pengenalan_HTML Praktikum_Pengenalan_HTML
Praktikum_Pengenalan_HTML
fikrinurfahmi1
 
Dasar html taufan_riyadi
Dasar html taufan_riyadiDasar html taufan_riyadi
Dasar html taufan_riyadi
dedd_simbolon
 
Praktikum_Pengenalan_HTML oleh STMIK AMIKOM Yogyakarta.ppt
Praktikum_Pengenalan_HTML oleh STMIK AMIKOM Yogyakarta.pptPraktikum_Pengenalan_HTML oleh STMIK AMIKOM Yogyakarta.ppt
Praktikum_Pengenalan_HTML oleh STMIK AMIKOM Yogyakarta.ppt
NansyeDeboraLitaay
 
Andino Maseleno - Modul Web Programming
Andino Maseleno - Modul Web ProgrammingAndino Maseleno - Modul Web Programming
Andino Maseleno - Modul Web ProgrammingAndino Maseleno
 
Modul_belajar Pemrograman bahasa_HTML.doc
Modul_belajar Pemrograman bahasa_HTML.docModul_belajar Pemrograman bahasa_HTML.doc
Modul_belajar Pemrograman bahasa_HTML.doc
FajarSuryosaputro
 

Similar to Html dan php (20)

Caramembuat website sederhana
Caramembuat website sederhanaCaramembuat website sederhana
Caramembuat website sederhana
 
Tutorial html + my sql + php
Tutorial html + my sql + phpTutorial html + my sql + php
Tutorial html + my sql + php
 
Modul 2a html
Modul 2a htmlModul 2a html
Modul 2a html
 
Belajar membuat website
Belajar membuat websiteBelajar membuat website
Belajar membuat website
 
Dasar HTML
 Dasar HTML Dasar HTML
Dasar HTML
 
Belajar membuat website
Belajar membuat websiteBelajar membuat website
Belajar membuat website
 
Buku ajar desain web
Buku ajar desain webBuku ajar desain web
Buku ajar desain web
 
Tugas2 1300631019
Tugas2 1300631019Tugas2 1300631019
Tugas2 1300631019
 
Modul html
Modul htmlModul html
Modul html
 
Modul html
Modul htmlModul html
Modul html
 
Modul html
Modul htmlModul html
Modul html
 
Desain web 1
Desain web 1Desain web 1
Desain web 1
 
fdokumen.com_pengantar-html-56a0e352ed109.ppt
fdokumen.com_pengantar-html-56a0e352ed109.pptfdokumen.com_pengantar-html-56a0e352ed109.ppt
fdokumen.com_pengantar-html-56a0e352ed109.ppt
 
Pengenalan web minggu kedua
Pengenalan web minggu keduaPengenalan web minggu kedua
Pengenalan web minggu kedua
 
Tugas laporan aplikasi web nova muhdalifah
Tugas laporan aplikasi web nova muhdalifahTugas laporan aplikasi web nova muhdalifah
Tugas laporan aplikasi web nova muhdalifah
 
Praktikum_Pengenalan_HTML
Praktikum_Pengenalan_HTML Praktikum_Pengenalan_HTML
Praktikum_Pengenalan_HTML
 
Dasar html taufan_riyadi
Dasar html taufan_riyadiDasar html taufan_riyadi
Dasar html taufan_riyadi
 
Praktikum_Pengenalan_HTML oleh STMIK AMIKOM Yogyakarta.ppt
Praktikum_Pengenalan_HTML oleh STMIK AMIKOM Yogyakarta.pptPraktikum_Pengenalan_HTML oleh STMIK AMIKOM Yogyakarta.ppt
Praktikum_Pengenalan_HTML oleh STMIK AMIKOM Yogyakarta.ppt
 
Andino Maseleno - Modul Web Programming
Andino Maseleno - Modul Web ProgrammingAndino Maseleno - Modul Web Programming
Andino Maseleno - Modul Web Programming
 
Modul_belajar Pemrograman bahasa_HTML.doc
Modul_belajar Pemrograman bahasa_HTML.docModul_belajar Pemrograman bahasa_HTML.doc
Modul_belajar Pemrograman bahasa_HTML.doc
 

More from Haswi Haswi

Wawan tutorial-zend-bagian-5
Wawan tutorial-zend-bagian-5Wawan tutorial-zend-bagian-5
Wawan tutorial-zend-bagian-5
Haswi Haswi
 
Php form register
Php form registerPhp form register
Php form registerHaswi Haswi
 
Php dgn frame work code ignitier
Php dgn frame work code ignitierPhp dgn frame work code ignitier
Php dgn frame work code ignitierHaswi Haswi
 
Php & mysql pundamental
Php & mysql pundamentalPhp & mysql pundamental
Php & mysql pundamentalHaswi Haswi
 
Manipulasi database mysql dgn php
Manipulasi database mysql dgn phpManipulasi database mysql dgn php
Manipulasi database mysql dgn phpHaswi Haswi
 
Buat web dgn php mysql dreamweaver
Buat web dgn php mysql dreamweaverBuat web dgn php mysql dreamweaver
Buat web dgn php mysql dreamweaverHaswi Haswi
 
Buat cms sederhana
Buat cms sederhanaBuat cms sederhana
Buat cms sederhanaHaswi Haswi
 

More from Haswi Haswi (15)

Wawan tutorial-zend-bagian-5
Wawan tutorial-zend-bagian-5Wawan tutorial-zend-bagian-5
Wawan tutorial-zend-bagian-5
 
Tutorial mysql
Tutorial mysqlTutorial mysql
Tutorial mysql
 
Php tutorial-17
Php tutorial-17Php tutorial-17
Php tutorial-17
 
Php gtk
Php gtkPhp gtk
Php gtk
 
Php form register
Php form registerPhp form register
Php form register
 
Php dgn frame work code ignitier
Php dgn frame work code ignitierPhp dgn frame work code ignitier
Php dgn frame work code ignitier
 
Php & mysql pundamental
Php & mysql pundamentalPhp & mysql pundamental
Php & mysql pundamental
 
Manipulasi database mysql dgn php
Manipulasi database mysql dgn phpManipulasi database mysql dgn php
Manipulasi database mysql dgn php
 
Instalshield
InstalshieldInstalshield
Instalshield
 
Html dasar
Html dasarHtml dasar
Html dasar
 
Frameworkoop2
Frameworkoop2Frameworkoop2
Frameworkoop2
 
Ecomerence php
Ecomerence phpEcomerence php
Ecomerence php
 
Cms dgn php
Cms dgn phpCms dgn php
Cms dgn php
 
Buat web dgn php mysql dreamweaver
Buat web dgn php mysql dreamweaverBuat web dgn php mysql dreamweaver
Buat web dgn php mysql dreamweaver
 
Buat cms sederhana
Buat cms sederhanaBuat cms sederhana
Buat cms sederhana
 

Html dan php

  • 1. BAB I BELAJAR HTML HTML (Hypertext Markup Language) adalah bahasa program yang digunakan untuk menulis format dokumen yang dapat digunakan dalam Web. Dengan HTML, teks ASCII (file *.txt) dapat dipoles (di-mark-up) dengan kode-kode tertentu yang disebut tag untuk menjadi dokumen HTML (file *.htm atau *.html). Oleh karena itu, untuk membuat dokumen HTML, anda bisa menggunakan semua program teks editor biasa, mulai dari Notepad hingga MS Word. Untuk mudahnya, kita gunakan program Notepad. Bukalah program Notepad. Bila anda belum tahu caranya, klik Start > Programs > Accessories lalu Notepad. Sekarang ikutilah dengan seksama latihan-latihan berikut satu demi satu. A. PENGENALAN KODE HTML Dalam program Notepad anda, tulislah seperti ini: <HTML> </HTML> Masing-masing baris di atas disebut tag. Tag adalah kode yang digunakan untuk me- mark-up (memoles) teks ASCII menjadi file HTML. Setiap tag diapit dengan tanda kurung runcing. Ada tag pembuka yaitu <HTML> dan ada tag penutup yaitu </HTML> yang ditandai dengan tanda slash (garis miring) di depan awal tulisannya. Tag di atas memberikan faidah bahwa yang akan ditulis diantara kedua tag tersebut adalah isi dari dokumen HTML. Perlu anda ketahui bahwa tag-tag html dapat ditulis dengan huruf besar ataupun huruf kecil. Artinya, penulisan <HTML> atau <html> atau <Html> sama saja hasilnya. Namun perlu selalu diingat bahwa penulisan tag yang salah meskipun hanya satu karakter akan berpengaruh terhadap dokumen HTML anda, bahkan bisa berakibat dokumen HTML anda tidak bisa ditampilkan dalam browser. Isi dari dokumen HTML yang sesungguhnya adalah yang ditulis diantara tag <BODY>. Coba tuliskan: Pemrograman WEB hal 1 dari 27
  • 2. <HTML> <BODY> Tulisan ini akan tampak dalam browser. </BODY> </HTML> Lihatlah hasil karya anda yang pertama! Tulisan ini akan tampak dalam browser. Dalam tag BODY ini bisa kita sisipkan bermacam-macam atribut yang akan berpengaruh terhadap format atau tampilan halaman web secara keseluruhan. Tambahkan atribut BGCOLOR dan TEXT ke dalam tag body sebagai berikut: <HTML> <BODY BGCOLOR="yellow" TEXT="red"> Tulisan ini akan tampak dalam browser. </BODY> </HTML> Maka akan tampaklah hasilnya: Tulisan ini akan tampak dalam browser Penentuan warna pada HTML bisa dengan nama warna (dalam bahasa Inggris) dan bisa pula dengan kode warna. Kode warna ditulis dalam format heksa #rrggbb. Contoh : black #000000 blue #0000FF olive #808000 white #FFFFFF fuchsia #FF00FF green #008000 red #FF0000 gray #808080 teal #008080 yellow #FFFF00 silver #C0C0C0 navy #000080 lime #00FF00 maroon #800000 purple #800080 aqua #00FFFF Dengan demikian, kode HTML untuk contoh di atas bisa ditulis sebagai berikut: Pemrograman WEB hal 2 dari 27
  • 3. <HTML> <BODY BGCOLOR="#FFFF00" TEXT="#FF0000"> Tulisan ini akan tampak dalam browser. </BODY> </HTML> Sekarang bukalah kembali source code tambahkanlah tag-tag berikut ini: <HTML> <HEAD> <TITLE></TITLE> </HEAD> <BODY BGCOLOR="yellow" TEXT="red"> Tulisan ini akan tampak dalam browser. </BODY> </HTML> B. MENGUTAK-ATIK HURUF Tag-tag ini berfungsi untuk mengubah tipe huruf yaitu menebalkan (bold), membuat tulisan miring (italic) atau memberi garis bawah (underline). Buka lagi program Notepad kemudian tuliskan seperti berikut ini: <HTML> <HEAD> <TITLE>Tipe-tipe Teks</TILE> </HEAD> <BODY> Ada tiga macam tipe tulisan yang paling sering digunakan dalam penulisan dokumen apa saja. Ketiga tipe tersebut ialah tulisan tebal, tulisan miring dan tulisan bergaris bawah. Bisa pula dua tipe huruf dipadukan misalnya tulisan tebal dan miring, tulisan tebal dan bergaris bawah atau tulisan miring dan bergaris bawah. Bahkan bisa pula ketiga Pemrograman WEB hal 3 dari 27
  • 4. tipe tulisan tersebut sekaligus bergabung menjadi satu berupa tulisan tebal, miring dan bergaris bawah. </BODY> </HTML> sehingga menjadi seperti ini: Ada tiga macam tipe tulisan yang paling sering digunakan dalam penulisan dokumen apa saja. Ketiga tipe tersebut ialah tulisan tebal, tulisan miringdan tulisan bergaris bawah. Bisa pula dua tipe huruf dipadukan misalnya tulisan tebal dan miring, tulisan tebal dan bergaris bawah atau tulisan miring dan bergaris bawah. Bahkan bisa pula ketiga tipe tulisan tersebut sekaligus bergabung menjadi satu berupa tulisan tebal, miring dan bergaris bawah. C. HEADER ATAU KEPALA TULISAN Untuk menuliskan judul bab atau sub bab. Ada enam tingkatan header mulai dari H1 hingga H6. H1 adalah header yang paling besar dan H6 adalah header yang paling kecil. Coba tulis dalam Notepad anda sebagai berikut: <HTML><BODY> <H1>Header level 1</H1> <H2>Header level 2</H2> <H3>Header level 3</H3> <H4>Header level 4</H4> <H5>Header level 5</H5> <H6>Header level 6</H6> <HTML><BODY> Simpanlah dalam format file HTML kemudian buka dalam browser. Hasilnya akan tampak sebagai berikut: Pemrograman WEB hal 4 dari 27
  • 5. Header level 1 Header level 2 Header level 3 Header level 4 Header level 5 Header level 6 D. BARIS DAN PARAGRAF Cobalah membuat tulisan berikut pada Notepad: <HTML><BODY> Baris pertama Baris kedua Baris ketiga <HTML><BODY> Simpanlah sebagai file HTML kemudian bukalah dalam browser. Bagaimana hasilnya? Ternyata hasilnya hanya seperti ini: Baris pertama Baris kedua Baris ketiga. Kesimpulannya, penekanan tombol Enter tidak menghasilkan baris dalam tampilan browser. Demikianlah sifat penulisan dokumen HTML. Lantas, bagaimana caranya membuat baris? Gunakanlah tag <BR>. Tag ini tidak mempunyai tag penutup. Bukalah source kode file HTML tadi lalu edit seperti berikut: <HTML><BODY> Baris pertama <BR>Baris kedua <BR>Baris ketiga </HTML></BODY> Simpan kemudian lihat hasilnya dengan me-refresh pada browser. Hasilnya kurang lebih akan seperti ini: Pemrograman WEB hal 5 dari 27
  • 6. Baris pertama Baris kedua Baris ketiga Membuat baris kalimat, gampang kan ? Tag <BR> tersebut dapat pula digunakan untuk membuat baris kosong, artinya baris yang tidak mempunyai kalimat apa-apa. Editlah sekali lagi source code latih4.htm menjadi seperti ini: <HTML><BODY> Baris pertama<BR><BR>Baris kedua kosong, dan ini baris ketiga<BR><BR><BR>Baris keempat dan kelima kosong, dan ini baris keenam </BODY></HTML> Simpan lalu refresh sekali lagi maka hasilnya akan seperti ini: Baris pertama Baris kedua kosong, dan ini baris ketiga Baris keempat dan kelima kosong, dan ini baris keenam Di sini kita lihat bahwa tag <BR> yang ditulis dua kali akan menghasilkan dua baris, demikian seterusnya. Setelah pandai membuat baris, sekarang kita akan belajar membuat paragraf. Perhatikanlah contoh tulisan di bawah ini: <HTML><BODY> Paragraf pertama <P>Paragraf kedua <P>Paragraf ketiga </BODY></HTML> Bila dilihat dalam browser, hasilnya akan seperti ini: Paragraf pertama Paragraf kedua Pemrograman WEB hal 6 dari 27
  • 7. Paragraf ketiga BAB II BELAJAR PHP A. MEMBUAT GRAFIK DATA VERTIKAL DENGAN PHP dengan format Graphic Batang Ini cara bikin grafik sederhana tanpa gambar di PHP, dengan bentuk vertikal pertama kita butuh sql data dari database: bikin database, dengan nama: graph_dbase contoh : Code: CREATE TABLE `report_toko` ( `id` int(11) NOT NULL auto_increment, `nama_toko` varchar(255) NOT NULL default '', `laba` int(11) NOT NULL default '0', PRIMARY KEY (`id`) ) ENGINE=MyISAM DEFAULT CHARSET=latin1 AUTO_INCREMENT=5 ; -- -- Dumping data for table `report_toko` -- INSERT INTO `report_toko` VALUES (1, 'Toko A', 100000); INSERT INTO `report_toko` VALUES (2, 'Toko B', 25000); INSERT INTO `report_toko` VALUES (3, 'Toko C', 15000); INSERT INTO `report_toko` VALUES (4, 'Toko D', 5000); Pemrograman WEB hal 7 dari 27
  • 8. bikin koneksi : Code: $varData = array('localhost', 'root', '', 'graph_dbase'); list($host, $user, $pass, $db) = $varData; $con = mysql_connect($host, $user, $pass); mysql_select_db($db, $con) or die('ERROR DBASE CON'); Pemrograman WEB hal 8 dari 27
  • 9. <td valign="bottom" title="Nama Toko: <? echo $row['nama_toko']; ?>"><table border=0 cellpadding=0 cellspacing=2> <tr align=center valign=bottom><td style="background- color:#E0F0FF;"><table border=0 cellspacing=0 cellpadding=0 width=100%> <tr align=center><td height=102 valign=bottom nowrap style="color:black;font-family:Arial, Helvetica;font-size:12px;"><? echo $percent; ?> %</td> </tr><tr align=center valign=bottom><td><table border=0 cellspacing=0 cellpadding=0><tr><td style="border:2px outset white;" bgcolor="#A0C0F0" title="<? echo "Rp. ".number_format($graphLineValue,3,"",".").",-".""; ?>"><div style="width:20px; height:<? echo $graphLineValue; ?>px; line- height:1px; font- size:1px;"></div></td></tr></table></td></tr></table></td></tr><tr align=center> <td style="color:#000000;background-color:#FFFFFF;border:2px groove white;font-family:Arial, Helvetica;font-size:12px;" nowrap>&nbsp;<? echo "Rp. ".number_format($graphLineValue,3,"",".").",-".""; ?> &nbsp;</td> </tr><tr><td bgcolor="#C0E0FF" style="color:#000000;background- color:#C0E0FF;border:2px groove white;font-family:Arial, Helvetica;font- size:12px;text-align:center;">&nbsp;<? echo $row['nama_toko']; ?>&nbsp;</td> </tr></table></td> <? } ?> </tr></table> <div style="font-family:'Courier New'; font-size:24px; font-weight:bold; padding-top:20px; text-align:center;"> <? echo "Total Laba = Rp. ".number_format($ttl[ttlLaba],0,"",".").",-".""; ?> </div> sebagai penentu tinggi dari grafiknya ada pada baris: Code: $graphLineValue = round(($row[laba] * 100) / $most_value); NOTE: round = pembulatan digit angka dibelakang koma sedangkan untuk perhitungan nilai persentasenya ada pada baris: Code: $percent = round(($row[laba] * 100) / $ttl[ttlLaba], 2); jadi kalo di preview di browser, seperti gini: Pemrograman WEB hal 9 dari 27
  • 10. B. MENGIRIM EMAIL MASSAL Pasti anda tidak asing lagi dengan yang namanya email massal. Yah, email massal merupakan metode pengiriman email ke beberapa orang sekaligus.Biasanya Yahoo mail, gmail, dan beberapa web mail lainnya telah menyediakan fitur ini. Bahkan bisa dibilang semuanya pasti sudah menyediakan. Nah, kalau selama ini kita hanya menggunakan fasilitas tersebut, bagaimana jika kita membuatnya sendiri ? Tentu lebih bangga bukan ? Pertama-tama buat databasenya terlebih dahulu. CREATE DATABASE `emailmassal` ; CREATE TABLE `emailmassal`.`email` ( `id` MEDIUMINT( 8 ) NOT NULL AUTO_INCREMENT PRIMARY KEY , `nama` VARCHAR( 50 ) NOT NULL , `email` VARCHAR( 50 ) NOT NULL ) ENGINE = MYISAM INSERT INTO `emailmassal`.`email` ( `id` , `nama` , `email` ) VALUES ( Pemrograman WEB hal 10 dari 27
  • 11. '1', 'ivan', 'ivan@ilmuwebsite.com' ); Notes : dalam contoh ini, email yang terdapat di database Cuma 1. Anda dapat menambah email-email lain jika mau. :) config.php <?php class config { var $host = "localhost"; var $user = "root"; var $pass = ""; var $nama_db = "emailmassal"; // nama database function config() { $this->connect = mysql_connect($this->host,$this->user,$this->pass); $this->select_db = mysql_select_db($this->nama_db); if(!$this->connect) { print "<center>Gagal koneksi dengan PHPmyAdmin.. !<br>Cek kembali nama host, user, dan password anda !</center>"; } } // tutup function config } ?> Index.php <?php include("config.php"); ?> <form name="form1" method="post" action="?kirim=mail"> <p> Untuk : <br> <select name="to" id="to"> <?php class daftar extends config { var $sql = "SELECT * FROM email"; function email () { $this->query = mysql_query($this->sql); print "<option value=semua selected=selected>-Semua email-</option>"; while($this->run_query = mysql_fetch_array($this->query)) { print "<option value=".$this->run_query['email'].">".$this- >run_query['email']."</option>"; } } // end function email } $p = new daftar(); $p->email(); Pemrograman WEB hal 11 dari 27
  • 12. ?> </select> </p> <p>Subject :<br> <input name="pesan" type="text" id="pesan"> </p> <p>Pesan :<br> <textarea name="pesan" cols="40" rows="5" id="pesan"></textarea> </p> <p> <input type="submit" name="Submit" value="Kirim &gt;&gt;"> </p> </form> <?php if($_GET['kirim']) { class email extends daftar { function kirimmail () { $to = $_POST['to']; $subject = $_POST['subject']; $pesan = $_POST['pesan']; $from = "From: email anda"; // isi dengan email anda if($to == "semua") { $this->query = mysql_query($this->sql); while($this->run_query = mysql_fetch_array($this->query)) { mail($to,$subject,$pesan,$from); } } else { mail($to,$subject,$pesan,$from); } } // end function kirimmail } // end class $m = new email(); $m->kirimmail(); } ?> Sedikit Penjelasan kode diatas : Pada class config, kita variabelkan nama host,user,dan pass. Lalu kita konekkan dengan database pada function config. Function config itulah yang dinamakan constructor. Pada index.php, terdapat class daftar extends config, gunanya adalah untuk mengkonekkan dengan database, lalu kita variabelkan $sql yang merupakan perintah query. Lalu perintah query tersebut kita wariskan ke class email. Gunanya adalah agar tidak perlu melakukan penulisan ulang query tersebut. Pemrograman WEB hal 12 dari 27
  • 13. C. LEBIH DALAM MENGENAL ARRAY Untuk merepresentasikan sebuah array, kita ambil contoh : $angka = array("Satu", "Dua", "Tiga"); Dari situ timbul pertanyaan-pertanyaan berkenaan dengan array, salah satunya adalah bagaimana caranya mengambil suatu data yang berada dalam array. Dimisalkan yang akan diambil adalah "Dua". Hal yang perlu dilakukan cukup dengan menggunakan nama variable si array tersebut ditambah dengan urutan keberapakah data yang akan diambil nantinya. Maka ... $angka = array("Satu", "Dua", "Tiga"); $ambilarray = $angka[1]; echo $ambilarray ; Yang ditampilkan dalam browser .. Dua Lalu timbul satu pertanyaan lagi, mengapa untuk mengambil data "Dua" itu berada pada urutan ke 1?. Sebagaimana ditampilkan dalam source code $angka[1];. Yup, ini terjadi dikarenakan array itu bermula dari angka 0. Sehingga : "Satu" itu berada pada urutan ke 0 "Dua" itu berada pada urutan ke 1 , sedangkan "Tiga" itu berada pada urutan ke 2 Hmmm... jika ada variabel dalam variabel. Bagaimana dengan array dalam array ? Pastinya inilah yang dinamakan array multidimensi. Penulis tidak akan menjelaskan mengenai array 2 dimensi atau lebih dikarenakan hal ini amat jarang sekali dipakai. Contohnya ... Pemrograman WEB hal 13 dari 27
  • 14. $angka = array("Satu", array("Dua","Tiga") , "Empat"); Untuk mengambil nilai dua yang terdapat dalam array tersebut. Cukup dengan memanggil nama variabel arraynya seperti ini : $angka = array("Satu", array("Dua","Tiga") , "Empat"); $ambilarray = $angka[1][0]; echo $ambilarray ; Hasil di browser adalah ... Dua Begitu juga dengan bentuk array yang lain. $angka = array("Satu", "Dua" => "Satu di tambah Satu", "Tiga"); Perhatikan baris "Dua" => "Satu ditambah Satu" ini berarti variabel "Dua" memiliki nilai "Satu ditambah satu", sehingga untuk mengambil nilai yang berada dalam variabel Dua ... $angka = array("Satu", "Dua" => "Satu di tambah Satu", "Tiga"); $nilaidua = $angka['Dua']; echo $nilaidua ; Maka yang akan ditampilkan oleh browser adalah ... Satu ditambah Satu Yup, array memiliki banyak sekali peran dalam web development. Penulis sendiri menggunakan array dalam manajemen artikel., searching database, dan banyak lagi contoh yang lain dimana pentingnya peranan seorang Array. :D~~ Dari situ penulis akan memberikan sebuah contoh dari implementasi array. Untuk implementasi kali ini penulis akan menggunakan array sebagai database penyimpanan kata-kata yang nantinya akan diblokir. Blokir kata dalam komentar dengan Array Sebelumnya buat database komentarnya terlebih dahulu. create database komentar; use komentar; create table komentar( id int(5) primary key auto_increment, penulis varchar(50), email varchar(30), isikomentar text); insert into komentar values('','Al-k','alkemail@gmail.com','Pada dasarnya Ryuzaki itu tidak ganteng'); insert into komentar values('','Al-k','alkemail@gmail.com','Pada dasarnya Ryuzaki manusia juga'); insert into komentar values('','Al-k','alkemail@gmail.com','Pada dasarnya Ryuzaki adalah manusia yang tidak keren huehueue'); Kemudian file config.php, file ini yang menghubungkan antara database dengan webserver apache ... Pemrograman WEB hal 14 dari 27
  • 15. <?php $user = "root" ; $passwd = ""; $host = "localhost" ; $koneksi = mysql_connect($host, $user, $passwd) ; mysql_select_db("komentar",$koneksi) or die ("Database tidak bisa dikoneksi"); ?> Selanjutnya file intinya, array.php : <?php require_once "config.php"; $perintah = "select * from komentar order by id desc"; $jalankanperintahnya = mysql_query($perintah); $katayangdiblokir = "keren ganteng"; $potongkata = explode(" ", $katayangdiblokir); $jumlaharray = count($potongkata); if ($_REQUEST['isikomentar'] == "iya" ) { if (ISSET($_POST['isinya'])) { $isikomentarnyaadalah = $_POST['isinya']; $namanya = $_POST['namanya']; $emailnya = $_POST['emailnya']; mysql_query("insert into komentar values ('','$namanya','$emailnya','$isikomentarnyaadalah')"); header ("location: array.php"); } } echo "<b>Komentar :</b><br><hr>"; while ($hasil = mysql_fetch_array($jalankanperintahnya)) { $nama = $hasil['penulis']; $email = $hasil['email']; $komentar = strtolower($hasil['isikomentar']); $isikomentar = explode(" ",$komentar); $arraykomentar = count($isikomentar)."<br>"; $total_loop = $arraykomentar + $jumlaharray ; for ( $i = 0; $i < $jumlaharray ; $i++) Pemrograman WEB hal 15 dari 27
  • 16. { if(in_array($potongkata[$i],$isikomentar)) { $komentar = "<font color=red><b>no comment</b></font>" ; } } echo "Nama : $nama <br>"; echo "Email : $email <br>"; echo "Komentar : <br>$komentar <hr>"; } ?> <html><body> <b>Isi Komentar :</b> <table border=0> <form method = 'POST' action = <?php echo "$_SERVER[PHP_SELF]?isikomentar=iya" ; ?> > <tr><td>Nama:</td><td><input type=text name=namanya></td></tr> <tr><td>Email:</td><td><input type=text name=emailnya></td></tr> <tr><td valign=top>Isinya:</td><td><textarea rows=6 cols=40 name=isinya></textarea></td></tr> <tr><td></td><td><input type=submit name=submit value=Kirim style='color: #000000; border: 1px solid #000000; background-color: #DFDFDF'></td></tr> </form></table> </body> </html> Dilangsungkan ke script intinya saja. Perhatikan barisan kalimat ... require_once "config.php"; $perintah = "select * from komentar order by id desc"; $jalankanperintahnya = mysql_query($perintah); :D cukup familiar? yups, dengan memanfaatkan file koneksi antara webserver dengan mysql servernya, yakni file config.php. Lalu tampilkan semua isi dari tabel komentar dan lakukan sorting berdasarkan id yang terakhir kali disimpan dalam database. Kemudian ... $katayangdiblokir = "keren ganteng"; $potongkata = explode(" ", $katayangdiblokir); $jumlaharray = count($potongkata); Database kata yang nantinya akan diblokir disisipkan kedalam variabel $katayangdiblokir. Lalu muncul kembali pertanyaan, mengapa tidak berbentuk seperti ini : Pemrograman WEB hal 16 dari 27
  • 17. $katayangdiblokir = array("keren","ganteng"); Karena penulis akan mencoba mengenalkan penggunaan fungsi explode. Explode berfungsi untuk memisahkan suatu string menjadi kumpulan variabel-variabel. explode() yang digunakan dalam implementasi kali ini berfungsi untuk membuat array dengan memisahkan variabel menggunakan spasi. kumpulkan databasenya ... $katayangdiblokir = "keren ganteng"; kemudian pisahkan lalu masukkan ke dalam array $potongkata $potongkata = explode(" ", $katayangdiblokir); Sehingga hasilnya nanti sama dengan $katayangdiblokir = array("keren","ganteng"); Kemudian jumlahkan variabel yang berada dalam array $jumlaharray = count($potongkata); Lalu perhatikan susunan kalimat ini ... if ($_REQUEST['isikomentar'] == "iya" ) { if (ISSET($_POST['isinya'])) { $isikomentarnyaadalah = $_POST['isinya']; $namanya = $_POST['namanya']; $emailnya = $_POST['emailnya']; mysql_query("insert into komentar values ('','$namanya','$emailnya','$isikomentarnyaadalah')"); header ("location: array.php"); } } Sebelum beralih lebih lanjut, coba kita perhatikan form yang dihasilkan dari halaman array.php <form method = 'POST' action = <?php echo "$_SERVER[PHP_SELF]?isikomentar=iya" ; ?> > <tr><td>Nama:</td><td><input type=text name=namanya></td></tr> <tr><td>Email:</td><td><input type=text name=emailnya></td></tr> <tr><td valign=top>Isinya:</td><td><textarea rows=6 cols=40 name=isinya></textarea></td></tr> <tr><td></td><td><input type=submit name=submit value=Kirim style='color: #000000; border: 1px solid #000000; background-color: #DFDFDF'></td></tr> </form> Yang dihasilkan oleh form ini adalah : variabel $ POST['namanya'] yang diambil dari text box "namanya" Pemrograman WEB hal 17 dari 27
  • 18. variabel $_POST['emailnya'] yang diambil dari text box "emailnya" kemudian variabel $_POST['isinya'] yang diambil dari text area dan variabel $_REQUEST['isikomentar'] yang dihasilkan dari action si form, dalam hal ini <form method = 'POST' action = <?php echo "$_SERVER[PHP_SELF]?isikomentar=iya" ; ?> > Kita kembali ke baris ini if ($_REQUEST['isikomentar'] == "iya" ) { if (ISSET($_POST['isinya'])) { $isikomentarnyaadalah = $_POST['isinya']; $namanya = $_POST['namanya']; $emailnya = $_POST['emailnya']; mysql_query("insert into komentar values ('','$namanya','$emailnya','$isikomentarnyaadalah')"); header ("location: array.php"); } } ketika user telah selesai mengisi komentar if ($_REQUEST['isikomentar'] == "iya" ) dan apabila user telah mempost ( me-submit ) komentarnya if (ISSET($_POST['isinya'])) maka kenalkan variabel global $_POST['isinya'] sebagai $isikomentarnyaadalah, kemudian jadikan $_POST['emailnya'] sebagai variabel $emailnya. $isikomentarnyaadalah = $_POST['isinya']; $namanya = $_POST['namanya']; $emailnya = $_POST['emailnya']; kemudian masukkan kedalam database mysql_query("insert into komentar values ('','$namanya','$emailnya','$isikomentarnyaadalah')"); setelah selesai, lakukan redirect ke halaman array.php header ("location: array.php"); sehingga user langsung dapat melihat komentar yang baru saja dimasukkan. Bisa diperhatikan juga kalimat ini while ($hasil = mysql_fetch_array($jalankanperintahnya)) { $nama = $hasil['penulis']; $email = $hasil['email']; Pemrograman WEB hal 18 dari 27
  • 19. $komentar = strtolower($hasil['isikomentar']); $isikomentar = explode(" ",$komentar); $arraykomentar = count($isikomentar)."<br>"; $total_loop = $arraykomentar + $jumlaharray ; for ( $i = 0; $i < $jumlaharray ; $i++) { if(in_array($potongkata[$i],$isikomentar)) { $komentar = "<font color=red><b>no comment</b></font>" ; } } echo "Nama : $nama <br>"; echo "Email : $email <br>"; echo "Komentar : <br>$komentar <hr>"; } Penulis ambil kalimat intinya : Selama dalam database masih terdapat record, ambil nilainya dan sisipkan kedalam variabel $hasil while ($hasil = mysql_fetch_array($jalankanperintahnya)) lakukan change case pada isikomentar dalam database menjadi huruf kecil semua ... $komentar = strtolower($hasil['isikomentar']); jadikan array dengan memanfaatkan spasi yang ada $isikomentar = explode(" ",$komentar); Berapakah jumlah variabel yang terdapat dalam array ? $arraykomentar = count($isikomentar)."<br>"; Sebuah baris lagi yang perlu dipahami ... $total_loop = $arraykomentar + $jumlaharray ; ini terjadi dikarenakan adakalanya saat-saat dimana komentar yang dimasukkan oleh user lebih sedikit dari database kata yang akan diblokir, dan seringkali database kata yang diblokir itu lebih sedikit jumlah arraynya dibandingkan komentar yang dimasukkan. Sehingga perlu dijumlahkan antara jumlah array pada komentar yang diblokir dengan jumlah array dari komentar yang dimasukkan. Ini dia kalimat intinya ... for ( $i = 0; $i < $jumlaharray ; $i++) { if(in_array($potongkata[$i],$isikomentar)) { Pemrograman WEB hal 19 dari 27
  • 20. $komentar = "<font color=red><b>no comment</b></font>" ; } } lakukan pengulangan sebanyak $jumlaharray kesemuanya. for ( $i = 0; $i < $jumlaharray ; $i++) jika didalam isi komentar terdapat kata-kata yang diblokir. if(in_array($potongkata[$i],$isikomentar)) maka tampilkan komentar yang ada menjadi no comment $komentar = "<font color=red><b>no comment</b></font>" ; selain itu tampilkan seperti adanya. Contoh lain penggunaan fungsi in_array( ) : $buah = array ("Mangga", "Jambu", "Pepaya", "Pisang"); if (in_array ("Jambu", $buah)) { print "Ada buah Jambu euyyy ... "; } Jika terdapat Jambu dalam array buah if (in_array ("Jambu", $buah)) maka tampilkan Ada buah Jambu euyyy ... print "Ada buah Jambu euyyy ... "; Dari situ mungkin anda memiliki ide-ide brilian guna diimplementasikan dalam web anda tentunya. Jadi, silahkan kembangkan imajinasi anda dan tuangkan dalam cangkir source code. :- q D. MENANGKAP VARIABEL POST Halo semua, jumpa lagi dengan Phii. Kali ini, Phii akan membahas bagiamana menangkap variabel post pada form buku tamu sederhana agar ketika pengunjung memasukkan data dan ada beberapa data yang tidak valid, pengunjung web kita tidak perlu mengisi ulang dari awal lagi. Bingung? Kira2 begini, misal pengunjung web kita sudah menulis panjang lebar untuk data pesan, tapi kelupaan nulis data email, padahal data email wajib ditulis. Nah, ketika dikirim, proses akan dibatalkan karana ada data yang tidak lengkap dan akan menampilkan kembali form buku tamu yang kosong. Pemrograman WEB hal 20 dari 27
  • 21. Kasihan kan kalo harus nulis lagi, bisa jadi malah pengunjung web kita males n ga jadi nulis buku tamu. sudah cukup jelas? Oke...langsung kita bahas. Mari kita siapkan file2-nya : database create database db_gb ; use db_gb; create table guestbook (id int unsigned not null primary key auto_increment, nama varchar(50) not null, email varchar(100) not null, pesan text not null); file koneksi.php <?php $host="localhost"; $uname="root"; $pass=""; $db="db_gb"; $koneksi=mysql_connect($host,$uname,$pass); mysql_select_db($db,$koneksi); ?> file lihatgb.php <?php $queryGb = mysql_query("select * from guestbook"); $jmlGb = mysql_num_rows($queryGb); if($jmlGb==0) { echo"Data buku tamu masih kosong"; } else { $queryTampil=mysql_query("select * from guestbook order by id desc"); echo"<p>DATA BUKU TAMU<p>"; while($dataGb=mysql_fetch_row($queryTampil)) { echo"<b>$dataGb[1]</b><br>"; echo"".wordwrap($dataGb[3],85,"<br>",1)." "; echo"<hr width=50% align=left>"; } } ?> file gb.php <?php include'koneksi.php'; if(isset($_POST['kirim']) && ($_POST['kirim']=='Kirim')) { $nama=trim(strip_tags($_POST['nama'])); Pemrograman WEB hal 21 dari 27
  • 22. $email=trim(strip_tags($_POST['email'])); $pesan=trim(strip_tags($_POST['pesan'])); //validasi form if($nama=='') $error1= "<font color=red>&nbsp;&nbsp;&laquo; Nama belum diisi</font><br>"; if($email=='') $error2= "<font color=red>&nbsp;&nbsp;&laquo; Email belum diisi</font><br>"; if($pesan=='') $error3= "<font color=red>&nbsp;&nbsp;&laquo; Pesan belum diisi</font><br>"; if($email!='') { $polaemail = "^.+@.+..+$"; //nyontek tutorial validasi email yg ditulis b_scorpio :) $cek=eregi($polaemail,$email); if(!$cek) { $error4="<font color=red>&nbsp;&nbsp;&laquo; Pola email salah</font>"; } } //jika semua data valid if(($nama!='') && ($email!='') && $cek && ($pesan!='')) { //simpan data buku tamu $queryAddGb=mysql_query("insert into guestbook values(NULL,'$nama','$email','$pesan')"); if($queryAddGb) //jika query simpan buku tamu berhasil Pemrograman WEB hal 22 dari 27
  • 23. { //tampilkan pesan berhasil echo"<font color=red><b>Guestbook berhasil disimpan</b></font>"; echo"<meta http-equiv="refresh" content="2; url=./gb.php">"; exit; } else //jika query gagal { //tampilkan pesan gagal echo"<font color=red><b>Data gagal disimpan</b></font>"; echo"<meta http-equiv="refresh" content="10; url=./gb.html">"; exit; } } if(isset($error1) || isset($error2) || isset($error3) || isset($error4)) { //tangkap variabel post untuk menampilkan kembali data yang sudah diisi pada form $ex_nama=trim(strip_tags($_POST['nama'])); $ex_email=trim(strip_tags($_POST['email'])); $ex_pesan=trim(strip_tags($_POST['pesan'])); } } include'lihatgb.php'; //semua value variabel diset kosong jika belum diisi if(empty($ex_nama)) { $ex_nama=''; } if(empty($ex_email)) { Pemrograman WEB hal 23 dari 27
  • 24. $ex_email=''; } if(empty($ex_pesan)) { $ex_pesan=''; } ?> <p><br><br>FORM BUKU TAMU <form method="post" action=""> Nama *<br><input type="text" name="nama" size="34" value="<?php echo $ex_nama;?>"><?php if(isset($error1)) //jika data nama kosong { echo $error1; //tampilkan pesan di samping textbox nama } ?><br> Email *<br><input type="text" name="email" size="34" value="<?php echo $ex_email;?>"><?php if(isset($error2)) //jika data email kosong { echo $error2; //tampilkan pesan d isamping textbox email } if(isset($error4)) //jika data email tidak sesuai dengan pola email { echo $error4; //tampilkan pesan di samping textbox email } ?><br> Pesan *<br><textarea name="pesan" rows="8" cols="40"><?php echo $ex_pesan;?></textarea><?php if(isset($error3)) //jika data pesan kosong { echo $error3; //tampilkan pesan di samping textarea pesan } Pemrograman WEB hal 24 dari 27
  • 25. ?> <br>*) Wajib diisi <br> <input type="reset" value="Reset" name="kosongkan"> <input type="submit" value="Kirim" name="kirim"> </form> Mari dicoba : Jalankan file gb.php Coba isi beberapa data, misal : data nama : Bolang data pesan: Aku senang sekali mengunjungi ilmuwebsite.com, karena disini aku bisa belajar web programming. Untuk para staf, cayoo...jangan pernah bosan berbagi ilmu, agar semakin banyak anak2 bangsa ini yang pinter web programming. Selalu ditunggu artikel2 barunya, n....tetap semangatttttt!!! Lalu klik Kirim Apa yang terjadi? Si Bolang ini lupa ga masukin data email. Alhasil proses simpan buku tamu ditolak karana data email wajib diisi. Disinilah topik bahasan artikel ini berguna. Yuppp....karena variabel yang sudah diisi telah ditangkap pak polisi, eh...salah, maksudnya ditangkap oleh variabel ex_nama dan ex_pesan, maka ketika form buku tamu ditampilkan kembali, data2 yang sudah diisi tidak kosong tapi sudah terisi oleh data yg sebelumnya sudah dimasukkan. Jadi Si Bolang tinggal mengisi data email saja. Pemrograman WEB hal 25 dari 27
  • 26. Coba masukkan data email : bolang@yahoo, lalu klik Kirim Aduh..aduhhhh...Si Bolang ini orangnya kurang teliti sama kaya Phii. Jadi ketika disimpan, lagi2 proses ditolak, karena pola email tidak sesuai dengan pola yang sudah ditentukan. Kali ini variabel yang ditangkap tidak hanya nama dan pesan, tapi juga email. Form yang ditampilkan akan menampilkan data2 yang sudah dimasukkan sebelumnya. Pemrograman WEB hal 26 dari 27
  • 27. Kali ini Si Bolang tidak akan melakukan kesalahan input lagi. Si Bolang menambahkan .com pada data email, sehingga data email menjadi bolang@yahoo.com. Lalu klik Kirim. Horeeee....Bolang sukses mengisi form buku tamu. Pemrograman WEB hal 27 dari 27