Jun11:入力フォームで入力→確認→戻るのフローで、入力値を保持する(セレクトボックス編)

入力値の保持(続き)

input type="select"(セレクトボックス)の値の保持について

例えば、

 

<select name="fruit">
<option value="apple">りんご</option>
<option value="grape">ぶどう</option>
<option value="orange">みかん</option>
</select>

実際はこんな感じ。

こんなセレクトボックスがあったとする。
しかし仮に都道府県とかを書くフォームだったりしたら、こんな沢山書くのはめんどい・・・。
そんな時、先輩に「こういう多数のセレクトボックスの場合だったら配列で一発だよ。」みたいなことを言われて、これはやるっきゃないみたいな感じになりました。

ということで書いてみました。
まず配列から、

<?php
$list = array(
""=>"選択して下さい",
"apple"=>"りんご",
"grape"=>"ぶどう",
"orange"=>"みかん",
);
?>

続いてこの配列を使ってチェックボックスを作る。HTMLとPHPを使って、

<select name="fruit">
<?php
foreach($list as $key => %value){
    echo "<option value='$key'>".$value."</option>";
}
?>
</select>

こんなんでかけました。$list(配列)のキーを変数$keyと定め、それに対する値を$valueとし、配列1つずつについてechoを使って表示していくのだ。なお、ここで気をつけなければならないことは、ダブルクオーテーションの中にダブルクオーテーションを使ってはいけない。なので、ここではHTMLで使う為の表記記号をシングルクオーテーションで書いている。とにかくこれで配列を使ったセレクトボックスが出来上がった。さて、この値をフォームで確認画面に渡すわけだが、選択された値は


$_POST["fruit"]
として確認画面へ引き継がれる。なので、確認画面では、

$name = $POST["fruit"]
print_r($name)
と打つ。そして例えば入力画面でりんごを選択した場合、$POST["fruit"]=appleとなる。よって、本当に表示したいのはひらがなの「りんご」だから、表示画面では、

print_r($list[$name])
と打つ。つまり、$nameの値を$listのキー値として入れてあげて、そのキー値に対応する値を出すのだ。配列ってこんなことも出来るのか。頭いい。

さてさて、最後にこの値を入力画面に戻ったときも保存できるためには、もうおなじみのhiddenで$POSTで送ってあげるのだ。print""の中で、

<form method='post' action='plactice4.php'>
<input type='hidden' name='return' value='$name'>
<input type="submit" name="submit" value="戻る">
</form>

とする。2行目の$nameの値はここではappleなので、これを入力画面に戻ったときには


$_POST["return"]=apple
となっているようにするのだ。

最後に選択したりんごが入力状態になっている時には、りんごに関してのタグの中にselectedを入れなけりゃならん。なので、配列で作ったセレクトボックスに関してもう少し手を加えてあげる。どういうことかと言うと、

<select name="fruit">
<?php
foreach($list as $key => $value){
   if($key == $_POST["return"]){
        echo "<option value='$key' selected>".$value."</option>";
    }else{
        echo "<option value='$key'>".$value."</option>";
    }
}

?>
</select>

$listのキー値(appleとかgrapeとかorangeと、戻ってきた値($_POST["return"])が等しかったら、その時はselected付のタグを表示して、それ以外なら普通のタグを作ってあげる。

てなわけだ。


次回はテストページではなく、これを本番に反映させていきます。




■viの便利コマンド

:5yyp

5行ヤンクしてペースト

■思ったこと



・フォームのtexareaだけ初期値に値いれるのは

<textarea>ここに入れる</textarea>

だった。気づかずにずっとvalueとかに入れてたww