何か失敗した時に、「失敗は成長の元」を、言い続ける、ユゲタです。
今回のお題第2回目は、phpでの九九表示です。
javascriptと違って、サーバーサイド処理なので、さほど多くのパターンがあるわけではないのですが、
しっかりと、コーディングしてみたいと思います。
本日のIT謎掛け
「サーバーサイドスクリプト」と、かけまして・・・
「公共ラジオ放送」と、ときます。
そのココロは・・・
リクエストによって評価されます。
tableタグで表示
まずは、普通にtableタグで九九を表示してみます。
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>kukku-php</title>
<style>
table{
border-collapse:collapse;
}
th,td{
border:1px solid black;
padding:2px 4px;
text-align:center;
font-size:12px;
}
</style>
</head>
<body>
<table>
<?php
for($i=1; $i<=9; $i++){
echo "<tr>";
for($j=1; $j<=9; $j++){
echo "<td>";
echo "$j × $i = ".($j*$i);
echo "</td>";
}
echo "</tr>".PHP_EOL;
}
?>
</table>
</body>
</html>
見出しをつける
九九には見出しが必要なので、見出しを追加。
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>kukku-php</title>
<style>
table{
border-collapse:collapse;
}
th,td{
border:1px solid black;
padding:2px 4px;
text-align:center;
font-size:12px;
}
th{
background-color:#ccc;
min-width:30px;
}
</style>
</head>
<body>
<table>
<?php
echo "<tr>";
for($i=0; $i<=9; $i++){
if($i > 0){
echo "<th>$i</th>";
}
else{
echo "<th></th>";
}
}
echo "</tr>".PHP_EOL;
for($i=1; $i<=9; $i++){
echo "<tr>";
echo "<th>$i</th>";
for($j=1; $j<=9; $j++){
echo "<td>";
echo "$j × $i = ".($j*$i);
echo "</td>";
}
echo "</tr>".PHP_EOL;
}
?>
</table>
</body>
</html>
値を入力して反映
javascriptでは動的に行えましたが、phpはsubmitをしてページ切り替えで入力値を反映させます。
<?php
$_POST["x"] = isset($_POST["x"]) ? $_POST["x"] : 9;
$_POST["y"] = isset($_POST["y"]) ? $_POST["y"] : 9;
?>
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>kukku-php</title>
<style>
table{
border-collapse:collapse;
}
th,td{
border:1px solid black;
padding:2px 4px;
text-align:center;
font-size:12px;
}
th{
background-color:#ccc;
min-width:30px;
}
input{
width:30px;
padding:2px 4px;
border:1px solid #ccc;
border-radius:4px;
margin:4px;
}
button{
width:60px;
padding:2px 4px;
border:1px solid #ccc;
border-radius:4px;
background-color:#eee;
margin:4px;
}
</style>
</head>
<body>
<table>
<form method="post" action="003.php">
<input type="text" name="x" value="<?php echo $_POST["x"] ?>">
<span> × </span>
<input type="text" name="y" value="<?php echo $_POST["y"] ?>">
<button type="submit">更新</button>
</form>
<hr>
<?php
echo "<tr>";
for($i=0; $i<=$_POST["x"]; $i++){
if($i > 0){
echo "<th>$i</th>";
}
else{
echo "<th></th>";
}
}
echo "</tr>".PHP_EOL;
for($i=1; $i<=$_POST["y"]; $i++){
echo "<tr>";
echo "<th>$i</th>";
for($j=1; $j<=$_POST["x"]; $j++){
echo "<td>";
echo "$j × $i = ".($j*$i);
echo "</td>";
}
echo "</tr>".PHP_EOL;
}
?>
</table>
</body>
</html>
リクエストクエリ情報を参照する為に、ソースの上部で、取得するようにしています。
同時にデフォルト値もセットする必要があるので、この部分で行います。
$_POST["x"]と$_POST["y"]は、縦軸、横軸なのですが、見出しも含めて、for文でどちらを使うかを迷わないようにしましょう。
ホームページでこうした処理をしたい時は、javascriptの方がスッキリできて便利だという事が分かりますね。
でもとりあえず、お題に対するphpでのやり方です。
