今回はそれぞれのPHPのロジックを説明していきます。参考にしたサイトはlearn to design a php quizzer using php and mysql(part1) です。シリーズは1-6までで、DBの中身がやや違うことと、時々違うやり方でやったりしました。
１．index.php
２．question.php
３．process.php
４．final.php
１．index.php
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 |
<?php include 'database.php'; ?> <?php session_start(); ?> <?php // Get total questions $query = "select * from question"; //Get results $results = $mysqli->query($query) or die($mysqli->error.__LINE__); $_SESSION['total'] = $results->num_rows; ?> <!doctype html> <html lang="en"> <head> <meta charset="utf-8"> <title>CAPM Quiz</title> <meta name="viewport" content="width=device-width, initial-scale=1.0 "><!--setup viewport --> <link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/css/bootstrap.min.css" integrity="sha384-ggOyR0iXCbMQv3Xipma34MD+dH/1fQ784/j6cY/iJTQUOhcWr7x9JvoRxT2MZw1T" crossorigin="anonymous"> <link rel="stylesheet" href="css/style.css"><!--Obtain the stylesheet--> </head> <body> <header> <div class="container"> <h1>Welcome to CAPM Quiz</h1> <div class="row"> <div class="col-xs-12 main"> <ul> <li><strong>Number of Questions:</strong><?php echo $_SESSION['total']; ?></li> <li><strong>Type: </strong>Multiple Choice</li> <li><strong>Estimated time:</strong><?php echo $_SESSION['total']*2;?> Minutes</li> </ul> <a href="question.php?n=1" class="start">Start Quiz</a> </div><!--col-xs-12--> </div><!--row--> </div><!--container--> </header> <footer> <div class="container"> Copyright © 2019, CAPM Quiz </div> </footer> </body> </html> |
1-1. まずdatabase.phpでデータベースに接続します。
MySQLi ファンクションでMySQL のデータベースにアクセスします。
ホスト名、DB名、ユーザー、パスワードを指定して、mysqliの新しいオブジェクトを作りDBに接続します。接続エラーがでたら、エラーメッセージを画面に表示します。
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 |
<?php //Create connection credentials $db_host = 'localhost'; $db_name = 'capmquiz'; $db_user = 'root'; $db_pass = 'xxxxxx'; //Create mysqli objects $mysqli = new mysqli($db_host, $db_user, $db_pass, $db_name); //Error handling if($mysqli->connect_error){ printf("connection is failed: %s\n", $mysqli->connect_error); exit(); } |
1-2. 次にsession_startでこのPHPのセッションを始めます。これは質問の正解を数えるスコアを計算することと、全部で幾つ質問があるかをグローバルとしてホールドするためです。
1-3. SQL Queryを作ってそれを実行します。questionテーブルの数を$_SESSIONに入れてホールドします。エラーの際はラインNoを表示させるようにします。
２．question.php
2-1．まずQuesiton idを見つけます。
http://localhost:81/capmquiz/question.php?n=1の”n”の値を判断します。そしてそのQuesiton idから質問データをもってきます。そして取り出したデータをAssociate Array（＄question)に入れます。
2-2．同様に同じQuesiton idでChoicesのテーブルから選択肢のデータを引き出します。そして取り出したデータはul tag内でWhileループであqるだけ表示させます。
echo $row[‘choice’] ValueはChoice_idをアサインして後でProcess.phpで正解かどうかの検証に使います。
2-3．Hidden インプットとして$number(question_id)もProcess.phpに渡します。
2-4．最初の問題になった時（$number=1)に＄＿SESSIONのScoreをInitializeしておきます。
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 |
<?php include 'database.php'; ?> <?php session_start(); ?> <?php //Set question id $number = (int) $_GET['n']; // get question $query = "Select * from question where question_id = $number"; //get results $result = $mysqli->query($query) or die($mysqli->error.__LINE__); $question = $result->fetch_assoc(); //get choices $query = "Select * from choices where question_id = $number"; //get results $choices = $mysqli->query($query) or die($mysqli->error.__LINE__); //initialize session variable if($number == 1){ $_SESSION['score']=0; } ?> <!doctype html> <html lang="en"> <head> <meta charset="utf-8"> <title>CAPM Quiz</title> <meta name="viewport" content="width=device-width, initial-scale=1.0 "><!--setup viewport --> <link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/css/bootstrap.min.css" integrity="sha384-ggOyR0iXCbMQv3Xipma34MD+dH/1fQ784/j6cY/iJTQUOhcWr7x9JvoRxT2MZw1T" crossorigin="anonymous"> <link rel="stylesheet" href="css/style.css"><!--Obtain the stylesheet--> </head> <body> <header> <div class="container"> <h1>Welcome to CAPM Quiz</h1> <div class="row"> <div class="col-xs-12 main"> <div class="current">Question <?php echo $number; ?> of <?php echo $_SESSION['total']; ?></div> <p class="question"> <?php echo $question['question']; ?> </p> <form method="post" action="process.php"> <ul class="choices"> <?php while($row = $choices->fetch_assoc()): ?> <li><input name="choice" type="radio" value="<?php echo $row['choice_id']; ?>" /><?php echo $row['choice']; ?></li> <?php endwhile; ?> </ul> <input type="submit" value="Submit"/> <input type="hidden" name="number" value="<?php echo $number; ?>"/> </form> </div><!--col-xs-12--> </div><!--row--> </div><!--container--> </header> <footer> <div class="container"> Copyright © 2019, CAPM Quiz </div> </footer> </body> </html> |
３．process.php
3-1．前のquestion.phpから”post”という方法でデータを受け取ります。＄＿Postはグローバル Variableです。’number’がquesiton_idで’choice’が選択したchoice_idです。次の質問に移るために１を足しています。$next=$number+1
3-2. choice テーブルから正解のchoiceを見つけます。そのqueryの結果を$rowにいれます。そしてそこから正しいchoice_id とquestion.phpで選んだchoice_idがマッチするかどうかIfで聞いています。正しければ$_SESSION[‘score’]に１を足しています。
3-3．そして質問が最後かどうか判断し if($number == $_SESSION[‘total’])もし最後だったら、final.phpにいき、そうでなければ次の問題に進みます。
header(“Location: question.php?n=”.$next)
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 |
<?php include 'database.php'; ?> <?php session_start(); ?> <?php //check to see if score is set if (!isset($_SESSION['score'])){ $_SESSION['score'] = 0; } if ($_POST) { $number = $_POST['number']; $selected_choice = $_POST['choice']; //echo $number.'<br>'; //echo $selected_choice; //print_r($_POST); $next = $number + 1; // get a correct choice $query = "Select * from choices where question_id = $number and is_correct=1"; // Get result $result = $mysqli->query($query) or die($mysqli->error.__LINE__); //Get the row $row = $result->fetch_assoc(); //Set correct choice $correct_choice = $row['choice_id']; //Compare if($correct_choice == $selected_choice){ //Answer is correct $_SESSION['score']++; } //check if the last question is if($number == $_SESSION['total']){ header("Location: final.php"); exit(); } else { header("Location: question.php?n=".$next); } } |
４．final.php
ここでは最終スコア$_SESSION[‘score’]を表示し、Take againのリンクでquestion.phpの最初の問題に戻ります。
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 |
<?php include 'database.php'; ?> <?php session_start(); ?> <!doctype html> <html lang="en"> <head> <meta charset="utf-8"> <title>CAPM Quiz</title> <meta name="viewport" content="width=device-width, initial-scale=1.0 "><!--setup viewport --> <link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/css/bootstrap.min.css" integrity="sha384-ggOyR0iXCbMQv3Xipma34MD+dH/1fQ784/j6cY/iJTQUOhcWr7x9JvoRxT2MZw1T" crossorigin="anonymous"> <link rel="stylesheet" href="css/style.css"><!--Obtain the stylesheet--> </head> <body> <header> <div class="container"> <h1>Welcome to CAPM Quiz</h1> <div class="row"> <div class="col-xs-12 main"> <h2>You're Done!</h2> <p>Final Score: <?php echo $_SESSION['score']; ?>/<?php echo $_SESSION['total'];?></p> <a href="question.php?n=1" class="start">Take again</a> </div><!--col-xs-12--> </div><!--row--> </div><!--container--> </header> <footer> <div class="container"> Copyright © 2019, CAPM Quiz </div> </footer> </body> </html> |
まとめると、
本来ならObject-orientedの方法でやるべきですが、とりあえずシンプルなクイズを作りたかったのでこれにしてみました。DBのテーブルを質問と選択肢に分けたことで選択肢は3でも4つでも好きなように作成できるようになっています。
後は、正解を一つづつ表示したりとか、データを入力する画面も作る予定です。