いいねはAjaxでコントロールしますよ
index.phpに
<script src="../jquery-3.4.1.min.js"></script>
<script src="tweet.js"></script>
を追加
<span id="likes">いいね<img src="img/heart_small.png"> <?php echo $row["likes"] ?></span>
とspan idでくくるよ
tweet.jsを作る
なにはなくとも
$(function(){
console.log("hoge");
});
で先ほどのspan id="likes"がクリックされたときに動作する
Ajaxはデータを変更させたりもできる。何かをセレクトするだけじゃなく処理そのものを行うこともできるのでちょいとおそろしい。
そのための処理はAPIで事前に用意する必要があるらしい。
APIを作る
しかしその前に、
どのレコードのどのカラムを書き換えたらいいかということになる。
クリックする場所がどこだか予想はつかない。（どのツイートかわからない）
ところが何番の記事なのかがいまどこにもない。
その情報を含ませておかないといけない。
タイムラインのID（t_id）を取ってくる必要がある。(そもそもindex.phpに表示させる段階で。)
いま<span id="likes">としているがlikes（記事）はいっこじゃないはずなので変更
<span data-t.id="">
データ属性（HTML5から追加）
ユニバーサル属性
・頭がデータ（ハイフン）から始まっていること
・ハイフンの後は好きに使っていい
プログラマに自由にゆだねられた唯一の属性。
逆にデータメソッドというJクエリのメソッドがあってここに書かれている値を取得できるらしい
<span data-t.id="">という形
このなかにechoを仕込むという。
→
<span data-t.id="<?php echo $row["t_id"]; ?>">
いいねがクリックされる場所はツイートの数だけある。
クリックされたツイートのID番号をこんそーるに出してみましょうか
var t_id=$(this).data();//クリックされた場所のdataを取得
はじめてつかう
dataメソッド
textメソッドと同じ。ゲッターとして機能している
いっこいっこプロパティと値（＝オブジェクト）として取得しているらしい。
これで何番の値を＋＋しろと指示ができるようになった
APIの側に行くよ
いいねが押されたときにうごくphpのプログラムを作るよ
新規→
update_likes.php
クリックされたらその指定されたID番号のいいねをインクリメントする
UPDATE文は必ず最後に条件文をつけましょう
<?php
require_once("config.php");
$sql="UPDATE tweets SET likes=likes+1 WHERE t_id=:t_id";
?>
① WHERE句をつけないと全部のツイートにいいねが1増えるぞ
②t_idはget通信で送られてくるはずなのでプレースホルダにしておく
ここまで
--->update_likes.php
<?php
require_once("config.php");
$sql="UPDATE tweets SET likes=likes+1 WHERE t_id=:t_id";
$stmt=$pdo->prepare($sql);//構文を焼く
$stmt->bindValue(":t_id",$_GET["t_id"],PDO::PARAM_INT);//番号だからINT
$stmt->execute();
?>
いまのが動くかテストする
DBの1番のいいねの数を確認したら、
http://localhost/php/makino/twitter/update_likes.php?t_id=1;
これを窓に入力
↓
データベースを更新
ふえた。
