お世話になります。あるサイトを作っており、Facebookによくある自作のイイネボタンを実装したいと考え、下記サイトからサンプルを頂戴し実装テストを重ねています。
https://manablog.org/php-voting-system/
上記サイトにて配布されているファイルは、通常画面となるindex.php、MySqlへの接続を行うconfig.php、Ajaxでデータの上書を行うvote.php、そしてJSファイルのjquery.jsの4つです。
index.php
<?php ob_start(); include('config.php'); ?> <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <title>投票機能の作成方法</title> <script type="text/javascript" src="jquery.js"></script> <script type="text/javascript"> $(function() { // buttonがクリックされたときに実行 $("button").click(function() { // buttonのIDを取得する var id = $(this).attr("id"); // buttonのname(商品名)を取得する var product_name = $(this).attr("name"); // POST用のデータ準備:id=をつけないと、vote.phpの$_POST['id']で取得できない var voteData = 'id='+ id; // span内の投票数を書き換える var thisButton = $(this).prev('span'); $.ajax({ type: "POST", url: "vote.php", data: voteData, success: function(data) { // 処理が成功したら、thisButton内部を書き換える thisButton.html(data); } }); return false; }); }); </script> </head> <body> <?php $query = "SELECT * FROM products"; $result = $mysqli->query($query); while ($row = $result->fetch_assoc()) { $id = $row['id']; $product_name = $row['product_name']; $product_vote = $row['product_vote']; ?> <p> <?php echo $product_name; ?>: <span id="num"><?php echo $product_vote; ?></span> <button id="<?php echo $id; ?>" name="<?php echo $product_name; ?>">投票する</button> </p> <?php } // End of while ?> </body> </html>
vote.php
<?php include("config.php"); // POSTされたときに下記を実行 if( $_POST['id'] ) { $id = $_POST['id']; $id = $mysqli->real_escape_string($id); // クッキーで投票済かどうかを判断する if ( !isset($_COOKIE['voted_'.$id]) ) { // クッキーを付与 setcookie("voted_".$id, "voted_".$id, time()+3600); // 有効期限は一時間です // 投票数をアップデートする $sql = "UPDATE products SET product_vote = product_vote+1 WHERE id='$id'"; $mysqli->query( $sql); } // 投票数を取得する $result = $mysqli->query("SELECT product_vote FROM products WHERE id='$id'"); $row=$result->fetch_assoc(); $vote_value=$row['product_vote']; echo $vote_value; }
(jquery.jsとデータベースの接続ファイルであるconfig.pjpは省略)
ここで質問です。サンプルは正常に動くまで確認していますが、2種類のイイネボタンを実装する場合はどのようなjavascriptタグとなるのでしょうか?
例えばですが、ブログサイトを想像した場合、ブログの記事に対してイイネをする場合と、記事を読んだコメントに対してイイネをする場合は、テーブルを別けるべきと考え、記事用のテーブルとコメント用のテーブルがあるのですが、index.php内に記述を
<?php $query = "SELECT * FROM products"; $result = $mysqli->query($query); while ($row = $result->fetch_assoc()) { $id = $row['id']; $product_name = $row['product_name']; $product_vote = $row['product_vote']; ?> <p> <?php echo $product_name; ?>: <span id="num"><?php echo $product_vote; ?></span> <button id="<?php echo $id; ?>" name="<?php echo $product_name; ?>">投票する</button> </p> <?php } $query = "SELECT * FROM products2"; $result = $mysqli->query($query); while ($row = $result->fetch_assoc()) { $id2 = $row['id2']; $product_name2 = $row['product_name2']; $product_vote2 = $row['product_vote2']; ?> <p> <?php echo $product_name2; ?>: <span id2="num"><?php echo $product_vote2; ?></span> <button id2="<?php echo $id2; ?>" name="<?php echo $product_name2; ?>">投票する</button> </p> <?php } // End of while ?>
のようにした場合、<javascript>タグ内の記述はどのようになるのでしょうか?
データ書き込みファイルとなるvote.phpは、vote2.phpといったファイルを追加することを想定していますが、処理の仕方が分かりません。
お恥ずかしい質問かと思われますが、javascriptの動きがイメージ出来ずにいる次第です。これまでjavascriptを触る機会がなかったため、これを機にまずは勉強と思っているのですが・・・ご指導いただければ幸いです。よろしくお願いいたします。
回答1件
あなたの回答
tips
プレビュー