ソフトウェア開発者の日常

こだわりなく書きたいことを書いていきます。

チェックボックスがOFFと無効の組み合わせで正しく動作しない現象を対策しました

既存のソースコードで以下の正しく動作しない現象を見つけ、修正しました。

現象

データベースに「0」とだけ保存されているはずのカラムに、「0,0」と保存されていました。

動作の流れ

直前にデータの更新操作をしたので、更新時にデータが誤ったデータで更新したと推測されました。

更新処理は、まず更新用のページに値を表示して、変更後のデータを入力してもらい、更新をします。
表示は、

  1. データベースから値を取得する。
  2. セッション変数に、データベースから取得した値を設定する。
  3. セッション変数を表示する。

という処理をしています。

更新は、更新ボタンをクリックすると、

  1. 更新用ページのフォームからPOSTされた値を使って、セッション変数を更新する。
  2. セッション変数の値を使って、データベースを反映する。

という処理をしています。

誤ってデータが更新された箇所は、1個目のチェックボックスがチェック状態で固定されていて、2個目以降はチェックをON/OFFできるようになっています。
0・変更不可
1・変更可能
2・変更可能

HTMLのソースコードは以下のようになっています。

<input type="checkbox" name="chk" value="0" checked="checked" disabled>0・変更不可
<input type="checkbox" name="chk" value="1">1・変更可能
<input type="checkbox" name="chk" value="2">2・変更可能

f:id:AJYA:20160623061034j:plain
photo credit: 2015 TechGirls at iD Tech Camp at American University via photopin (license)

原因

更新ボタンをクリックすると、更新用ページのフォームからPOSTされた値を使って、セッション変数を更新します。
チェックボックスの1個目は、選択状態ですがdisabledのために値がPOSTされません。
チェックボックスの2個目以降は、選択されていないと値がPOSTされません。

POSTされた値がないため、セッション変数はデータベースから読み込まれたときの値のまま「0」になります。
このセッション変数の値に対して、必ず「0」は選ばれているので、「0」を連結する処理が動作して、「0,0」という値を生成していました。
この値を使ってデータベースを更新していたので、該当のカラムに「0,0」と保存されていました。

対策

更新ボタンをクリックしたら、該当のセッション変数を初期化してから、POSTされた値を使って、セッション変数を更新するようにしました。
セッション変数が初期化されているので、POSTされた値が無い場合は、空文字に対して「0」を連結する処理が動作して、「0」になります。
POSTされた値がある場合(例えば2)は、空文字に対して「0」と「2」を連結する処理が動作して、「0,2」になります。
これで修正が完了しました。

値がPOSTされない場合があることを忘れない

ついフォームに表示されている要素は必ずPOSTされると勘違いしてしまいがちです。
無効だったり未選択では、POSTされないことを忘れないようにしないといけません。