🎄teratailクリスマスプレゼントキャンペーン2024🎄』開催中!

\teratail特別グッズやAmazonギフトカード最大2,000円分が当たる!/

詳細はこちら
SQL

SQL(Structured Query Language)は、リレーショナルデータベース管理システム (RDBMS)のデータベース言語です。大きく分けて、データ定義言語(DDL)、データ操作言語(DML)、データ制御言語(DCL)の3つで構成されており、プログラム上でSQL文を生成して、RDBMSに命令を出し、RDBに必要なデータを格納できます。また、格納したデータを引き出すことも可能です。

PHP

PHPは、Webサイト構築に特化して開発されたプログラミング言語です。大きな特徴のひとつは、HTMLに直接プログラムを埋め込むことができるという点です。PHPを用いることで、HTMLを動的コンテンツとして出力できます。HTMLがそのままブラウザに表示されるのに対し、PHPプログラムはサーバ側で実行された結果がブラウザに表示されるため、PHPスクリプトは「サーバサイドスクリプト」と呼ばれています。

Ajax

Ajaxとは、Webブラウザ内で搭載されているJavaScriptのHTTP通信機能を使って非同期通信を利用し、インターフェイスの構築などを行う技術の総称です。XMLドキュメントを指定したURLから読み込み、画面描画やユーザの操作などと並行してサーバと非同期に通信するWebアプリケーションを実現することができます。

Q&A

解決済

4回答

9115閲覧

ajaxを使った、DB情報の更新方法

paccuman

総合スコア13

SQL

SQL(Structured Query Language)は、リレーショナルデータベース管理システム (RDBMS)のデータベース言語です。大きく分けて、データ定義言語(DDL)、データ操作言語(DML)、データ制御言語(DCL)の3つで構成されており、プログラム上でSQL文を生成して、RDBMSに命令を出し、RDBに必要なデータを格納できます。また、格納したデータを引き出すことも可能です。

PHP

PHPは、Webサイト構築に特化して開発されたプログラミング言語です。大きな特徴のひとつは、HTMLに直接プログラムを埋め込むことができるという点です。PHPを用いることで、HTMLを動的コンテンツとして出力できます。HTMLがそのままブラウザに表示されるのに対し、PHPプログラムはサーバ側で実行された結果がブラウザに表示されるため、PHPスクリプトは「サーバサイドスクリプト」と呼ばれています。

Ajax

Ajaxとは、Webブラウザ内で搭載されているJavaScriptのHTTP通信機能を使って非同期通信を利用し、インターフェイスの構築などを行う技術の総称です。XMLドキュメントを指定したURLから読み込み、画面描画やユーザの操作などと並行してサーバと非同期に通信するWebアプリケーションを実現することができます。

0グッド

0クリップ

投稿2019/11/30 13:05

編集2019/12/01 10:17

前提・実現したいこと

php初学者です。
phpで、記事を投稿/検索/新規作成/編集するプログラムを組んでます。

【伺いたい工程部分】
特定のidの記事の表示画面から、idを受け取りその記事を編集するための編集画面での出来事です。
ユーザーには、新しい情報を入れてもらい最後に更新ボタンを押してDB更新を完了してもう仕様です。

【イメージしている流れ】
① ユーザーが新たに入力した値を取得
それぞれ、inputとtextareaのvalueには初期値としてDBから取得した値が入っているのでchangeイベントで、
radioはclickイベントで、ユーザーがブラウザ上で編集して入力している値を確認しvarで変数に代入して値を保持

script

1$(function(){ 2 3 //ブラウザ上で更新された、input,textareaのvalueを変数に代入 4 $('#id_url').change(function() { 5 var $inputVal_url = $(this).val(); 6 }); 7 8 $('#id_wire_url').change(function() { 9 var $inputVal_wire_url = $(this).val(); 10 }); 11 12 $('#id_project').change(function() { 13 var $nputVal_project = $(this).val(); 14 }); 15 16 $('#id_coment').change(function() { 17 var $textareaVal_coment = $(this).val(); 18 }); 19 20 21 //ブラウザ上で選択された、ラジオボタンのvalueを変数に代入 22$(".page_name_btn").click( function() { 23 var $radioVal_page_name = $("input[name='style']:checked").val(); 24}); 25 26$(".job_btn").click( function() { 27 var $radioVal_job = $("input[name='style']:checked").val(); 28}); 29 30$(".style_btn").click( function() { 31 var $radioVal_style = $("input[name='style']:checked").val(); 32});

② phpに変数を渡す
ajaxで#ajaxクリック時に、update.phpに変数を渡す

script

1 $('#ajax').on('click',function(){ 2 3 //idを変数に代入 4 var $id_id = $('#id_id').val(); 5 6 $.ajax({ 7 url:'update.php', //送信先 8 type:'POST', //送信方法 9 datatype: 'json', //受け取りデータの種類 10 data:{ 11 id : $id_id, 12 url : $inputVal_url, 13 wire_url : $inputVal_wire_url, 14 project : $inputVal_project, 15 coment : $textareaVal_coment, 16 page_name :$radioVal_page_name, 17 job :$radioVal_job, 18 style :$radioVal_style 19 }, 20 // Ajax通信が成功した時 21 success : function(){ 22 alert('更新されました。\nありがとうございました。'); 23 console.log('通信成功'); 24 }, 25 // Ajax通信が失敗した時 26 error : function() { 27 alert('通信に失敗しました。\n通信環境を確認の上、もう一度更新ボタンを押してください。'); 28 console.log('通信失敗'); 29 } 30 }); 31 //submitによる画面リロードを防いでいます。 32 return false; 33 }); //#ajax click end

③ DBを更新する
update.phpで、sql実行して値を更新

php

1ini_set("display_errors", 1); 2error_reporting(E_ALL); 3 4//受け取った値を代入 5$id = $_REQUEST['id']; 6$project = $_REQUEST['project']; 7$url = $_REQUEST['url']; 8$wire_url = $_REQUEST['wire_url']; 9$page_name = $_REQUEST['page_name']; 10$job = $_REQUEST['job']; 11$style = $_REQUEST['style']; 12$coment = $_REQUEST['coment']; 13 14 15$pdo = new PDO(//接続情報); 16 17$sql = 'UPDATE articles SET project = :project and url = :url and wire_url = :wire_url and page_name = :page_name and job = :job and style = :style and coment = :coment 18 WHERE id = :id 19 '; 20 $statement = $pdo->prepare($sql); 21 $statement->bindValue(':id', $id, PDO::PARAM_INT); 22 $statement->bindValue(':project', $project, PDO::PARAM_STR); 23 $statement->bindValue(':url', $url, PDO::PARAM_STR); 24 $statement->bindValue(':wire_url', $wire_url, PDO::PARAM_STR); 25 $statement->bindValue(':page_name', $page_name, PDO::PARAM_STR); 26 $statement->bindValue(':job', $job, PDO::PARAM_STR); 27 $statement->bindValue(':style', $style, PDO::PARAM_STR); 28 $statement->bindValue(':coment', $coment, PDO::PARAM_STR); 29 $statement->execute(); 30 31 $statement = null; 32 $pdo = null;

(補足)

html

1<form> 2ajaxのクリックイベント部分のhtmlの記述 3<!--input,textarea,radioの入力コードの記述--> 4 5<input id="ajax" class="update-btn" type="submit" value="更新する"> 6</form>

発生している問題・エラーメッセージ

DBの更新がされず、ajax通信も成功しているのかが不明です。。。

申し訳ございません。ブラウザが更新されるだけで特に変化なしです。

試したこと

ググりました。
jqueryの変数をphpに渡すことと、その中でajaxを調べ、上記のソースコードはググりながらコピペしてカスタムしました。

補足情報(FW/ツールのバージョンなど)

php:5.7
mysql:5.7.28

ここにより詳細な情報を記載してください。

気になる質問をクリップする

クリップした質問は、後からいつでもMYページで確認できます。

またクリップした質問に回答があった際、通知やメールを受け取ることができます。

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

m.ts10806

2019/11/30 19:33

>php初学者です。 あまりこういった但し書きは要らないと思います(要件ではないので) 「初心者アイコン」を質問につけるにとどめてください。 質問は編集できます。
paccuman

2019/12/01 10:12

ありがとうございます。編集しました。
guest

回答4

0

ベストアンサー

DBの更新がされず、

まずSQLのミスがありますね。それは既に指摘がある通り。

ただ、SQLはPHPからすると外部の仕組みです。
絶対にPHPからしか実行できないわけではありません。
他の言語からも実行できますし、ターミナルやツールなどからログインして直接実行することも出来ます。

直接実行して想定通りに動かないSQLであれば当然PHPなど外部から実行しても動きません。
変数など入力を受け付ける可変な情報はひとまず固定値にして直接実行して想定通りの結果が得られるか確かめてから、利用しましょう。
そうすることで、何か問題が起きても「SQLの構文自体は問題ない」と、1つ可能性を潰せるからです。

いきなりPHPから変数(やプリペアドステートメント)で実行してしまうと、
PHPのコードがいけないのか、SQLがいけないのか、値がきちんとPHPから渡せていないのか、通信状態が悪いのか、、、、、様々な可能性と向き合わなければいけません。
1つでも可能性を潰しておけば、考慮すべき部分が減るので、確かめやすくなります。

ajax通信も成功しているのかが不明です。。。

通信自体の成否やPHP側の出力はJavaScript側で取得可能です。

jQueryリファレンスなどを確認されると分かりますが、様々な引数が返ってくることが分かります。

success

Type: Function( Anything data, String textStatus, jqXHR jqXHR )
error
Type: Function( jqXHR jqXHR, String textStatus, String errorThrown )

successにきたとしてもtextStatusは必ず確認しておいたほうが良いです。
ちなみに受け取る側の引数なので必須ではありません。
が、これだけ返してくれるのでなるべく全て見ておくようにしておいたほうが良いでしょう。
alert()などで直接画面に出す必要はなく、console.log()でコンソールに出すだけでも良いです。
※もしユーザー向けに本番リリースするのであれば除くべき

AjaxではPHP側での出力をsuccessの「data」で拾ってくれる仕組みがあるので、何かしら出力するようにして置いた方が良いです。
別に1とか0とかでも良いです。何も返してないことで、余計にPHP側の状況を不明にしてしまっています。

また、PHP側にDBの処理をさせるのであれば、エラーを捕捉する仕組みを導入すべきです。

php

1try{ 2 3//PDO接続からトランザクション、DB処理、コミット/ロールバックまで 4 5}catch (PDOException $e){ 6 echo $e->getMessage(); 7 //できれば$e全部ログ出力 8} 9

PHPマニュアル:エラーおよびエラー処理

さらっと最後に書きましたが、Ajaxもデバッグできるような仕組みを導入しましょう。
ブラウザのデベロッパツールでも通信状態を確認することができますし、
PHPコードがどこまで通っているか確かめたかったらテキストファイルに状況を書きだすでも良いですし、デバッガ導入も有効でしょう。
私としてはAjax実行するといっても結局POST/GETでリクエストを送るにすぎないので、JavaScriptからでなく普通にform送信でPOST/GETリクエストを送るのが結構手っ取り早い気もします。ブラウザで見れますしね。

蛇足:
success/errorは割と古めの書き方として認識されています。
本件落ち着きましたら、新しい書き方もチャレンジしてみましょう。
おじさんが若い時はね$.ajax()のオプションでsuccessとかerrorとか指定していたんだよ(追憶)

投稿2019/11/30 20:01

編集2019/11/30 20:02
m.ts10806

総合スコア80875

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

paccuman

2019/12/01 11:19

ありがとうございます! トランザクションやコミットや色々「できているのか」「できていないのか」を判定する記述は大切なんですね。。 success/errorについての補足情報もありがとうございました! ご指摘いただいたように動かない可能性が複数あるので確認し、 おそらく、質問文でいうところの【① ユーザーが新たに入力した値を取得】に問題ありでした。 (確認したこと) >sql SETの記述を修正し、更新するデータは変数ではなく、文字列や整数で検証し、UPDATEできたためコード上はとりあえず成功 >ajax 通信先のupdate.phpに1をechoさせ、それをscriptを記述しているファイルでdataで受け取れりalertできたため通信も成功 >var変数について 無関係な別の文字や数値をvar変数に入れて通信したところ更新できました (質問文でいうところの【① ユーザーが新たに入力した値を取得】に問題あることが判明)
paccuman

2019/12/01 11:29

ブラウザで変更があった際にvalueを取得する7個のvarを、console.logで見ましたが全て正常に値が入ってました。 (すみません、【① ユーザーが新たに入力した値を取得】のソースコードにタイプミスがありました) ただ、この方法で値を代入したvarをajaxで送ろうとすると、また、ブラウザだけ更新される現象になってしまいます。 現状、ここが原因かと思うのですが、なぜこのようなことが起こるかわかりますでしょうか?
m.ts10806

2019/12/01 21:27

「ブラウザだけ更新」とはどういう挙動を想定された表現ですか?
paccuman

2019/12/02 07:54 編集

画面の情報は変わらず、ただF5を押したような挙動です。
guest

0

PHP は既に回答があるので JavaScript について。
function はスコープを形成するので変数は反映されず送信されていません。
https://developer.mozilla.org/ja/docs/Web/JavaScript/Reference/Functions

変更のたびに取得する理由もなさそうなので .ajax() の直前で取得すればいいでしょう。

投稿2019/12/02 02:46

x_x

総合スコア13749

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

paccuman

2019/12/02 09:36

ありがとうございます。 たしかに、function内なので外では呼び出せないのですね。。! ちなみに、.changeや.clickイベントの処理結果を戻り値として受け取ることで、 ajaxで送るデータとして活用できるようになると思っていますが、あっていますでしょうか? 調べてみたのですが明確な記述方法が見つからず、 returnの記述をどのように書けばよいかお判りでしょうか?
paccuman

2019/12/03 05:59

ありがとうございます。 整理してまた別の質問として投稿させていただきます。! また、よろしくお願いいたします。
guest

0

質問に CREATE TABLE文は提示しましょう。
SQLのところだけ、
理解し易いように改行しています。

SQL

1UPDATE articles SET 2 project = :project 3and url = :url 4and wire_url = :wire_url 5and page_name = :page_name 6and job = :job 7and style = :style 8and coment = :coment 9WHERE id = :id 1011UPDATE articles SET 12 project = :project 13 , url = :url 14 , wire_url = :wire_url 15 , page_name = :page_name 16 , job = :job 17 , style = :style 18 , coment = :coment 19WHERE id = :id

同じSQLでもデータベースやそのバージョンによって方言が大きいですから、どのデータベースを使うのかを質問のタグで示したり、バージョンも明記した方が適切なコメントが付き易いです。SQLの観点から Oracle Database, PostgreSQL, MySQL の特徴を整理しよう!

投稿2019/11/30 13:46

Orlofsky

総合スコア16417

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

paccuman

2019/12/01 10:19 編集

ありがとうございます。 修正し、とりあえず更新する情報は変数ではなく、仮の文字列や整数で検証し、 無事UPDATEすることができました! (mysqlのバージョンも追加しました)
guest

0

DBの更新がされず、ajax通信も成功しているのかが不明です。。。

上記に関してのみ。
ajax のデバッグでは、ブラウザの開発ツール使用して、リクエストとレスポンスを確認すると良いですよ。

投稿2019/12/02 00:13

退会済みユーザー

退会済みユーザー

総合スコア0

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

あなたの回答

tips

太字

斜体

打ち消し線

見出し

引用テキストの挿入

コードの挿入

リンクの挿入

リストの挿入

番号リストの挿入

表の挿入

水平線の挿入

プレビュー

15分調べてもわからないことは
teratailで質問しよう!

ただいまの回答率
85.36%

質問をまとめることで
思考を整理して素早く解決

テンプレート機能で
簡単に質問をまとめる

質問する

関連した質問