Tutorial | Games | News | Download

ekarang membahas tentang Cara Membuat Table Generator dalam artikel ini ya..langsung saja pada source code, kali ini kita akan membuat tabel menggunakan tabel generator yang menerima masukan dari pengguna / user kemudian untuk dibuatkan tabel oleh program / function.

nah bagi yang mungkin masih bingung nah biar gak bingung silahkan pahami dulu dengan Belajar HTML Format Table

<body>
<form method=”post” action=”tabel.php”>
<p><strong>TABEL GENERATOR</strong></p>
<table width=”277? border=”0?>
<tr>
<td width=”89?>Jumlah Baris</td>
<td width=”172?><strong>: </strong><input name=”totalBaris” type=”text” id=”totalBaris” onKeyUp=”getmax();” onfocus=”this.select();”></td>
</tr>
<tr>
<td><label>Jumlah Kolom</label></td>
<td><strong>: </strong><input name=”totalKolom” type=”text” id=”totalKolom” onKeyUp=”getmax();” onfocus=”this.select();”></td>
</tr>
<tr>
<td>Jumlah Sel</td>
<td><strong>: </strong><input name=”totalSel” type=”text” id=”totalSel” onKeyUp=”getmax();” onFocus=”this.select();”></td>
</tr>
<tr>
<td>Sel Maksimal</td>
<td><strong>: </strong><input name=”jmlSelMax” type=”text” id=”jmlSelMax” readonly=”true” style=”background-color:#999999?>
</td>
</tr>
<tr>
<td>
<div align=”center”>
<br />
<input type=”reset” name=”Reset” value=”Reset”>
</div></td>
<td>
<div align=”right”>
<br />
<input type=”submit” name=”Generate” value=”Generate!”>
</div></td>
</tr>
</table>
</form>

<script language=”JavaScript” type=”text/javascript”>
<!–
function getmax() {
var R = parseInt(document.getElementById(‘totalBaris’).value);
var C = parseInt(document.getElementById(‘totalKolom’).value);
var X = parseInt(document.getElementById(‘totalSel’).value);
var cellmax = document.getElementById(‘jmlSelMax’);
var total = 0;
total = R * C;
cellmax.value = new String(total);
if (X > total)
{
alert(‘Jumlah sel yang anda inginkan melewati batas maksimal sel =’ + total);
document.getElementById(‘totalSel’).value = new String();
}
}
//–>
</script>

setelah membuat tabel generator, kita perlu memasukkan value dari kolom, baris serta jumlah sel yang diinginkan…

jika jumlah sel melebihi btas maksimal maka akan muncul alert sebagai berikut.

selanjutnya dibuat script phpnya.. salin dibawah codenya

<body>
<?php
$rows = 1;
$columns = 1;
$cells = 1;
?>

<?php $rows = (int) $_POST[“totalBaris”]; ?>
<?php $columns = (int) $_POST[“totalKolom”]; ?>
<?php $cells = (int) $_POST[“totalSel”]; ?>

You pick <?php echo $rows; ?> rows,<br />
You pick <?php echo $columns; ?> columns,<br />
and you need <?php echo $cells; ?> cells,<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>”;
?>
</body>

Hasilnya

Semoga bermanfaat bagi yang mau coba silahkan dicoba!

 


Tinggalkan Balasan

Isikan data di bawah atau klik salah satu ikon untuk log in:

Logo WordPress.com

You are commenting using your WordPress.com account. Logout / Ubah )

Gambar Twitter

You are commenting using your Twitter account. Logout / Ubah )

Foto Facebook

You are commenting using your Facebook account. Logout / Ubah )

Foto Google+

You are commenting using your Google+ account. Logout / Ubah )

Connecting to %s

Awan Tag

%d blogger menyukai ini: