前提・実現したいこと

phpでonclickに数字２つをjavascriptに送ってajaxで指定のurlにpostを送ろうとする処理を作っています
ajaxでpostを送信して成功することができたのですが、なぜかpostが送られていませんでした

なぜpostが送られていないのでしょうか

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

Notice: Undefined index: human in /.../ReservationConfirmation.php on line 51

Notice: Undefined index: in /.../ReservationConfirmation.php on line 51

Notice: Undefined index: price in /.../ReservationConfirmation.php on line 52

該当のソースコード

main.php

php
1<body>
2    <form method="post" action="main.php">
3      <table id="pr">
4      <?php 
5        for($i = 1; $i <= 5; $i++){
6          echo "<tr id='line" . $i . "'>";
7          if($i == 1){
8            echo "<td id='people" . $i . "' class='people'><button type='button' class='select active' name='rate' onclick='window.rateChange(" . ($i-1) . ")'><img src='" . $imgsrc[$i-1] . "'></button></td>";
9            for($j = 1; $j <= 5; $j++){
10              $index = ($i-1) * 5 + $j;
11              $sumprice[$index-1] = $price[$index-1];
12              $ticket = 1;
13              echo "<td id='price" . $index . "' class='price'><input type='button' id='prva" . $index . "' value='" . $sumprice[$index-1] . "' onclick='reserConfir(" . ($i-1) . "," . ($index-1) . ")'></td>";
14            }
15          }else{
16            echo "<td id='people" . $i . "' class='people'><button type='button' class='select' name='rate' onclick='window.rateChange(" . ($i-1) . ")'><img src='" . $imgsrc[$i-1] . "'></button></td>";
17            for($j = 1; $j <= 5; $j++){
18              $index = ($i-1) * 5 + $j;
19              $sumprice[$index-1] = $price[$index-1];
20              $ticket = 1;
21              echo "<td id='price" . $index . "' class='price'><input type='button' id='prva" . $index . "' value='" . $sumprice[$index-1] . "' onclick='reserConfir(" . ($i-1) . "," . ($index-1) . ")'></td>";
22            }
23          }
24          echo "</tr>";
25        }
26      ?>
27        <tr id="line6">
28          <td id="people6" class="people"><button type="button" class="select" name="rate" onclick="window.rateChange(5)"><img src="img/AdultChild2.png"></button></td>
29        </tr>
30        <tr id="line7">
31          <td id="people7" class="people"><button type="button" class="select" name="rate" onclick="window.rateChange(6)"><img src="img/Child.png"></button></td>
32        </tr>
33        <tr id="line8">
34          <td id="people8" class="people"><button type="button" class="select" name="rate" onclick="window.rateChange(7)"><img src="img/Child2.png"></button></td>
35        </tr>
36      </table>
37    </form>
38  </div>
39</body>
40</html>
41<?php
42  }else{
43    header('Location: login.php');
44  }
45?>
46<script>
47//クリックした時
48var price = <?php echo json_encode($price); ?>;
49var sumprice = <?php echo json_encode($sumprice); ?>;
50var ticket = <?php echo json_encode($ticket); ?>;
51var img = $('.select');
52function rateChange(rc){
53  console.log('通った' + rc);
54  for(var i=0; i<25; i++){
55    switch(rc){
56      case 0:
57        sumprice[i] = price[i] * 1;
58        ticket = 1;
59        break;
60      case 1:
61        sumprice[i] = price[i] * 2;
62        ticket = 2;
63        break;
64      case 2:
65        sumprice[i] = price[i] * 3;
66        ticket = 3;
67        break;
68      case 3:
69        sumprice[i] = price[i] * 1 + Math.floor(price[i] / 20) * 10;
70        ticket = 2;
71        break;
72      case 4:
73        sumprice[i] = price[i] * 2 + Math.floor(price[i] / 20) * 10;
74        ticket = 3;
75        break;
76      case 5:
77        sumprice[i] = price[i] * 1 + Math.floor(price[i] / 20) * 10 * 2;
78        ticket = 3;
79        break;
80      case 6:
81        sumprice[i] = Math.floor(price[i] / 20) * 10;
82        ticket = 1;
83        break;
84      case 7:
85        sumprice[i] = Math.floor(price[i] / 20) * 10 * 2;
86        ticket = 2;
87        break;
88      default:
89        sumprice[i] = 666;
90        break;
91    }
92    console.log('for');
93    $("#prva" + (i+1) + "").val(sumprice[i]);
94  }
95}
96img.click(function(){
97  img.removeClass('active');
98  $(this).addClass('active');
99});
100function reserConfir(human,index){
101  //ajax送信
102  $.ajax({
103    type : "POST",
104    //ajaxが適切なcontentTypeに自動変換するのを防ぐ
105    contentType: false,
106    //データを文字列に自動変換するのを防ぐ
107    processData: false,
108    url : "./ReservationConfirmation.php",
109    data : {human:human, price:sumprice[index]},
110    error : function(XMLHttpRequest, textStatus, errorThrown) {
111      console.log(XMLHttpRequest + " : " + textStatus + " : " + errorThrown);
112    },
113    success : function(response) {
114      console.log("ajax通信に成功しました" + response);
115      document.write(response)
116    }
117  });
118}

ReservationConfirmation.php

php
1<?php
2  $human = array (
3      "大人１人","大人２人","大人３人","大人１人小人１人","大人２人小人１人","大人１人小人２人","小人１人","小人２人"
4  );
5  if(!isset($_SESSION)){ 
6    session_start();
7  }  
8  if(isset($_SESSION['id'])){
9    $DBManager = new DBManager();
10    $Data = $DBManager->getUserInfoTblByUserID($_SESSION['id']);
11    if(isset($_POST['logout'])){
12      logout();
13    }
14    if(isset($_POST['answer'])){
15      switch($_POST['answer']){
16        case "はい":
17        case "いいえ":
18          header('Location: main.php');
19          break;
20        default:
21          break;
22      }
23    }
24?>
25<html>
26<head>
27  <meta http-equiv="Content -Type" content="text/html;charset=UTF-8">
28  <title>完了画面</title>
29  <script type="text/javascript" src="./js/jquery.min.js"></script>
30  <script type="text/javascript" src="./js/jquery-3.0.0.min.js"></script>
31  <script type="text/javascript" src="./js/jquery-ui.min.js"></script>
32  <link rel="stylesheet" href="css/main.css">
33</head>
34<body>
35    <div id="header">
36      <div id="text">切符予約</div>
37      <div id="text2">予約したい希望の切符を選んでください</div>
38    </div>
39    <div id="account">
40      <div id="user_name"><?php echo $_SESSION['id'] . "様"; ?></div>
41      <form method="post" action="ReservationConfirmation.php">
42        <input type="submit" name="information" value="顧客情報">
43        <input type="submit" name="logout" value="ログアウト">
44      </form>
45    </div>
46    <form method="post" action="ReservationConfirmation.php">
47    <div id="confirmation">
48      <div id="text3">こちらの内容で予約しますか？</div>
49      <div id="humam"><?php echo $human[$_POST['human']]; ?></div>
50      <div id="sumprice"><?php echo $_POST['price']; ?></div>
51      <div id="yes"><input type="submit" name="answer" value="はい"></div>
52      <div id="no"><input type="submit" name="answer" value="いいえ"></div>
53</body>
54</html>
55<?php
56  }else{
57    header('Location: login.php');
58  }
59?>

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

XAMPP for Windows 5.6.19

x_x

2018/11/30 04:24

「送信して成功することができた」「送られていませんでした」というのはどのように確認したのでしょうか？

行動規範の内容に同意します

回答2件

ajaxの成功時のdocument.write(response)はまずくないですか？
console.logなどバックグラウンドにデータを吐いてみて下さい

調整

javascript
1function reserConfir(human,index){
2  var fd=new FormData();
3  fd.append("human",human);
4  fd.append("price",sumprice[index]);
5  console.log(...fd);
6  $.ajax({
7    type : "POST",
8    contentType: false,
9    processData: false,
10    url : "./ReservationConfirmation.php",
11    data : fd,
12  }).done(function(response) {
13      console.log("ajax通信に成功しました" + response);
14      document.write(response);
15  }).fail(function(xhr, err){
16    console.log(err);
17  });
18}

投稿2018/11/30 04:48

編集2018/12/03 02:35

yambejp

総合スコア114825

rms398

2018/12/03 01:30

吐いてみた結果も上記のPOSTの'human' 'price'がないというエラーです javascriptで送ったpostを利用して値段や購入人数状態を表示して予約確認の画面を出さなければならないのですがajaxでは無理なのでしょうか？

yambejp

2018/12/03 01:47

$.ajax()の実行される１行前に、console.log(human)、console.log(sumprice[index])などで想定されたデータが設定されているか確認してくださいここでうけとれてなければ当然postされることはありません

rms398

2018/12/03 02:14

データはちゃんと入っていましたデータの受け渡すときのdata : {human:human, price:sumprice[index]},という書き方がよくないんでしょうか？

yambejp

2018/12/03 02:36

dataにformdataを利用してみてください。調整版を追記しておきました

rms398

2018/12/03 04:30

そういえば、前の開発でformdata使っていたことがありました postが遅れていなかったのはそういうことだったんですねあと、他の回答者様の助言でajax以外の方法で無事送信できましたので ajaxの件は今後の開発でformdataを利用することを頭の隅に置いておきます

行動規範の内容に同意します

ベストアンサー

ajaxは基本的に画面に対してリクエストを送る仕組みではないので送信先の画面で確認という手段にはなりませんよ。
リクエストを受け取ったらレスポンスデータを例えばjson形式などで返すようにして送信元のJavaScriptで受けとるだけです。
送信先phpに届いたかどうかは実行時にログファイルに書き出して実行後に確認とかになります。

投稿2018/11/30 05:43

m.ts10806

総合スコア80850

rms398

2018/12/03 01:28

json形式にしてpostを送ってもやはり送った先のpostが空の状態でしたまたajax以外で送るとしてもsubmitですと、valueを複数持たせることができませんし、”値段設定数”のようにsplitで" "に分けるにしても表示させたいのは値段だけですからどうしようもないです

m.ts10806

2018/12/03 01:31

＞ajax以外で送るとしてもsubmitですと、valueを複数持たせることができませんしどういう形を想定してるのでしょうか。ちょっと意味がわかりません。

m.ts10806

2018/12/03 01:32

「ajaxは画面に対してリクエストを送る仕組みではない」というところはりかいされたのでしょうか。

rms398

2018/12/03 01:42

input type=submitでvalue=値段,購入人数状態みたいに複数もたせることができますでしょうか？という意味です＞「ajaxは画面に対してリクエストを送る仕組みではない」 ajaxを使って裏でurl先のphpで処理する機能を作った頃はちゃんとpostを送ることができたことがありました画面で表示する際はPOSTが空という扱いで表示されるけど実際には送れているということでしょうか

m.ts10806

2018/12/03 02:15 編集

> input type=submitでvalue=値段,購入人数状態みたいに複数もたせることができますでしょうか？という意味です幾らでも方法はありますよ。hidden作っておくとか、配列で持たせるとか。 > ajaxを使って裏でurl先のphpで処理する機能を作った頃はちゃんとpostを送ることができたことがありましたまあ送るのはそれでも良いですが、裏で実行されてるので画面表示関係ないということだけです。逆にレスポンスデータ以外のHTMLとか色々あることで不具合が起きる可能性も高いというだけですね。 > 画面で表示する際はPOSTが空という扱いで表示されるけど実際には送れているということでしょうか画面表示した時点で「POST」ないですよね。「送信した」「送信した先の画面を開いた」ではないです。「送信したら送信先の画面にリクエストを送る」なので。最初に表示されているエラー、ajaxで送ってからわざわざ送信先の画面別で開いてませんか？それだと送れていないのは当然です。画面を自分で開いているんですから。 yambejpさんのコメントにあるように送る直前でconsole.log()確認して値があるのでしたらajaxで送られてはいるはずです。私の回答の後半にあるように$_POSTの内容をログファイルに書き出すように組んでみてください。繰り返しますがajax送信先の画面を「自分でURL打って開く」ことはありえません。

rms398

2018/12/03 04:26

>幾らでも方法はありますよ。hidden作っておくとか、配列で持たせるとか。 input type=submitは他のinputも送信してくれることに失念していました hiddenで持たせることで無事送信することができました！またajaxの件も理解しました

m.ts10806

2018/12/03 04:37

解決されたようで何よりです。

行動規範の内容に同意します

あなたの回答