質問をすることでしか得られない、回答やアドバイスがある。

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

新規登録して質問してみよう
ただいま回答率
85.50%
PHP

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

JavaScript

JavaScriptは、プログラミング言語のひとつです。ネットスケープコミュニケーションズで開発されました。 開発当初はLiveScriptと呼ばれていましたが、業務提携していたサン・マイクロシステムズが開発したJavaが脚光を浴びていたことから、JavaScriptと改名されました。 動きのあるWebページを作ることを目的に開発されたもので、主要なWebブラウザのほとんどに搭載されています。

非同期処理

非同期処理とは一部のコードを別々のスレッドで実行させる手法です。アプリケーションのパフォーマンスを向上させる目的でこの手法を用います。

Ajax

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

Q&A

解決済

3回答

2360閲覧

Ajaxでjsからphpに値をPOSTしたい

退会済みユーザー

退会済みユーザー

総合スコア0

PHP

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

JavaScript

JavaScriptは、プログラミング言語のひとつです。ネットスケープコミュニケーションズで開発されました。 開発当初はLiveScriptと呼ばれていましたが、業務提携していたサン・マイクロシステムズが開発したJavaが脚光を浴びていたことから、JavaScriptと改名されました。 動きのあるWebページを作ることを目的に開発されたもので、主要なWebブラウザのほとんどに搭載されています。

非同期処理

非同期処理とは一部のコードを別々のスレッドで実行させる手法です。アプリケーションのパフォーマンスを向上させる目的でこの手法を用います。

Ajax

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

0グッド

0クリップ

投稿2018/04/11 08:23

編集2018/04/12 01:13

JSの変数の値を、PHPに渡したいと思いajaxを利用してます。

エラーで、Notice: Undefined index: win_count と出てしまい、うまく値が渡せていないようです。

書き方など間違って入れば教えていただけると助かります。

JS

1let stepY_count = 0; 2let stepX_count = 0; 3let step_count = 0; 4let meet_count = 0; 5let sum_count = 0; 6let win_count = 0; 7let appear_count = 0; 8let revel_count = 1; 9let stage; 10let kazan = -1; 11let mori = 2; 12let heichi = 1; 13 14class Enemy { 15 constructor (name) { 16 this.name = name; 17 } 18 ene1() { 19 this.rand1 = 1 + Math.floor(Math.random()*100); 20 } 21 appear() { 22 $("#result_area").append('<div>「' + enemy1.name + 'が現れた!」</div>'); 23 } 24} 25 26const enemy1 = new Enemy('デーモン'); 27enemy1.ene1(); 28 29class Yusha extends Enemy { 30 status1() { 31 this.number1 = 70; 32 } 33 status2() { 34 this.number2 = 50; 35 } 36 win() { 37 $("#result_area").append('<div>「勝った」</div>'); 38 } 39 lose() { 40 $("#result_area").append('<div>「負けた」</div>'); 41 } 42 defeat() { 43 $("#defeat_count").html("倒した敵の数:" + win_count); 44 } 45 process1() { 46 $("#before,#left,#back,#right").prop("disabled",false); 47 } 48 process2() { 49 $("#fight,#escape").prop("disabled",true); 50 } 51} 52 53const yusha = new Yusha('勇者'); 54yusha.status1(); 55yusha.status2(); 56 57$("#fight,#escape").prop("disabled",true); 58$(function(){ 59 $('#before,#back,#left,#right').off('click'); 60 $("#before,#back,#left,#right").on( 'click',() => { 61 //スタートが押されたら初期化 62 $("#start").on('click',() => { 63 $("#result_area,#log_date").empty(); 64 $("#revel").html("LV:0"); 65 $("#stepY").html("歩数Y:0"); 66 $("#stepX").html("歩数X:0"); 67 $("#defeat_count").html("倒した敵の数:0"); 68 $("#appear_average").html("敵出現平均歩数:0"); 69 stepY_count = 0; 70 stepX_count = 0; 71 step_count = 0; 72 meet_count = 0; 73 sum_count = 0; 74 win_count = 0; 75 appear_count = 0; 76 revel_count = 1; 77 $("#image").attr("src","images/heichi.jpeg"); 78 yusha.process1(); 79 yusha.process2(); 80 }); 81 //ダンジョン切り替え 82 step_count++; 83 if ((step_count % 6 === 0) || (step_count % 7 === 0)|| (step_count % 8 === 0)|| (step_count % 9 === 0)){ 84 $("#image").attr("src","images/mori.jpeg"); 85 stage = mori; 86 } 87 else if ((step_count % 10 === 0) || (step_count % 11 === 0) || (step_count % 12 === 0)){ 88 $("#image").attr("src","images/kazan.jpeg"); 89 stage = kazan; 90 } 91 else { 92 $("#image").attr("src","images/heichi.jpeg"); 93 stage = heichi; 94 } 95 //乱数生成 96 let randnum =1 + Math.floor(Math.random()*3 + stage); 97 meet_count++; 98 sum_count++; 99 //乱数と歩数が同じなら戦闘開始 100 if (randnum === meet_count){ 101 $("#fight,#escape").prop("disabled",false); 102 $("#before,#left,#back,#right").prop("disabled",true); 103 appear_count++; 104 $("#log_date").append("<div>" + sum_count + "歩目</div>"); 105 enemy1.appear() 106 $("#image").attr("src","images/enemy.jpeg"); 107 let average = sum_count / appear_count; 108 let rounding_average = average.toFixed(0); 109 $("#appear_average").html("敵出現平均歩数:" + rounding_average); 110 //戦うボタンが押されたら 111 $("#fight").off('click'); 112 $("#fight").on('click',() => { 113 enemy1.ene1(); 114 let win_or_lose = enemy1.rand1; 115 if (win_or_lose <= ( yusha.number1 + revel_count)){ 116 yusha.win(); 117 $("#image").attr("src","images/win.jpeg"); 118 yusha.process1(); 119 yusha.process2(); 120 win_count++; 121 yusha.defeat(); 122 if (win_count % 10 === 0){ 123 revel_count++; 124 $("#revel").html("LV:" + revel_count); 125 } 126 } 127 if (win_or_lose >= ( yusha.number1 + revel_count + 1)){ 128 yusha.lose(); 129 $("#image").attr("src","images/lose.jpeg"); 130 yusha.process1(); 131 yusha.process2(); 132 } 133 }); 134 //逃げるボタンが押されたら 135 $("#escape").off('click'); 136 $("#escape").on('click',() => { 137 enemy1.ene1(); 138 let escape_result = enemy1.rand1;; 139 if (escape_result <= 0){ 140 $("#result_area").append('<div>「逃げられた」</div>'); 141 yusha.process1(); 142 yusha.process2(); 143 } 144 if (escape_result >= 1){ 145 $("#result_area").append('<div>「逃げられない」</div>'); 146 enemy1.ene1(); 147 let end_result = enemy1.rand1;; 148 if (end_result <= ( yusha.number2 - revel_count)){ 149 yusha.lose(); 150 $("#result_area").append('<div>「' + yusha.name + 'は死んでしまった」</div>'); 151 $("#image").attr("src","images/lose.jpeg"); 152 yusha.process1(); 153 yusha.process2(); 154 } 155 if (end_result >= ( yusha.number2 - revel_count - 1)){ 156 $("#image").attr("src","images/win.jpeg"); 157 yusha.win(); 158 $("#result_area").append('<div>「歩く方向を押してください」」</div>'); 159 yusha.process1(); 160 yusha.process2(); 161 win_count++; 162 yusha.defeat(); 163 if (win_count % 10 === 0){ 164 revel_count++; 165 $("#revel").html("LV:" + revel_count); 166 } 167 } 168 } 169 }); 170 } 171 //歩数が乱数を超えたら 172 if (randnum < meet_count){ 173 meet_count = 0; 174 } 175 }); 176}); 177 178//歩数Y,Xをカウント、出力 179 $(function(){ 180 $("#before,#back").on( 'click',() => { 181 stepY_count++; 182 $("#stepY").html("歩数Y:" + stepY_count); 183 }); 184 $("#left,#right").on( 'click',() => { 185 stepX_count++; 186 $("#stepX").html("歩数X:" + stepX_count); 187 }); 188 }); 189 190 191//非同期通信 192$(function () { 193 $("#ranking").on("click",function(){ 194 alert("a"); 195 $.ajax({ 196 type: "POST", 197 url:"ajax_return.php", 198 data: {"win_count":win_count,"step_count":step_count} 199 }); 200 }); 201}); 202

php

1<?php 2$win_count = $_POST['win_count']; 3$step_count = $_POST['step_count']; 4echo $win_count; 5echo $step_count; 6?>

追記致しました。このようなjsのファイルがありました。とりあえずPHPに値
持って来られてるかの確認でPHPファイルでechoを出してみたところNotice: Undefined index: win_count in~
Notice: Undefined index: step_count in ~
というエラーが出ています。

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

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

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

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

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

m.ts10806

2018/04/11 08:29

javascript側でwin_count,step_count はどのように設定されているのでしょうか。
退会済みユーザー

退会済みユーザー

2018/04/11 08:34

let win_count = 0; let step_count = 0; と宣言しfunction関数の中でwin_count++;とカウントして表示させてます。
m.ts10806

2018/04/11 10:25

その辺りも追記していただけますか?また、phpでechoされてますが、javascript側で受け取る処理が書かれていません。どのような経緯・目的をもってこのコードを書かれたのでしょうか?
退会済みユーザー

退会済みユーザー

2018/04/11 10:29

簡単な一人称のゲームみたいなものを作っていて、JSの値をPHPにPOSTしてデータベースにいれたいと思いこのようなコードを書きました。
退会済みユーザー

退会済みユーザー

2018/04/11 10:31

ユーザーのランキング的なものを作ろうと思いまして、、、
guest

回答3

0

Notice: Undefined index: win_count

がでてるのを見ると、ajax_return.php側の参照エラーですよね?

$.ajax({・・・}).done(function(data){console.log(data));
のような確認をしてないのにどうやってNoticeを得ているのでしょうか?

とりあえず$_POSTのデータを直接参照せずに、filter_inputすれば
少しはわかりやすくなるかもしれません

PHP

1$win_count = filter_input(INPUT_POST,'win_count'); 2$step_count = filter_input(INPUT_POST,'step_count'); 3echo $win_count; 4echo $step_count;

投稿2018/04/11 09:27

yambejp

総合スコア114572

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

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

退会済みユーザー

退会済みユーザー

2018/04/11 10:32

Noticeが出てるのはよくわかりません…。 試してみます!回答ありがとうございました。
m.ts10806

2018/04/11 10:56

そのNoticeをどこでどうやって取得したのか書かれたほうが良いかと。
退会済みユーザー

退会済みユーザー

2018/04/12 01:16

JSでボタンをクリックしたらajax_return.phpに値をPOSTして渡すという処理にしようと思いました。ajax_return.phpでのこのようなエラーが出ています
guest

0

ベストアンサー

持って来られてるかの確認でPHPファイルでechoを出してみたところNotice: Undefined index: win_count in~

Notice: Undefined index: step_count in ~

$_POSTはformからmethod=postで送信されたときか、ajaxでpostで送信されたときしか情報は入ってきません。
単にそのPHPを開いた状態ではモード的にはgetです。postではないので$_POSTはnullですね(もしくは空配列)
中身がない配列を参照しようとしているので質問にあるNoticeが出力されます。

もしajaxで送信した値が正常にきているか確認したければ file_put_contents()などでLogファイルを自分で作って変数を保管とかすると良いです。

php

1//いきなり$_POST参照ではなくREQUEST_METHODを確認してpostの場合のみ処理をした方が良い 2 3//ログファイル出力例。できればブラウザから参照できない場所に作ってください 4file_put_contents("log".date("Ymd").".log","[".date("Y/m/d H:i:s")."]:ajax-post:".json_encode($_POST),FILE_APPEND); 5 6$win_count = $_POST['win_count']; 7$step_count = $_POST['step_count']; 8 9//あとこの部分は連続でechoするのではなく、配列などでまとめてjson_encode()し、javascript側ではdataType:json で受け取ったほうが良いです。 10echo $win_count; 11echo $step_count; 12

あと、適当に思うところをコメントしといたので今後の参考にしてください。

投稿2018/04/12 01:18

編集2018/04/12 01:27
m.ts10806

総合スコア80765

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

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

退会済みユーザー

退会済みユーザー

2018/04/12 01:43

全然理解できてなかったようです。 詳しくありがとうございます。勉強し直します。
m.ts10806

2018/04/12 01:45

ひとつひとつ着実に身につけていけば良いと思います。 何かしら掴めれば成長は早いですよ。
退会済みユーザー

退会済みユーザー

2018/04/12 04:18

回答でPOSTではなくGETとのことですが、どのようにPOSTで渡せばいいのですか?
m.ts10806

2018/04/12 04:27

おそらくこちらの伝え方が悪かったのかもしれませんが、 「単にページを開いただけではGET」というだけで、本来伝えたいことは 「AjaxでPOSTされた中身を確認したい場合は、Ajaxで実行するページをブラウザでそのまま開くのではなく、ログファイルなどに書き出して確認しましょう」ということです。 既にajaxをtype:POSTで送信されていますよね?その時点でPOSTで送信されています。 確認するにはログファイルなどに書き出してください。(ここまでは回答そのまま。ログファイルに書き出すサンプルコードも回答にあります) もしくは、ajax実行結果を受け取るように書いて確認してください。 php echo "win_count:".$win_count."|"; echo "step_count:". $step_count; javascript $.ajax({ type: "POST", url:"ajax_return.php", data: {"win_count":win_count,"step_count":step_count}, }) .done(function(data) { console.log(data); //ここでブラウザ開発ツールのコンソールに渡した情報が出力されるはず });
退会済みユーザー

退会済みユーザー

2018/04/12 04:28

postで送っても、PHPではget扱いされてるということですかね。全然わかってなくてすいません。logファイルには値が入ってました。
m.ts10806

2018/04/12 04:40

いえ違います。 postで送ったらPHPであろうとなんであろうとpostです。 ma-さんがNoticeを確認できたのは「ajax_return.phpをブラウザで開いた」からですよね。 その時点でajaxでpost送信とか全く関係なく、getとして処理されるというだけです。PHPだからではありません。 ajaxは画面を動かすことなく、裏側でサーバー側のプログラム言語(今回はPHP)を実行するものです。 ajax送信先のURLを開いてもただ単にページを開いただけでajaxでも何でもありません。 「logファイルには値が入ってました。」とのことなので、元々、何の問題も発生していなかったことになります。 間違っていたのは、「ajaxで送信された情報の確認の仕方」です。
退会済みユーザー

退会済みユーザー

2018/04/12 05:17

なるほど!やっと理解できました。事細かくありがとうございます。
m.ts10806

2018/04/12 05:21

ご理解いただけたようで幸いです。 確かにその辺り、私も最初の頃はピンと来なかったものでした。 「人が理解できるように説明できると、自分がちゃんと理解していることになる」 というのがどこかで聞いたことがあるかもしれません。 誰かに説明できるような日がくるといいですね。
退会済みユーザー

退会済みユーザー

2018/04/12 07:22

解決済みにした後に度々すいません。この値をデータベースに入れるにはどうすればいいのでしょうか。ajaxで取って来た値を、PHP側の変数に入れられればと思うのですが、、、
m.ts10806

2018/04/12 07:26

データベースにいれる処理を書いてください。 $_POST自体PHPの変数ですし、ajaxで想定通りの情報が渡せているのが確認できたら、あとはPHPの仕事なので、 PHPで好きに煮るなり焼くなりなんなり
m.ts10806

2018/04/12 07:28

別件になると思いますので、データベースに情報をいれる処理を書いてみて、また何かあれば質問あげてください。 データベースにいれる処理こそ調べれば幾らでも優良な記事は溢れてます(特にQiitaで沢山支持を獲得している記事を読むといいです)
退会済みユーザー

退会済みユーザー

2018/04/12 09:16

データベースに入れられました!!本当に感謝です!!ありがとうございました!!
guest

0

$('#ranking').on('click',function(){ $.ajax({ url:'ajax_return.php', type:'POST', dataType:'json', data:{"win_count":win_count,"step_count":step_coun} }) .done(function(data){ console.log(data); }) });

dataType:'json'が明記されていないのでPHP側で受け取れていないような気がしますね。
あとエラーの切り分けをするためにdone()をくっつけてあげましょう

投稿2018/04/11 15:08

wp-h

総合スコア135

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

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

退会済みユーザー

退会済みユーザー

2018/04/11 15:11

結果をJSON形式で返しているわけじゃないので、dataType を 'json' に設定してもエラーになりますよ。
guest

あなたの回答

tips

太字

斜体

打ち消し線

見出し

引用テキストの挿入

コードの挿入

リンクの挿入

リストの挿入

番号リストの挿入

表の挿入

水平線の挿入

プレビュー

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

ただいまの回答率
85.50%

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

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

質問する

関連した質問