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 1pertama qta buat dlu file tugasprak.php
<!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>
<body background="3.jpg">
</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"]; ?>
<font face = "kristen itc" size = "4" color ="gold" left= 600px;>
<b>Banyaknya baris yang kamu pilih</b> <?php echo $rows; ?> <em>rows,</em><br />
<b>Banyaknya kolom yang kamu pilih</b> <?php echo $columns; ?> <em>columns,</em><br />
<b>So kamu membutuhkan</b> <?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>
kedua kita buat dulu file tugasprak.html
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<title>Generate Matriks Sel Pada Tabel</title>
<body background="3.jpg">
<style type="text/css">
<!--
#apDiv1 {
position:absolute;
width:178px;
height:24px;
z-index:1;
left: 284px;
top: 189px;
}
.style1 {
color: red;
font-weight: bold;
}
-->
</style>
</head>
<body>
<form method="post" action="tugasprak.php">
<font face = "kristen itc" size = "4" color ="Pink" left= 600px;>
<h3 align="center" class="style1"><b>Generate Matriks Sel Pada Tabel</h3></b>
<div align="center">
<table width="327" border="0" bgcolor="pink">
<tr bgcolor="orange">
<td width="121" style="text-align:center">Baris</td>
<td width="196"><b>= </b>
<input name="JumlahRow" type="text" id="JumlahRow" onKeyUp="getmax();" onfocus="this.select();"></td>
</tr>
<tr bgcolor="yellow">
<td style="text-align:center"><label>Kolom</label></td>
<td><b>= </b>
<input name="JumlahColum" type="text" id="JumlahColum" onKeyUp="getmax();" onfocus="this.select();"></td>
</tr>
<tr bgcolor="yellow">
<td style="text-align:center">Jumlah sel</td>
<td><b>= </b>
<input name="JumlahCell" type="text" id="JumlahCell" onKeyUp="getmax();" onFocus="this.select();"></td>
</tr>
<tr bgcolor="orange">
<td style="text-align:center">Max jumlah sel</td>
<td><b>= </b>
<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="Generate" style="position:absolute; width:100px; height:30px; left: 325px; top: 30px; color : purple;" />
</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>
pengend tau gimana hasilnya ???
Tidak ada komentar:
Posting Komentar