1.コマンド問題選択画面{改修前}
下記のようなカテゴリー毎に、問題が選べる画面を作る。
前回、下記の記事を作成した。
コマンドとコマンドの解説を格納するデータベースを作成したので、このデータベースを利用して
問題を出題するページの作成にトライする。
(1)全てのカテゴリーを表示して、いくつ出題するかを選んで、スタートボタンを押す。
(2)選んだカテゴリーと、出題数分問題が入力欄付きで表示される。
回答に対して、確定ボタン(正答率を表示する頁に遷移)と戻るボタン(最初の画面に戻る)
ただし、選んだカテゴリーに対して問題や回答が登録されていない時は、戻るボタンのみ表示。
linux_command_test1.php
<!DOCTYPE html>
<html lang="ja">
<meta charset="utf-8">
<form action="linux_command_test2.php" method="post">
<title>データ送信テスト</title>
<h1>データ送信テスト</h1>
カテゴリー:
<select name="l_category">
<option>1capacity_planning</option>
<option>2Linux_Kernel</option>
<option>3Boot_System</option>
<option>4Device_FileSystem</option>
<option>5Raid_Lvm</option>
<option>6Network</option>
<option>7Mentenance</option>
<option>8DNS</option>
<option>9WebServer</option>
<option>10Samba_NFS</option>
<option>11dhcp_ldap</option>
<option>12mailService</option>
<option>13SystemSecurity</option>
</select>
<br>
問題数:
<select name="l_num">
<option>5</option>
<option>10</option>
<option>15</option>
</select>
<br>
<input type="submit" value="スタート" name="btn1">
<br>
</form>
</html>
2.苦しみは突然に！！
これは、数十年前のトレンディドラマのタイトルではない。
前述の「確定ボタンの表示/非表示」の切り替えが、__今世紀最大の苦しみ__になってしまった。
- submitボタンにパラメータによってdisabled属性をつけてみる。
——->この属性があるだけで、非表示。
- submitボタンにパラメータによってvisibility属性(none|visible)をつけてみる。
——->切り替えが上手くいかない。
JavaScriptでは、じゃんじゃん解決法が出ているが、
phpからではform部品の表示・非表示の切り替えが出来ないらしい事がわかった。
3.どうすればいいのか。
どのカテゴリーに対して、問題やコマンドが存在するのか確認してみる。
「SELECT DISTINCT category0 from tbl_linux」
DBbrowserで上記sqlを投げると
2つのカテゴリーが表示された。
この２つのカテゴリーがselectboxに表示されるように
すればいいのだ。
4.改修後
linux_command_test1.php
<!DOCTYPE html>
<html lang="ja">
<meta charset="utf-8">
<form action="linux_command_test2.php" method="post">
<title>linuxコマンド問題(カテゴリー選択)</title>
<h1>linuxコマンド問題(カテゴリー選択)</h1>
<?php
//問題登録しているカテゴリーの種類
$query_cate0 = "SELECT DISTINCT category0 from tbl_linux";
$db_name='linux_quiz3.db';
$db1 = new PDO('sqlite:'.$db_name);
$result_a=$db1->prepare($query_cate0);
$result_a->execute();
?>
カテゴリー:
<select name="l_category">
//カテゴリーを配列に格納し、セレクトボックスに表示
<?php while($select_data=$result_a->fetch(PDO::FETCH_ASSOC)){ ?>
<option><?php echo $select_data['category0']; ?></option>
<?php } ?>
</select>
<br><br>
問題数:
<select name="l_num">
<option>5</option>
<option>10</option>
<option>15</option>
</select>
<br><br>
<input type="submit" value="スタート" name="btn1">
<br>
</form>
<?php
//データベースを閉じる。
$db1=null;
?>
</html>
なんとか完成。