html
1 2<?php 3 4ini_set('display_errors', 1); 5define('DSN', 'mysql:host=localhost;dbname=dotinstall_poll_php'); 6define('DB_USERNAME', 'dbuser'); 7define('DB_PASSWORD', 't8CmBz4A'); 8 9require_once('index2.php'); 10 11$poll = new Poll(); 12$poll->_connectDB(); 13 14 15 16//下のほうのボタンを押すとjsによりformがsubmitされ、こちらが反応するはずなのですが 17if ($_SERVER['REQUEST_METHOD'] === 'POST') { 18 $poll->save(); 19}; 20 21 22 23?> 24 25 26<!DOCTYPE html> 27<html lang="ja"> 28<head> 29 <meta charset-"utf-8"> 30 <title>vote system</title> 31 <link rel="stylesheet" href="style.css"> 32</head> 33<body> 34 <h2>which do you like best?</h2> 35 36<form action="" method="POST"> 37<div class="container"> 38 39//画像を3枚貼り付けています 40 <div class="P1 K" data-id="0"> 41 <p>1</p> 42 <img src="world1.jpg" width="250px" height="250px"> 43 </div> 44 <div class="P2 K" data-id="1"> 45 <p>2</p> 46 <img src="OIPQ53HDI2B.jpg" width="250px" height="250px"> 47 </div> 48 <div class="P3 K" data-id="2"> 49 <p>3</p> 50 <img src="OIPGV904CK3.jpg" width="250px" height="250px"> 51 </div> 52 53//上の画像のどれかを選択すると画像のdata-id番号がvalue値になるようにjsで設定しました。 54 <input type="hidden" id="answer" name="answer" value=""> 55 56</div> 57</form> 58 59<a href="result.php"> 60 <div class="button"> 61 <p class="vote">Vote!</p> 62 </div> 63</a> 64 65<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script> 66<script> 67$(function() { 68 'use strict'; 69//先ほど述べたjsの処理 70$('.K').on('click', function(){ 71 $('#answer').val($(this).data('id')); 72}); 73 74//ボタンを押すとvalue値が送信される 75$('.button').on('click', function(){ 76 $('form').submit(); 77}); 78 79}); 80</script> 81 82 83 84 85</body> 86</html> 87
php
1 2<?php 3 4 5session_start(); 6 7class Poll { 8 9 private $_db; 10 11//ここのsave()が反応して、mysqlのテーブルにレコードが挿入されるはずが、ボタンクリック後に見てみるとテーブル内がemptyになっています。 12 // sqlにデータ送信 13 function save() { 14 $sql = "insert into answers 15 (answer, created) 16 values (:answer, now())"; 17 $stmt = $this->_db->prepare($sql); 18 $stmt->bindValue(':answer', (int)$_POST['answer'], PDO::PARAM_INT); 19 $stmt->execute(); 20 } 21 22 23 24 25 26 27// データベース接続 28 29 30 31function _connectDB() { 32 33 try { 34 $this->_db = new PDO(DSN, DB_USERNAME, DB_PASSWORD); 35 $this->_db->setAttribute(PDO::ATTR_ERRMODE, PDO::ERRMODE_EXCEPTION); 36 } catch (PDOException $e) { 37 throw new Exception('Faild to connect DB'); 38 } 39 40} 41 42?> 43
なおボタンクリック後に下記のページに飛んでいくのですが、そこでボタンを押した場合には正しく反応します。
html
1<?php 2ini_set('display_errors', 1); 3define('DSN', 'mysql:host=localhost;dbname=dotinstall_poll_php'); 4define('DB_USERNAME', 'dbuser'); 5define('DB_PASSWORD', 't8CmBz4A'); 6 7require_once('index2.php'); 8 9$poll = new Poll(); 10$poll->_connectDB(); 11 12$poll->getResults(); 13 14$results = $poll->getResults(); 15 16 17if ($_SERVER['REQUEST_METHOD'] === 'POST') { 18 $poll->save(); 19}; 20 21?> 22<!DOCTYPE html> 23<html lang="ja"> 24<head> 25 <meta charset-"utf-8"> 26 <title>vote system</title> 27 <link rel="stylesheet" href="style.css"> 28</head> 29<body> 30 <h2>which do you like best?</h2> 31 32<form action="" method="POST"> 33<div class="container"> 34 35 <div class="P1 K" data-id="0"> 36 <p><?php echo $results[0]?></p> 37 <img src="world1.jpg" width="250px" height="250px"> 38 </div> 39 <div class="P2 K" data-id="1"> 40 <p><?php echo $results[1]?></p> 41 <img src="OIPQ53HDI2B.jpg" width="250px" height="250px"> 42 </div> 43 <div class="P3 K" data-id="2"> 44 <p><?php echo $results[2]?></p> 45 <img src="OIPGV904CK3.jpg" width="250px" height="250px"> 46 </div> 47 <input type="hidden" id="answer" name="answer" value=""> 48 49</div> 50<div class="button"> 51 <p class="vote">Vote!</p> 52</div> 53</form> 54<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script> 55<script> 56$(function() { 57 58 'use strict'; 59 60$('.K').on('click', function(){ 61 $('.K').addClass("selected"); 62 $(this).removeClass("selected"); 63 $('#answer').val($(this).data('id')); 64}); 65 66$('.button').on('click', function() { 67 if ($('#answer').val() === '') { 68 alert('choose!!'); 69 } else { 70 $('form').submit(); 71} 72}); 73 74}); 75</script> 76 77 78 79 80</body> 81</html>
なぜボタンを押した後もテーブルの中が空になっているのかアドバイスをいただければ幸いです。
回答2件
あなたの回答
tips
プレビュー