リセットボタンが効かない | Work Note

リセットボタンが効かない

【フォーム事例】----------------------------------------------------


①Aフォーム入力画面で入力

  ↓

  ↓

②B確認画面から戻るボタンで再び入力画面へ

  ↓

  ↓

  ↓

③Aフォーム入力画面(※入力内容保持)

       │

       └ リセットボタンをクリックしても、入力内容が白紙に戻らない。

         (以前選んでいた項目が表示されたまま)


------------------------------------------------------------------


リセットボタン<input type="reset">がなぜきかない?


そもそも<input type="reset">の機能について知識不足でした…




<input type="reset">の機能  ------------------------


<input type="reset">は、
「フォームの内容を、HTMLがロードされた状態に戻す」機能


-----------------------------------------------------



上記の事例でいうと、③Aで入力画面に戻ってきたときは、

内容保持のまま、入力画面が表示されているので

「selected」になっている項目がある状態でロードされています。


よって、リセットボタンを押しても

「HTMLがロードされた状態に戻す」だけなので、(③Aがロードされた状態にもどる)

①Aの項目が全く選択されていないデフォルト状態にもどることにはならない

ということみたいです。



きちんと、理解して使わないとダメですね。




今回は、一旦外に出て入力画面に入りなおすという形で回避しました(phpにて)

表面上は、リセットしたように見えます。


回避方法 ------------------------------

・JavaScriptを使う

・いったんリクエストをとばす

---------------------------------------