セレクトボックスの表示長合わせ [HTML/CSS]
DB登録されているID+名前等を一つのセレクトボックスで表示して選択すると都合がいい場合がある。しかしIDに全角・半角文字が混じっている、文字数がマチマチな場合は非常に見づらくなる。空白を挿み文字数を合わしても半角全角が混ざっていると表示長合わせが簡単にはいかない。
半角文字を1文字、全角文字を2文字とカウントして、規定文字数になるように半角スペースを挟んだ後に等幅フォントで表示する必要がある。SJISコードは全角が2バイト、半角文字が1バイトになるので一旦文字をUTF-8→SJISに変更して文字カウントするようにした。
通常の表示
文字列表示長を合わせた表示
半角文字を1文字、全角文字を2文字とカウントして、規定文字数になるように半角スペースを挟んだ後に等幅フォントで表示する必要がある。SJISコードは全角が2バイト、半角文字が1バイトになるので一旦文字をUTF-8→SJISに変更して文字カウントするようにした。
/* selectを等幅フォントで表示 css */ // 文字列長さを$lnになるようにスペースを追加する関数(PHP) // $dt: 対象文字列、 $ln: 合わせる文字列長 // function str_awase($dt, $ln) { $c_cnt = 0; $n = 1; for($i=0; $i < $ln; $i++) { $char_dt =mb_substr($dt, $i, 1); $sjis_dt = mb_convert_encoding($char_dt, "SJIS", "UTF-8"); $sjis_len = strlen($sjis_dt); $c_cnt += $sjis_len; if($c_cnt == $ln) { break; } elseif($c_cnt > $ln) { $n = $n - 1; break; } $n++; } $dt = mb_substr($dt, 0, $n); $ln_str = $ln - strlen(mb_convert_encoding($dt,"SJIS", "UTF-8")); for($i = 1; $i <= $ln_str; $i++) { $dt .= " "; } return $dt; } //セレクトボックスに表示するデータ準備(PHP) $kaiin_list = array(""=>""); $sql = "SELECT id, 氏名 FROM tbl_会員マスタ WHERE ORDER BY id"; $result = mysql_query($sql, $link) or die('検索に失敗しました。'.mysql_error($link).$sql); while($row = mysql_fetch_assoc($result)) { $id = $row['ID']; $kaiin_name = str_awase($row['id'], 12)."|".$row['氏名']; $kaiin_list += array($id => $kaiin_name); } //せレクトボックス表示部(HTML)
通常の表示
文字列表示長を合わせた表示