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

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

ただいまの
回答率

90.53%

  • PHP

    23558questions

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

  • JavaScript

    19922questions

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

  • Ajax

    1293questions

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

  • 非同期処理

    129questions

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

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

解決済

回答 3

投稿 編集

  • 評価
  • クリップ 0
  • VIEW 1,003
退会済みユーザー

退会済みユーザー

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

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

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

let stepY_count = 0;
let stepX_count = 0;
let step_count = 0;
let meet_count = 0;
let sum_count = 0;
let win_count = 0;
let appear_count = 0;
let revel_count = 1;
let stage;
let kazan = -1;
let mori = 2;
let heichi = 1;

class Enemy {
    constructor (name) {
        this.name = name;
    }
    ene1() {
        this.rand1 = 1 + Math.floor(Math.random()*100);
    }
    appear() {
        $("#result_area").append('<div>「' + enemy1.name + 'が現れた!」</div>');
    }
}

const enemy1 = new Enemy('デーモン');
enemy1.ene1();

class Yusha extends Enemy {
    status1() {
        this.number1 = 70;
    }
    status2() {
        this.number2 = 50;
    }
    win() {
        $("#result_area").append('<div>「勝った」</div>');
    }
    lose() {
        $("#result_area").append('<div>「負けた」</div>');
    }
    defeat() {
        $("#defeat_count").html("倒した敵の数:" + win_count);
    }
    process1() {
        $("#before,#left,#back,#right").prop("disabled",false);
    }
    process2() {
        $("#fight,#escape").prop("disabled",true);
    }
}

const yusha = new Yusha('勇者');
yusha.status1();
yusha.status2();

$("#fight,#escape").prop("disabled",true);
$(function(){
        $('#before,#back,#left,#right').off('click');
        $("#before,#back,#left,#right").on( 'click',() => {
            //スタートが押されたら初期化
            $("#start").on('click',() => {
                $("#result_area,#log_date").empty();
                $("#revel").html("LV:0");
                $("#stepY").html("歩数Y:0");
                $("#stepX").html("歩数X:0");
                $("#defeat_count").html("倒した敵の数:0");
                $("#appear_average").html("敵出現平均歩数:0");
                stepY_count = 0;
                stepX_count = 0;
                step_count = 0;
                meet_count = 0;
                sum_count = 0;
                win_count = 0;
                appear_count = 0;
                revel_count = 1;
                $("#image").attr("src","images/heichi.jpeg");
                yusha.process1();
                yusha.process2();
            });
            //ダンジョン切り替え
            step_count++;
            if ((step_count % 6 === 0) || (step_count % 7 === 0)|| (step_count % 8 === 0)|| (step_count % 9 === 0)){
                $("#image").attr("src","images/mori.jpeg");
                stage = mori;
            }
            else if ((step_count % 10 === 0) || (step_count % 11 === 0) || (step_count % 12 === 0)){
                $("#image").attr("src","images/kazan.jpeg");
                stage = kazan;
            }
            else {
                $("#image").attr("src","images/heichi.jpeg");
                stage = heichi;
            }
            //乱数生成
            let randnum =1 + Math.floor(Math.random()*3 + stage);
            meet_count++;
            sum_count++;
            //乱数と歩数が同じなら戦闘開始
            if (randnum === meet_count){
                $("#fight,#escape").prop("disabled",false);
                $("#before,#left,#back,#right").prop("disabled",true);
                appear_count++;
                $("#log_date").append("<div>" + sum_count + "歩目</div>");
                enemy1.appear()
                $("#image").attr("src","images/enemy.jpeg");
                let average = sum_count / appear_count;
                let rounding_average = average.toFixed(0);
                $("#appear_average").html("敵出現平均歩数:" + rounding_average);
                //戦うボタンが押されたら
                $("#fight").off('click');
                $("#fight").on('click',() => {
                    enemy1.ene1();
                    let win_or_lose = enemy1.rand1;
                    if (win_or_lose <= ( yusha.number1 + revel_count)){
                        yusha.win();
                        $("#image").attr("src","images/win.jpeg");
                        yusha.process1();
                        yusha.process2();
                        win_count++;
                        yusha.defeat();
                        if (win_count % 10 === 0){
                            revel_count++;
                            $("#revel").html("LV:" + revel_count);
                        }
                    }
                    if (win_or_lose >= ( yusha.number1 + revel_count + 1)){
                        yusha.lose();
                        $("#image").attr("src","images/lose.jpeg");
                        yusha.process1();
                        yusha.process2();
                    }
                });
                //逃げるボタンが押されたら
                $("#escape").off('click');
                $("#escape").on('click',() => {
                    enemy1.ene1();
                    let escape_result = enemy1.rand1;;
                    if (escape_result <= 0){
                        $("#result_area").append('<div>「逃げられた」</div>');
                        yusha.process1();
                        yusha.process2();
                    }
                    if (escape_result >= 1){
                        $("#result_area").append('<div>「逃げられない」</div>');
                        enemy1.ene1();
                        let end_result = enemy1.rand1;;
                        if (end_result <= ( yusha.number2 - revel_count)){
                            yusha.lose();
                            $("#result_area").append('<div>「' + yusha.name + 'は死んでしまった」</div>');
                            $("#image").attr("src","images/lose.jpeg");
                            yusha.process1();
                            yusha.process2();
                        }
                        if (end_result >= ( yusha.number2 - revel_count - 1)){
                            $("#image").attr("src","images/win.jpeg");
                            yusha.win();
                            $("#result_area").append('<div>「歩く方向を押してください」」</div>');
                            yusha.process1();
                            yusha.process2();
                            win_count++;
                            yusha.defeat();
                            if (win_count % 10 === 0){
                                revel_count++;
                                $("#revel").html("LV:" + revel_count);
                            }
                        }
                    }
                });
            }
            //歩数が乱数を超えたら
            if (randnum < meet_count){
                meet_count = 0;
            }
        });
});

//歩数Y,Xをカウント、出力
    $(function(){
        $("#before,#back").on( 'click',() => {
            stepY_count++;
            $("#stepY").html("歩数Y:" + stepY_count);
        });
        $("#left,#right").on( 'click',() => {
            stepX_count++;
            $("#stepX").html("歩数X:" + stepX_count);
        });
    });


//非同期通信
$(function () {
    $("#ranking").on("click",function(){
        alert("a");
        $.ajax({
            type: "POST",
            url:"ajax_return.php",
            data: {"win_count":win_count,"step_count":step_count}
        });
    });
});
<?php
$win_count = $_POST['win_count'];
$step_count = $_POST['step_count'];
echo $win_count;
echo $step_count;
?>

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

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

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

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

    クリップを取り消します

  • 良い質問の評価を上げる

    以下のような質問は評価を上げましょう

    • 質問内容が明確
    • 自分も答えを知りたい
    • 質問者以外のユーザにも役立つ

    評価が高い質問は、TOPページの「注目」タブのフィードに表示されやすくなります。

    質問の評価を上げたことを取り消します

  • 評価を下げられる数の上限に達しました

    評価を下げることができません

    • 1日5回まで評価を下げられます
    • 1日に1ユーザに対して2回まで評価を下げられます

    質問の評価を下げる

    teratailでは下記のような質問を「具体的に困っていることがない質問」、「サイトポリシーに違反する質問」と定義し、推奨していません。

    • プログラミングに関係のない質問
    • やってほしいことだけを記載した丸投げの質問
    • 問題・課題が含まれていない質問
    • 意図的に内容が抹消された質問
    • 広告と受け取られるような投稿

    評価が下がると、TOPページの「アクティブ」「注目」タブのフィードに表示されにくくなります。

    質問の評価を下げたことを取り消します

    この機能は開放されていません

    評価を下げる条件を満たしてません

    評価を下げる理由を選択してください

    詳細な説明はこちら

    上記に当てはまらず、質問内容が明確になっていない質問には「情報の追加・修正依頼」機能からコメントをしてください。

    質問の評価を下げる機能の利用条件

    この機能を利用するためには、以下の事項を行う必要があります。

質問への追記・修正、ベストアンサー選択の依頼

  • mts10806

    2018/04/11 19:25

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

    キャンセル

  • 退会済みユーザー

    退会済みユーザー

    2018/04/11 19:29

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

    キャンセル

  • 退会済みユーザー

    退会済みユーザー

    2018/04/11 19:31

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

    キャンセル

回答 3

+2

Notice: Undefined index: win_count

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

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

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

$win_count = filter_input(INPUT_POST,'win_count');
$step_count = filter_input(INPUT_POST,'step_count');
echo $win_count;
echo $step_count;

投稿

  • 回答の評価を上げる

    以下のような回答は評価を上げましょう

    • 正しい回答
    • わかりやすい回答
    • ためになる回答

    評価が高い回答ほどページの上位に表示されます。

  • 回答の評価を下げる

    下記のような回答は推奨されていません。

    • 間違っている回答
    • 質問の回答になっていない投稿
    • スパムや攻撃的な表現を用いた投稿

    評価を下げる際はその理由を明確に伝え、適切な回答に修正してもらいましょう。

  • 2018/04/11 19:32

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

    キャンセル

  • 2018/04/11 19:56

    そのNoticeをどこでどうやって取得したのか書かれたほうが良いかと。

    キャンセル

  • 2018/04/12 10:16

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

    キャンセル

checkベストアンサー

+1

持って来られてるかの確認で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ファイルを自分で作って変数を保管とかすると良いです。

//いきなり$_POST参照ではなくREQUEST_METHODを確認してpostの場合のみ処理をした方が良い

//ログファイル出力例。できればブラウザから参照できない場所に作ってください
file_put_contents("log".date("Ymd").".log","[".date("Y/m/d H:i:s")."]:ajax-post:".json_encode($_POST),FILE_APPEND);

$win_count = $_POST['win_count'];
$step_count = $_POST['step_count'];

//あとこの部分は連続でechoするのではなく、配列などでまとめてjson_encode()し、javascript側ではdataType:json で受け取ったほうが良いです。
echo $win_count;
echo $step_count;

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

投稿

編集

  • 回答の評価を上げる

    以下のような回答は評価を上げましょう

    • 正しい回答
    • わかりやすい回答
    • ためになる回答

    評価が高い回答ほどページの上位に表示されます。

  • 回答の評価を下げる

    下記のような回答は推奨されていません。

    • 間違っている回答
    • 質問の回答になっていない投稿
    • スパムや攻撃的な表現を用いた投稿

    評価を下げる際はその理由を明確に伝え、適切な回答に修正してもらいましょう。

  • 2018/04/12 10:43

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

    キャンセル

  • 2018/04/12 10:45

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

    キャンセル

  • 2018/04/12 13:18

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

    キャンセル

  • 2018/04/12 13: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 13:28

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

    キャンセル

  • 2018/04/12 13:40

    いえ違います。
    postで送ったらPHPであろうとなんであろうとpostです。

    ma-さんがNoticeを確認できたのは「ajax_return.phpをブラウザで開いた」からですよね。
    その時点でajaxでpost送信とか全く関係なく、getとして処理されるというだけです。PHPだからではありません。

    ajaxは画面を動かすことなく、裏側でサーバー側のプログラム言語(今回はPHP)を実行するものです。
    ajax送信先のURLを開いてもただ単にページを開いただけでajaxでも何でもありません。

    「logファイルには値が入ってました。」とのことなので、元々、何の問題も発生していなかったことになります。
    間違っていたのは、「ajaxで送信された情報の確認の仕方」です。

    キャンセル

  • 2018/04/12 14:17

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

    キャンセル

  • 2018/04/12 14:21

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

    キャンセル

  • 2018/04/12 16:22

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

    キャンセル

  • 2018/04/12 16:26

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

    キャンセル

  • 2018/04/12 16:28

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

    キャンセル

  • 2018/04/12 18:16

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

    キャンセル

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/12 00:11

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

    キャンセル

同じタグがついた質問を見る

  • PHP

    23558questions

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

  • JavaScript

    19922questions

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

  • Ajax

    1293questions

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

  • 非同期処理

    129questions

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