Tutorial PHP (1) ~ Dream's Zone

Pada artikel kali ini, kita akan membahas studi kasus mengenai program sederhana untuk men-generate sel tabel secara fleksibel.
Tekniknya: buat sebuah fungsi yang menerima argumen berupa jumlah sel dan jumlah kolom. Jadi, pembentukan sel tabel didasarkan pada nilai jumlah sel dan jumlah kolom yang diberikan. Sebagai contoh, hasil program dengan argumen 12 (sel) dan 3 (kolom) diperlihatkan seperti Gambar 1.

Gambar 1. Pembuatan sel dengan argumen 12 dan 3

Untuk contoh argumen 10 dan 4 diperlihatkan pada Gambar 2.

Gambar 2. Pembuatan sel dengan argumen 10 dan 4

Berikut adalah pembahasannya:

1. Buat sebuah file php dan simpan dengan code.php. Berikut source code-nya:

2. Buat sebuah file HTML yang didalamnya terintegrasi dengan java script. Berikut Source Code-nya:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <html> <head> <title>Generate Table with PHP</title> <style type="text/css">  </style> </head> <body> <span id="preservea8ec39c8435443e2963b1c63089183e6" class="wlWriterPreserve"><script language="JavaScript" type="text/javascript">  </script></span> <form method="post" action="code.php"> <h3 align="center" class="style1">__Tabel Fleksibel Dengan Generate Table__</h3> <div align="center"> <table width="327" border="0" bgcolor="#FFFFFF"> <tr bgcolor="#FFFFCC"> <td width="121" style="text-align:center">Rows</td> <td width="196"><strong>= </strong> <input name="JumlahRow" type="text" id="JumlahRow" onKeyUp="getmax();" onfocus="this.select();"></td> </tr> <tr bgcolor="#CCFFCC"> <td style="text-align:center"><label>Columns</label></td> <td><strong>= </strong> <input name="JumlahColum" type="text" id="JumlahColum" onKeyUp="getmax();" onfocus="this.select();"></td> </tr> <tr bgcolor="#FFFFCC"> <td style="text-align:center">Cell Total </td> <td><strong>= </strong> <input name="JumlahCell" type="text" id="JumlahCell" onKeyUp="getmax();" onFocus="this.select();"></td> </tr> <tr bgcolor="#CCFFCC"> <td style="text-align:center">Max Cells </td> <td><strong>= </strong> <input name="maxcells" type="text" id="maxcells" disabled="disabled" style="text-align:center"></td> </tr> </table> </div> <div id="apDiv1"> <input type="submit" name="Generate" value="G e n e r a t e"><input type="reset" name="Reset" value="R e s e t"> </div> </form> </body> </html> <textarea><p></p></div></DIV></DIV></DIV></DIV></DIV></DIV></DIV></DIV></DIV></DIV></DIV></DIV></BODY></HTML>

3. Simpan file PHP dan HTML dalam satu folder, sehingga jika dijalankan akan seperti gambar berikut:

a. Tampilan awal untuk menentukan jumlah baris, kolom dan banyaknya sel yang akan ditampilkan

b. Jika dimasukkan nilai row dan columns maka dalam sel Max Cells akan muncul nilai maksimal yang dapat ditampilkan

c. Jika kita masukkan nilai yang < nilai max cells dan kemudian di klik generate, maka akan muncul halaman ke dua seperti berikut:

Dimana pada tampilan ini, muncul beberapa informasi mengenai jumlah baris, jumlah kolom dan juga jumlah sel yang ditampilkan.

d. Namun jika nilai cell Total yang kita inputkan > nilai max cells maka akan muncul peringatan seperti berikut:

Muncul message box yang memberitahukan bahwa jumlah sel yang dimasukkan terlalu besar

Selamat belajar….

Dream's Zone

Kamis, Maret 18

Tutorial PHP (1)

0 comments:

Posting Komentar

Wahyu Penjual Mimpi

Labels

Ping Me!!

Blog Archive

pengunjung

Followers

Translate