選択した画像が表示されない

掲題の件でいきづまっております。

選択フォームを作成し、選択したものを画像として表示させたいのですが、画像が表示されません。


<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<html><body>
<?php
$studioid = filter_input( INPUT_POST, "studio" );
if($studioid === 'daikanmt'){echo "img/sample1.png";}
else if($studioid === 'suita') {echo "img/sample2.png";}
else if($studioid === 'shinjuku'){echo "img/sample3.png";}
?>

<select name="studio">
<option value="daikanmt">代官山スタジオ</option>
<option value="suita">吹田スタジオ</option>
<option value="shinjuku">新宿スタジオ</option>
</select>

<p><img src= <? = $studioid ></p>

</body>
</html>

退会済みユーザー

2019/01/17 05:12

《選択フォームを作成し、選択したものを画像として表示させたい》そのタイミングはサーバーにリクエストを送信してからなのか、それともselectを選んですぐなのか。ここが回答者各々思い込みが生じてしまうので、明確にしてほしい。

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

回答3件

formが抜けているのでは？？
かなりざっくりですがこんなかんじでどうですか？
formを使わないのであればjavascriptとかじゃないと無理かも？

PHP
1<?php
2$img_src = '';
3$studioid = filter_input( INPUT_POST, "studio" );
4switch ($studioid) {
5	case 'daikanmt':
6		$img_src = "img/sample1.png"; break;
7	case 'suita':
8		$img_src = "img/sample2.png"; break;
9	case 'shinjuku':
10		$img_src = "img/sample3.png"; break;
11}
12?>
13<html>
14<body>
15<form action="" method="post">
16<select name="studio">
17	<option selected>スタジオを選択してください</option>
18	<option value="daikanmt">代官山スタジオ</option>
19	<option value="suita">吹田スタジオ</option>
20	<option value="shinjuku">新宿スタジオ</option>
21</select>
22	<input type="submit" value="選択">
23</form>
24
25<? if ( $img_src ) : ?>
26<p><img src="<?=$img_src ?>" /></p>
27<? endif;  ?>
28</body>
29</html>

投稿2019/01/17 02:50

mayoi_maimai

総合スコア1583

退会済みユーザー

2019/01/17 02:55

おー。見落としてたわー。

m.ts10806

2019/01/17 02:56

気づいててあえて放置してました。（いやまさかそこまで抜けてるとは思ってなかったのもありますが）

mayoi_maimai

2019/01/17 03:15

別ページからpostされている可能性も考えたのですが、皆さんとのやり取りを見て恐らく直接URLを叩いて確認しているのかなと思い回答してみました。。 mts10806さんのご指摘の通り基本部分をしっかり理解しなければまた詰んでしまいそうですね。。

m.ts10806

2019/01/17 04:32

この関連の質問が始まったときから回答者は「form送信されている前提」で回答しているので本来はそこで問題が起きていないとおかしかったことですね。

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

IMGタグ使わずに《画像表示されない》って、アホですか。
echo文使うと、その場で与えられた文字列をhtmlに出力します。
imgタグのsrc属性内でecho文実行すれば、意図したとおりに画像が表示できるかと思いますけど。

<img src="<?php
$studioid = filter_input( INPUT_POST, "studio" );
if($studioid === 'daikanmt'){echo "img/sample1.png";}
else if($studioid === 'suita') {echo "img/sample2.png";}
else if($studioid === 'shinjuku'){echo "img/sample3.png";}
?>" />

で、

<p><img src= <? = $studioid ></p>
____________________________^ ?> が抜けてる

そもそも、
$studioid = filter_input( INPUT_POST, "studio" );なので、
画像のパスなんて入ってないわけですよ。
上でecho文してるから。
POSTされたパラメータが入ってる変数をただ表示して、なんの意味が？

ちゃんとやるんなら、

<?php
  $img_src = '';
  $studioid = filter_input( INPUT_POST, "studio" );
  switch ($studioid) {
    case 'daikanmt':
      $img_src = "img/sample1.png";  break;
    case 'suita':
      $img_src = "img/sample2.png";  break;
    case 'shinjuku':
      $img_src = "img/sample3.png";  break;
  }
?>


～(略)～

<p><img src="<?=$img_src ?>" /></p>

とか。
「<?=」は空白含めず続けて記述するもの。
PHP: HTML からの脱出 - Manualの「例2 PHP の開始タグと終了タグ」参照。

htmlタグの外側にmetaタグを記述しているのも本来おかしいですが、
今どきのwebブラウザはその点は寛容だと思うので
まぁいいや。

投稿2019/01/17 01:59

編集2019/01/17 02:17

退会済みユーザー

総合スコア0

m.ts10806

2019/01/17 02:05

最後にimg使ってはいるのできっとechoで変数に代入されると思ってしまっているのかもしれませんね。

akkkkin

2019/01/17 02:05

返信ありがとうございます。 <p><img src= <? = $studioid ></p> としているのですが・・・

退会済みユーザー

2019/01/17 02:11

回答内容、改定したので、もう一度読んでください。

退会済みユーザー

2019/01/17 03:15

他の問題も含めた解決策を提示したいけど、本業立て込んでいるのでドロップ・アウトします。

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

$studioidに何が入っているか確認してください。
どう見ても画像のパスにはなっていません。
それに質問するのが早すぎます。PHPのデバッグ覚えてください。
HTMLも含めて基本部分が抜け落ちています。そこを解決しないからにはいつまでたっても進みませんよ。

あと下記エラーではないですかね。

php
1<p><img src= <? = $studioid ></p>

↓

php
1<p><img src="<?= $studioid ?>"></p>

短縮構文のやり方を間違えています。PHPマニュアル確認しましょう。
htmlも間違えていますね。ブラウザから「ソースを表示」して結果を確認する癖をつけてください。
PHPの実行結果はあくまで文字列を出力しているだけで、ブラウザから確認するからHTMLと解釈してHTML解析して表示してくれていますが、
そのHTMLが正しくなければ正しく表示されませんし、そもそも画像のパスをsrcに渡せていません。

前の質問に書きました。エラー表示確認してください。
そしてそのエラーを質問に提示してください。

投稿2019/01/17 01:54

編集2019/01/17 02:08

m.ts10806

総合スコア80850

akkkkin

2019/01/17 02:20

ありがとうございます・・・ <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> <html><body> <?php $img_src = ''; $studioid = filter_input( INPUT_POST, "studio" ); switch ($studioid) { case 'daikanmt': $img_src = "img/sample1.png"; break; case 'suita': $img_src = "img/sample2.png"; break; case 'shinjuku': $img_src = "img/sample3.png"; break; } ?> <select name="studio"> <option selected>スタジオを選択してください</option> <option value="daikanmt">代官山スタジオ</option> <option value="suita">吹田スタジオ</option> <option value="shinjuku">新宿スタジオ</option> </select> <p><img src="<?=$img_src ?>" /></p> </body> </html> としているのですが、まだ画像が表示されておりませんでして・・・エラー表示は何にも出ていないのですが・・・ちなみに環境はクラウド９を使っております。

m.ts10806

2019/01/17 02:29 編集

画像のパスが合ってない（その場所に画像を置いていない）、画像が破損している　のいずれかでは。コードだけではなく環境も全て含めて確認してください。あとm6uさんもちょっと指摘していますがHTML構造おかしいです。そこはきちんとしてください。 https://www.asobou.co.jp/blog/web/html5

m.ts10806

2019/01/17 02:31

ちなみにブラウザで確認したときに「ソースを表示」で想定通りに出力されているか確認されました？ Chromeであれば画像はリンクになっているのでパスが正しいかどうか確認できます。

akkkkin

2019/01/17 02:45

ありがとうございます。 <!DOCTYPE html> <html lang="ja"> <head> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> </head> <body> <?php $img_src = ''; $studioid = filter_input( INPUT_POST, "studio" ); switch ($studioid) { case 'daikanmt': $img_src = "img/sample1.png"; break; case 'suita': $img_src = "img/sample2.png"; break; case 'shinjuku': $img_src = "img/sample3.png"; break; } ?> <select name="studio"> <option selected>スタジオを選択してください</option> <option value="daikanmt">代官山スタジオ</option> <option value="suita">吹田スタジオ</option> <option value="shinjuku">新宿スタジオ</option> </select> <p><img src="<?=$img_src ?>" /></p> </body> </html> と記述しており、ソースを表示をみるとsrc=が空の状態です・・・

m.ts10806

2019/01/17 02:47

form送信してなければfilter_input( INPUT_POST, "studio" );の中身は空ですよ。「選んだだけで送信される」わけではないです。そこも含めて基本的なところが抜けているという指摘です。 PHPマニュアル読んで概念を理解してください。 http://php.net/manual/ja/tutorial.forms.php http://php.net/manual/ja/faq.html.php

kariya

2019/01/17 02:55

phpには詳しくないのですが、selectタグの項目が変更された時に画像が表示されるような仕組みを実装したいのであれば、javascriptで実行する必要があるのではないでしょうか？今書かれてる処理は、　①selectタグの中身が該当の項目だったら$img_srcに画像をセットしてね　②「スタジオを選択してください」を選択した状態でブラウザに表示してねとなっており、①→②の順で処理されていると思います。必要なのは　③selectタグが変更された時に、imgタグに画像を表示してねの処理ではないでしょうか？

m.ts10806

2019/01/17 02:57

kariyaさん確かに、それだとPHP不要ですね。（あえてPHP使う意味が分からない仕様・・）

m.ts10806

2019/01/17 04:33

そういえば、 https://teratail.com/questions/169081#reply-252232 のyambejpさんの回答そのままですね。PHP使うメリットが全くない要件です。

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

あなたの回答