Contoh Aplikasi Login Form

Posted on Juli 20th, 2008 in PHP by jymmyfalsq

Melanjutkan artikel yang kemarin, yang membahas tentang session. Aplikasi ini akan memanfaatkan teknologi session untuk menyimpan data user yang login dan koneksi database. Database yang digunakan adalah langganan saya yaitu MySQL, teknis koneksinya bagaimana ? baca dulu disini. Sedang yang belum mengetahui tentang session, baca disini. Aplikasi login form ini digunakan untuk membuat sistem login keanggotaan pada sebuah website, dimana data-data membernya akan disimpan dalam sebuah table database. Untuk validasi login tidak ada, artinya tidak ada validasi di sisi client, validasi hanya ada pada server, menggunakan PHP. Aplikasi ini hanya merupakan contoh pemanfaatan database dan session. Bagaimana cara membuatnya ?

Pertama, akan dibuat HTML form, yaitu form yang digunakan untuk login. Beri nama dengan form.html (sebenarnya terserah sih, saya hanya menyarankan saja). Berikut kode yang digunakan untuk membangun form sederhana.

<form action=”proseslogin.php” method=”post”>

    Username

<input name="user" type="text" />

Password

<input name="password" type="password" />

<input value="Login" type="submit" />

</form>

Membuat Polling di PHP

Posted on Juni 27th, 2008 in PHP by jymmyfalsq

Sebenarnya aplikasi polling berbasis web sudah banyak disediakan secara gratis. Aplikasi ini menjadi semacam widget yang bisa dilepas dan dipasang secara mudah, bahkan tanpa pengetahuan bahasa pemrograman yang detail. Tetapi, ada baiknya untuk mengetahui cara pembuatan aplikasi polling berbasis web. Aplikasi polling ini menggunakan PHP sebagai bahasa utamanya dan MySQl sebagai database yang berguna untuk menampung data-data poling. Berikut ini cara membuatnya.

Yang pertama dilakukan adalah berdoa dan membuat tabel. Berikut ini kode SQL yang digunakan untuk membangun tabel. Nama tabel dan databasenya terserah anda, nanti harus disesuaikan ketika menghubungkan PHP dan MySQL.

 
CREATE TABLE tb_poling (
  id int(3) NOT NULL AUTO_INCREMENT,
  nama varchar(40) ,
  rating tinyint(3) ,
  PRIMARY KEY (id)
);

Setelah itu, sekarang buat sebuah script yang digunakan untuk menampilkan dan menghandel proses masukan poling. Berikut kode PHP yang digunakan

<?php
 /*koneksi ke database dulu*/
 mysql_connect("localhost","root","");
 mysql_select_db("poling");

 /*
  buat tampilan poling, datanya diambil dari database lho
  saya membuat sebuah fungsi untuk menampilkan poling, agar nantinya bisa digunakan ulang.
  ini hanya masalah cara menampilkan saja kok
  */
 function show(){
         $cmd="select * from tb_poling";
         $exe=mysql_query($cmd);
         echo "<form action='' method='post'>";
         while ($data=mysql_fetch_array($exe)){
          echo "<input type='radio' name='pilihan' value='$data[id]' />$data[nama](Nilai :$data[rating])<br />";
         }
         echo "<input type='submit' name='submit' value='Vote for me' />";
         echo "</form>";
 }
 /*
  menampilkan tampilan form di sini
 */
 if (!isset($_POST["submit"])){
  show();
 }

 if (isset($_POST["submit"])){
  $cmd="update tb_poling set rating=rating+1 where id=$_POST[pilihan]";
  $exe=mysql_query($cmd);
  if ($exe){
   echo "terimakasih telah mengikuti poling";
  }
  else{
   echo "Maafkan, ada kesalahan teknis";
  }
  show();
 }
 ?>

Begitulah cara membuat aplikasi poling, mudah kan? Anda bisa memodifikasi poling ini agar menjadi lebih baik lagi, misalkan dengan menampilkan grafik berupa bar untuk menunjukkan nilainya. Yang saya tuliskan diatas hanya dasar, inti dari sebuah aplikasi poling, tentu saja tidak ada sistem keamananya. Jika pilkada dilakukan melalui poling web, sama sekali tidak disarankan menggunakan aplikasi ini.

Sumber atau Tutorial Yang Lainnya = Klik Disini

Membuat Buku tamu

Posted on Juni 7th, 2008 in PHP by jymmyfalsq

Buku tamu ini terdiri dari 2 file, file pertama bernama guestbook.php3 yang merupakan file utama. File kedua bernama entry.dat yang
digunakan untuk menyimpan isi buku tamu.

<html>
<head>
<TITLE>Contoh Guestbook </TITLE>
<STYLE>
FONT,body,td,table {font-family : verdana;font-size : 11px;}
b {
font-family : Arial;
font-weight : bold;
}
a,a:hover,.link{font-family: verdana;font-size: 8pt;font-color: 66666;}
</STYLE>
</head>
<body bgcolor=”#FFFFFF” leftmargin=”0″ topmargin=”30″ marginwidth=”0″ marginheight=”0″>
<b><center> BUKU TAMU <br></b>
dari www.klik-kanan.com</center>

<table width=”100%” border=”0″ cellspacing=”0″ cellpadding=”0″>
<tr><td height=”50″></td> </tr>
<tr>
<td><form action=”<?PHP_SELF?>” method=”post”>
<table width=”498″ border=”0″ cellspacing=”0″ cellpadding=”0″ align=”center”>
<tr> <td>Nama</td> <td> <input name=”name” size=30 value=””> </td> </tr>
<tr> <td>Email</td> <td> <input name=”email” size=30 value=””> </td> </tr>
<tr> <td>Homepage</td> <td> <input name=”url” size=30 value=”http://”> </td> </tr>
<tr> <td valign=”top”>Komentar</td> <td> <textarea name=”message” cols=50 rows=10 wrap=soft></textarea> </td> </tr>
<tr> <td valign=”top”> <input type=”hidden” value=”ok” name=”send_status”> </td>
<td>
<input type=”submit” value=”Kirim” name=”submit”>
<input type=”submit” value=”Lihat” name=”view_guestbook”>
</td>
</tr>
</table></form>
</td>
</tr>
<tr>
<td> <center>

<?
if ($name == “” || $email == “” || $message == “”)
{
for ($i=0; $i<3; $i++)
{
echo “.”;
sleep(1);
flush();
}
$filesize = filesize(”entry.dat”);
$file = fopen(”entry.dat”,”r”);
$buffer = fread($file,$filesize);
echo “$buffer”;
fclose($file);
}
else if ($send_status == “ok”)
{
$filesize = filesize(”entry.dat”);
$file = fopen(”entry.dat”,”r”);
$buffer = fread($file,$filesize);
fclose($file);

$today = getdate();
$bulan = $today[month];
$mday = $today[mday];
$tahun = $today[year];
$tanggal = “$bulan $mday, $tahun”;

$file = fopen(”entry.dat”,”w”);

$parsed_message = strip_tags($message,”<a>,<i>”);
$parsed_message_br = str_replace(”\n”,”<br>”,$parsed_message);
$today = date( “Ymd”, time() );
$message_table =”<TABLE BORDER=\”0\” CELLPADDING=\”1\” bgcolor=EEEEEE width=\”500\”><TD colspan=\”2\”></TD></TR> <TR><TD align=\”right\” colspan=\”2\”><i>$tanggal</i></TD></TR> <TR><TR><TD width=\”30%\”><B>Nama :</B></TD> <TD>$name</TD></TR> <TR><TD><B>Email :</B></TD> <TD><A href=\”mailto:$email\”>$email</A></TD></TR> <TR><TD><B>Homepage :</B></TD> <TD><A href=\”$url\” target=\”_blank\”>$url</A></TD></TR> <TR><TD valign=\”top\” colspan=\”1\”><B>Komentar :</B></TD><TD>$parsed_message_br</TD></TR> <TR><TD colspan=\”2\”></TD></TR></TABLE>”;

fputs($file,”$message_table \n $buffer”);
fclose($file);
}
else if ($view_guestbook == “View Guestbook”){

$filesize = filesize(”entry.dat”);
$file = fopen(”entry.dat”,”r”);
$buffer = fread($file,$filesize);
echo “$buffer”;
fclose($file);

}
?></center>
</td>
</tr>
</tr>

</table>
<p> </p>
</body>
</html>

Up-down Image Slideshow Script

Posted on Juni 7th, 2008 in PHP by jymmyfalsq

<script language=”JavaScript1.2″>

/*
Up down slideshow Script
By Dynamic Drive  www.dynamicdrive.com)
For full source code, terms of use, and 100’s more scripts, visit http://www.dynamicdrive.com
*/

///////configure the below four variables to change the style of the slider///////
//set the scrollerwidth and scrollerheight to the width/height of the LARGEST image in your slideshow!
var scrollerwidth=’103px’
var scrollerheight=’106px’
//3000 miliseconds=3 seconds
var pausebetweenimages=3000

//configure the below variable to change the images used in the slideshow. If you wish the images to be clickable, simply wrap the images with the appropriate <a> tag
var slideimages=new Array()
slideimages[0]=’<a href=”http://www.cnn.com”><img src=”PE01805A.gif” border=”0″></a>’
slideimages[1]=’<img src=”PE01803A.gif”>’
slideimages[2]=’<img src=”TN00411A.gif”>’
slideimages[3]=’<img src=”PE02054A.gif”>’
slideimages[4]=’<img src=”cake.gif”>’
//extend this list

///////Do not edit pass this line///////////////////////

var ie=document.all
var dom=document.getElementById

if (slideimages.length>2)
i=2
else
i=0

function move1(whichlayer){
tlayer=eval(whichlayer)
if (tlayer.top>0&&tlayer.top<=5){
tlayer.top=0
setTimeout(”move1(tlayer)”,pausebetweenimages)
setTimeout(”move2(document.main.document.second)”,pausebetweenimages)
return
}
if (tlayer.top>=tlayer.document.height*-1){
tlayer.top-=5
setTimeout(”move1(tlayer)”,50)
}
else{
tlayer.top=parseInt(scrollerheight)
tlayer.document.write(slideimages[i])
tlayer.document.close()
if (i==slideimages.length-1)
i=0
else
i++
}
}

function move2(whichlayer){
tlayer2=eval(whichlayer)
if (tlayer2.top>0&&tlayer2.top<=5){
tlayer2.top=0
setTimeout(”move2(tlayer2)”,pausebetweenimages)
setTimeout(”move1(document.main.document.first)”,pausebetweenimages)
return
}
if (tlayer2.top>=tlayer2.document.height*-1){
tlayer2.top-=5
setTimeout(”move2(tlayer2)”,50)
}
else{
tlayer2.top=parseInt(scrollerheight)
tlayer2.document.write(slideimages[i])
tlayer2.document.close()
if (i==slideimages.length-1)
i=0
else
i++
}
}

function move3(whichdiv){
tdiv=eval(whichdiv)
if (parseInt(tdiv.style.top)>0&&parseInt(tdiv.style.top)<=5){
tdiv.style.top=0+”px”
setTimeout(”move3(tdiv)”,pausebetweenimages)
setTimeout(”move4(second2_obj)”,pausebetweenimages)
return
}
if (parseInt(tdiv.style.top)>=tdiv.offsetHeight*-1){
tdiv.style.top=parseInt(tdiv.style.top)-5+”px”
setTimeout(”move3(tdiv)”,50)
}
else{
tdiv.style.top=scrollerheight
tdiv.innerHTML=slideimages[i]
if (i==slideimages.length-1)
i=0
else
i++
}
}

function move4(whichdiv){
tdiv2=eval(whichdiv)
if (parseInt(tdiv2.style.top)>0&&parseInt(tdiv2.style.top)<=5){
tdiv2.style.top=0+”px”
setTimeout(”move4(tdiv2)”,pausebetweenimages)
setTimeout(”move3(first2_obj)”,pausebetweenimages)
return
}
if (parseInt(tdiv2.style.top)>=tdiv2.offsetHeight*-1){
tdiv2.style.top=parseInt(tdiv2.style.top)-5+”px”
setTimeout(”move4(second2_obj)”,50)
}
else{
tdiv2.style.top=scrollerheight
tdiv2.innerHTML=slideimages[i]
if (i==slideimages.length-1)
i=0
else
i++
}
}

function startscroll(){
if (ie||dom){
first2_obj=ie? first2 : document.getElementById(”first2″)
second2_obj=ie? second2 : document.getElementById(”second2″)
move3(first2_obj)
second2_obj.style.top=scrollerheight
second2_obj.style.visibility=’visible’
}
else if (document.layers){
document.main.visibility=’show’
move1(document.main.document.first)
document.main.document.second.top=parseInt(scrollerheight)+5
document.main.document.second.visibility=’show’
}
}

window.onload=startscroll

</script>

<ilayer id=”main” width=&{scrollerwidth}; height=&{scrollerheight}; visibility=hide>
<layer id=”first” left=0 top=1 width=&{scrollerwidth};>
<script language=”JavaScript1.2″>
if (document.layers)
document.write(slideimages[0])
</script>
</layer>
<layer id=”second” left=0 top=0 width=&{scrollerwidth}; visibility=hide>
<script language=”JavaScript1.2″>
if (document.layers)
document.write(slideimages[dyndetermine=(slideimages.length==1)? 0 : 1])
</script>
</layer>
</ilayer>

<script language=”JavaScript1.2″>
if (ie||dom){
document.writeln(’<div id=”main2″ style=”position:relative;width:’+scrollerwidth+’;height:’+scrollerheight+’;overflow:hidden;”>’)
document.writeln(’<div style=”position:absolute;width:’+scrollerwidth+’;height:’+scrollerheight+’;clip:rect(0 ‘+scrollerwidth+’ ‘+scrollerheight+’ 0);left:0px;top:0px”>’)
document.writeln(’<div id=”first2″ style=”position:absolute;width:’+scrollerwidth+’;left:0px;top:1px;”>’)
document.write(slideimages[0])
document.writeln(’</div>’)
document.writeln(’<div id=”second2″ style=”position:absolute;width:’+scrollerwidth+’;left:0px;top:0px;visibility:hidden”>’)
document.write(slideimages[dyndetermine=(slideimages.length==1)? 0 : 1])
document.writeln(’</div>’)
document.writeln(’</div>’)
document.writeln(’</div>’)
}
</script>

<p align=”center”><font face=”Arial” size=”-2″>Free DHTML scripts provided by<br>
<a href=”http://dynamicdrive.com”>Dynamic Drive</a></font></p>

Bikin Slide Show pada Website

Posted on Juni 7th, 2008 in PHP by jymmyfalsq

<script language=”JavaScript1.2″>

/*
Up down slideshow Script
By Dynamic Drive  www.dynamicdrive.com)
For full source code, terms of use, and 100’s more scripts, visit http://www.dynamicdrive.com
*/

///////configure the below four variables to change the style of the slider///////
//set the scrollerwidth and scrollerheight to the width/height of the LARGEST image in your slideshow!
var scrollerwidth=’103px’
var scrollerheight=’106px’
//3000 miliseconds=3 seconds
var pausebetweenimages=3000

//configure the below variable to change the images used in the slideshow. If you wish the images to be clickable, simply wrap the images with the appropriate <a> tag
var slideimages=new Array()
slideimages[0]=’<a href=”http://www.cnn.com”><img src=”PE01805A.gif” border=”0″></a>’
slideimages[1]=’<img src=”PE01803A.gif”>’
slideimages[2]=’<img src=”TN00411A.gif”>’
slideimages[3]=’<img src=”PE02054A.gif”>’
slideimages[4]=’<img src=”cake.gif”>’
//extend this list

///////Do not edit pass this line///////////////////////

var ie=document.all
var dom=document.getElementById

if (slideimages.length>2)
i=2
else
i=0

function move1(whichlayer){
tlayer=eval(whichlayer)
if (tlayer.top>0&&tlayer.top<=5){
tlayer.top=0
setTimeout(”move1(tlayer)”,pausebetweenimages)
setTimeout(”move2(document.main.document.second)”,pausebetweenimages)
return
}
if (tlayer.top>=tlayer.document.height*-1){
tlayer.top-=5
setTimeout(”move1(tlayer)”,50)
}
else{
tlayer.top=parseInt(scrollerheight)
tlayer.document.write(slideimages[i])
tlayer.document.close()
if (i==slideimages.length-1)
i=0
else
i++
}
}

function move2(whichlayer){
tlayer2=eval(whichlayer)
if (tlayer2.top>0&&tlayer2.top<=5){
tlayer2.top=0
setTimeout(”move2(tlayer2)”,pausebetweenimages)
setTimeout(”move1(document.main.document.first)”,pausebetweenimages)
return
}
if (tlayer2.top>=tlayer2.document.height*-1){
tlayer2.top-=5
setTimeout(”move2(tlayer2)”,50)
}
else{
tlayer2.top=parseInt(scrollerheight)
tlayer2.document.write(slideimages[i])
tlayer2.document.close()
if (i==slideimages.length-1)
i=0
else
i++
}
}

function move3(whichdiv){
tdiv=eval(whichdiv)
if (parseInt(tdiv.style.top)>0&&parseInt(tdiv.style.top)<=5){
tdiv.style.top=0+”px”
setTimeout(”move3(tdiv)”,pausebetweenimages)
setTimeout(”move4(second2_obj)”,pausebetweenimages)
return
}
if (parseInt(tdiv.style.top)>=tdiv.offsetHeight*-1){
tdiv.style.top=parseInt(tdiv.style.top)-5+”px”
setTimeout(”move3(tdiv)”,50)
}
else{
tdiv.style.top=scrollerheight
tdiv.innerHTML=slideimages[i]
if (i==slideimages.length-1)
i=0
else
i++
}
}

function move4(whichdiv){
tdiv2=eval(whichdiv)
if (parseInt(tdiv2.style.top)>0&&parseInt(tdiv2.style.top)<=5){
tdiv2.style.top=0+”px”
setTimeout(”move4(tdiv2)”,pausebetweenimages)
setTimeout(”move3(first2_obj)”,pausebetweenimages)
return
}
if (parseInt(tdiv2.style.top)>=tdiv2.offsetHeight*-1){
tdiv2.style.top=parseInt(tdiv2.style.top)-5+”px”
setTimeout(”move4(second2_obj)”,50)
}
else{
tdiv2.style.top=scrollerheight
tdiv2.innerHTML=slideimages[i]
if (i==slideimages.length-1)
i=0
else
i++
}
}

function startscroll(){
if (ie||dom){
first2_obj=ie? first2 : document.getElementById(”first2″)
second2_obj=ie? second2 : document.getElementById(”second2″)
move3(first2_obj)
second2_obj.style.top=scrollerheight
second2_obj.style.visibility=’visible’
}
else if (document.layers){
document.main.visibility=’show’
move1(document.main.document.first)
document.main.document.second.top=parseInt(scrollerheight)+5
document.main.document.second.visibility=’show’
}
}

window.onload=startscroll

</script>

<ilayer id=”main” width=&{scrollerwidth}; height=&{scrollerheight}; visibility=hide>
<layer id=”first” left=0 top=1 width=&{scrollerwidth};>
<script language=”JavaScript1.2″>
if (document.layers)
document.write(slideimages[0])
</script>
</layer>
<layer id=”second” left=0 top=0 width=&{scrollerwidth}; visibility=hide>
<script language=”JavaScript1.2″>
if (document.layers)
document.write(slideimages[dyndetermine=(slideimages.length==1)? 0 : 1])
</script>
</layer>
</ilayer>

<script language=”JavaScript1.2″>
if (ie||dom){
document.writeln(’<div id=”main2″ style=”position:relative;width:’+scrollerwidth+’;height:’+scrollerheight+’;overflow:hidden;”>’)
document.writeln(’<div style=”position:absolute;width:’+scrollerwidth+’;height:’+scrollerheight+’;clip:rect(0 ‘+scrollerwidth+’ ‘+scrollerheight+’ 0);left:0px;top:0px”>’)
document.writeln(’<div id=”first2″ style=”position:absolute;width:’+scrollerwidth+’;left:0px;top:1px;”>’)
document.write(slideimages[0])
document.writeln(’</div>’)
document.writeln(’<div id=”second2″ style=”position:absolute;width:’+scrollerwidth+’;left:0px;top:0px;visibility:hidden”>’)
document.write(slideimages[dyndetermine=(slideimages.length==1)? 0 : 1])
document.writeln(’</div>’)
document.writeln(’</div>’)
document.writeln(’</div>’)
}
</script>