質問するログイン新規登録

質問編集履歴

1

ご指摘をいただき、javascriptの処理部分のコードの載せ忘れを訂正いたしました。

2019/05/07 06:29

投稿

peyon
peyon

スコア10

title CHANGED
File without changes
body CHANGED
@@ -75,4 +75,116 @@
75
75
 
76
76
  ?>
77
77
 
78
+ ```
79
+
80
+ ### 実現したいこと
81
+
82
+ PHPの処理を実行した後に画面遷移を行いたい。
83
+
84
+ ### 発生している問題・エラーメッセージ
85
+
86
+ 0. HTMLのボタンを押したときに画面遷移させる→phpの処理が行われなかった
87
+ 0. phpにheaderを表記→ポップアップに指定したURLのコードが表記される。下記の画像のようになります。
88
+
89
+ ![イメージ説明](b47ccd481c1d900e366b89a27363e272.png)
90
+
91
+ ### HTMLでの画面遷移表記
92
+
93
+ ```html
94
+ <!DOCTYPE html>
95
+ <html lang="ja">
96
+ <head>
97
+ <meta charset="utf-8">
98
+ <meta http-equiv="Pragma" content="no-cache">
99
+ <meta http-equiv="Cache-Control" content="no-cache">
100
+ <meta http-equiv="Expires" content="0">
101
+ <link rel="stylesheet" href="geo_guide_03.css"/>
102
+ <title>ジオツアーシステム(管理者03)</title>
103
+ </head>
104
+
105
+ <body>
106
+ <section>
107
+ <form id="my_form">
108
+ <input type="file" name="file_1">
109
+ <button type="button" onclick="file_upload()";"location.href='ほにゃほにゃ'>アップロード</button>
110
+ <meta http-equiv="refresh"content="URL=https://www2.yoslab.net/~jyamamoto/system/index.html">
111
+ </form>
112
+ </section>
113
+ </body>
114
+ <script src="./js/geo_guide_03_upload.js"></script>
115
+
116
+ <script src="jquery-3.3.1.min.js"></script>
117
+
118
+ ```
119
+
120
+ ###PHPでの画面遷移表記
121
+
122
+ ```php
123
+ <?php
124
+ // パス名を取得
125
+ $img_name = $_FILES['file_1']['name'];
126
+
127
+ //拡張子を取得
128
+ $ext_object = new SplFileInfo($img_name);
129
+ $ext = $ext_object->getExtension();
130
+ var_dump($ext);
131
+ var_dump(gettype($ext));
132
+
133
+
134
+ if($ext == 'png'){
135
+ echo "pngである判断はされました";
136
+ $new_file_name="sample.png";
137
+ // move_uploaded_file($_FILES['file_1']['tmp_name'], './img/img_sample/'.$new_file_name);
138
+ }elseif($ext == 'jpg'){
139
+ echo "jpgである判断はされました";
140
+ $new_file_name="sample.jpg";
141
+ // move_uploaded_file($_FILES['file_1']['tmp_name'], './img/img_sample/'.$new_file_name);
142
+ }elseif($ext == 'jpeg'){
143
+ $new_file_name="sample.jpeg";
144
+ // move_uploaded_file($_FILES['file_1']['tmp_name'], './img/img_sample/'.$new_file_name);
145
+ }
146
+
147
+ // 画像を保存
148
+ move_uploaded_file($_FILES['file_1']['tmp_name'], './img/img_sample/'.$new_file_name);
149
+
150
+
151
+ // 成功したら,次の画面に遷移する
152
+ header('Location: https://ほにゃほにゃ');
153
+ exit;
154
+
155
+ ?>
156
+
157
+ ```
158
+ ###javascriptでPOSTで送信する処理
159
+
160
+ ```javascrip
161
+ function file_upload()
162
+ {
163
+ var pathdata;
164
+ // フォームデータを取得f
165
+ var submit_data = new FormData($('#my_form').get(0));
166
+
167
+ //画像ファイルでないときの処理
168
+ /*if(submit_data.type.indexOf("image") < 0)
169
+ {
170
+ alert("画像ファイルを指定してください。");
171
+ return false;
172
+ }*/
173
+
174
+ // POSTでアップロード
175
+ $.ajax({
176
+ url : "geo_guide_03_main.php",
177
+ type: 'POST',
178
+ data: submit_data,
179
+ processData: false, // jQueryがデータを処理しないように設定
180
+ contentType: false, // jQueryがcontentTypeを設定しないように設定
181
+ success: function(data) {
182
+ alert("success"+data);
183
+
184
+ pathdata = data;
185
+ console.log(pathdata);
186
+ },
187
+ error: function(data) {alert("error:"+data.statusText);}
188
+ });
189
+ }
78
190
  ```