Pembuatan tabel fleksibel menggunakan Pemrograman PHP sangatlah penting, kita hanya perlu menggenerate row, coloum, maupun cell yang kita inginkan. berikut kita mengulas kembali sekilas penjelasan tentang PHP (PHP: Hypertext Preprocessor) merupakan salah satu bahasa webscripting yang sangat powerful. Sejak pertama kali diperkenalkan, bahasa ini dimaksudkan untuk menghasilkan halaman-halaman web yang dinamis.
Hingga saat ini, PHP banyak sekali digunakan dalam membuat aplikasi web-baik lokal maupun Internet-dinamis dan atraktif.
Berikut saya akan membahas tentang bagai mana kita membuat 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 pada gambar di bawah ini:
Pada Gambar Tersebut Setelah Di Klik Generate Untuk Menghasilkan Tabel yang dinginkan sehingga dapat diperoleh hasil seperti pada gambar 2. mod4tgs2 :
Untuk memperoleh tampilan web seperti gambar di atas adapun source codenya adalah sebagai berikut:
yang pertama source code php seperti di bawah ini:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<title>Hasil Generate Tabel</title>
</head>
<body>
<div align="center">
<?php
$rows = 1;
$columns = 1;
$cells = 1;
?>
<?php $rows = (int) $_POST["JumlahRow"]; ?>
<?php $columns = (int) $_POST["JumlahColum"]; ?>
<?php $cells = (int) $_POST["JumlahCell"]; ?>
<strong>Kamu Memilih</strong> <?php echo $rows; ?> <em>rows,</em><br />
<strong>Kamu Memilih</strong> <?php echo $columns; ?> <em>columns,</em><br />
<strong>Dan Anda Membutuhkan</strong> <?php echo $cells; ?> <em>cells,</em><br />
<br />
<br />
<?php
$width = $columns * 75;
echo "<table width=".$width." border=1>";
$rw = 0;
$cel = 1;
while ($rw < $rows && $cel <= $cells)
{
echo "<tr>";
$cl = 0;
while ($cl < $columns)
{
if ($cel <= $cells)
{
echo "<td><div align=center>".$cel."</div></td>";
$cel++;
}
$cl++;
}
echo "</tr>";
$rw++;
}
echo "</table>";
?>
</div>
</body>
</html>
dilanjutkan dengan source code htmlnya
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<title>Novi Khassifa</title>
<style type="text/css">
<!--
#apDiv1 {
position:absolute;
width:178px;
height:24px;
z-index:1;
left: 284px;
top: 189px;
}
.style1 {
color: #0000CC;
font-weight: bold;
}
-->
</style>
</head>
<body>
<form method="post" action="tgsmod5.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>
<script language="JavaScript" type="text/javascript">
<!--
function getmax() {
var R = parseInt(document.getElementById('JumlahRow').value);
var C = parseInt(document.getElementById('JumlahColum').value);
var X = parseInt(document.getElementById('JumlahCell').value);
var cellmax = document.getElementById('maxcells');
var total = 'N/A';
total = R * C;
cellmax.value = new String(total);
if (X > total)
{
alert('Cell Total Yang Anda Masukkan Terlalu Besar, Nilai Maksimum Cells = ' + total);
document.getElementById('CellsTotal').value = new String();
}
}
//-->
</script>
</html>
Selamat mencoba...^_^
Membuat Tabel Fleksibel dengan PHP
.
Langganan:
Posting Komentar (Atom)
The ReaL GeJe ^^
KHASSIFA SI BINTU NAHL
0 komentar:
Posting Komentar