回答編集履歴

2

追記

2018/03/06 06:30

投稿

kszk311
kszk311

スコア3404

test CHANGED
@@ -11,3 +11,111 @@
11
11
 
12
12
 
13
13
  一度、JSONファイルを生成する処理だけのファイルを作成し、そのファイル(URL)にアクセスして確認して見るのがいいと思います。
14
+
15
+
16
+
17
+ 1ファイルのみで実装する場合
18
+
19
+ ---
20
+
21
+ とりあえず、1ファイルのみで実装する場合のサンプルを追記しておきます。
22
+
23
+ HTMLを出力する前に、JSON形式で出力して、そこでPHP終えておく必要があります。
24
+
25
+
26
+
27
+ ```php
28
+
29
+ <?php
30
+
31
+
32
+
33
+ if(!empty($_POST)){
34
+
35
+
36
+
37
+ echo json_encode($_POST);
38
+
39
+ exit();
40
+
41
+ }
42
+
43
+
44
+
45
+ ?><!doctype html>
46
+
47
+ <html>
48
+
49
+ <head>
50
+
51
+ <meta charset="UTF-8">
52
+
53
+ <title>Sample</title>
54
+
55
+ <script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
56
+
57
+ <script type="text/javascript">
58
+
59
+ $(function(){
60
+
61
+ $('#submit').click(function(e){
62
+
63
+ e.preventDefault();
64
+
65
+
66
+
67
+ $.ajax({
68
+
69
+ url:'<?php echo $_SERVER['REQUEST_URI']; ?>', // 通信先のURL
70
+
71
+ type:'POST', // 使用するHTTPメソッド (GET/ POST)
72
+
73
+ data:$("#form1").serialize(), // 送信するデータ
74
+
75
+ dataType:'json', // 応答のデータの種類
76
+
77
+ // (xml/html/script/json/jsonp/text)
78
+
79
+ timeout:1000, // 通信のタイムアウトの設定(ミリ秒)
80
+
81
+
82
+
83
+ // 2. doneは、通信に成功した時に実行される
84
+
85
+ // 引数のdata1は、通信で取得したデータ
86
+
87
+ // 引数のtextStatusは、通信結果のステータス
88
+
89
+ // 引数のjqXHRは、XMLHttpRequestオブジェクト
90
+
91
+ }).done(function(data1,textStatus,jqXHR) {
92
+
93
+ console.log(data1);
94
+
95
+ });
96
+
97
+ return false;
98
+
99
+ });
100
+
101
+ })
102
+
103
+ </script>
104
+
105
+ </head>
106
+
107
+ <body>
108
+
109
+ <form id="form1" method="post">
110
+
111
+ <input name="aaa" value="">
112
+
113
+ <button id="submit" type="button">送信</button>
114
+
115
+ </form>
116
+
117
+ </body>
118
+
119
+ </html>
120
+
121
+ ```

1

修正

2018/03/06 06:30

投稿

kszk311
kszk311

スコア3404

test CHANGED
@@ -6,7 +6,7 @@
6
6
 
7
7
  dataTypeを「text」にすると、どんな値が返ってきてるか確認できると思います。
8
8
 
9
- 今の状態だと、自身HTMLが取得されているはずです。
9
+ そうすると、自身HTMLが返っきているはずです。
10
10
 
11
11
 
12
12