Tuesday, 19 November 2013

Resize text area

Auto resize text area according to text

Example 1:
window.setTimeout( function() {
    $("#<%= lblOrderNotesVw3.ClientID %>").height( $("#<%= lblOrderNotesVw3.ClientID %>")[0].scrollHeight ); }, 1);

"lblOrderNotesVw3" is my control id

you can also use

Example 2:
window.setTimeout( function() {
    $("textarea").height( $("textarea")[0].scrollHeight ); }, 1);

working with all text area  available on form. You can also use "each" loop

Example 3:
$(document).ready( function( ) {
    $("textarea").each( function( i, el ) {
        $(el).height( el.scrollHeight );
    ​});
});

Example 4:
If you want to use jquery plugin then 

<script src="Scripts/jquery.autosize.min.js" type="text/javascript"></script>
<script language="javascript">
        $(function () {
            $('#txt').autosize();
            //$('#txt').autosize({ append: "\n" });
        });
    </script>

 <form id="form1" runat="server">
    <div>
    <textarea id="txt"></textarea>
    </div>
 </form>

No comments:

Post a Comment