TextBox の MaxLength が効かない
ASP.NET の TextBox における MaxLength
TextBox の MaxLength プロパティは、TextMode が MultiLine になっていると動作しないというバグが存在する。しかもこれは .NET Framework 4.5 になっても修正されていない。JavaScript でゴリゴリ対処する
やや泥臭いが、これに関しては JavaScript で回避するしかない。テキストボックス
<asp:TextBox ID="TextBox1" runat="server" Rows="5" TextMode="MultiLine" keypress="return CheckLength();" onblur="TrimValue();"></asp:TextBox>JavaScript
// keypress イベントにセットする関数。 var maxlen = 100; function CheckLength() { var textbox = document.getElementById("<%= TextBox1.ClientID %>").value; if (textbox.trim().length >= maxlen) { return false; } else { return true; } }半角文字であれば、上記の関数で問題はないだろうが、全角文字のチェックはできない。つまり、日本語環境では上記のチェックも役に立たない。これを対応させるのは OS やブラウザの差異によりかなり厳しいようだ。
また、半角であっても貼り付け(ペースト)られると全く意味がないので、貼り付け用のチェックを追加する。
// onblurイベントにセットする関数。 function TrimValue() { var textbox = document.getElementById("<%= TextBox1.ClientID %>").value; if (textbox.trim().length > maxlen) { document.getElementById("<%= TextBox1.ClientID %>").value = textbox.substr(0,maxlen); return; } else { return; } }
jQuery で制御する手もある
jQuery が使えるなら、上記の例を一挙に解決することができる。しかも、変換前の日本語(全角)もカウントする。素晴らしい。と思ったら、Chrome でしか動かない。だめだこりゃ…。
$(function() { var maxlength = 100; var tb = $('textarea[id$=TextBox1'); $(tb).keyup(function() { var len = $(this).val().length; if (len > maxlength) { var s = $(this).val().slice(0, maxlength); $(this).val(s); } }); });小手先だが、このような JavaScript で対応するしかないのだが、肝心なことは サーバー側でのチェックを必ず入れること である。