ajax textarea auto-grow

why i using textarea-growing ?

if you have textarea on one form and you wants display as minimalist, you can using auto growing textarea.
when user type in the textarea it will be expand vertically to accommodate the size of the entry.

How to using textarea-growing ?

1. you must download jquery plugin jquery.autogrow-1.0.2.1.zip 
2. after that extract jquery.autogrow-1.0.2.1.zip in you localhost folder
3. create file demo.html

First include jquery.autogrow.js

  1. <script type="text/javascript" src="jquery.js"></script>
  2. <script type="text/javascript" src="jquery.autogrow.js"></script>

 

put css and javascript class

  1. <script type="text/javascript">
  2. $(document).ready (function() {
  3.        
  4.         $(’textarea.expanding’).autogrow();
  5.                                                        
  6. });
  7. </script>
  8. <style type="text/css">
  9.  
  10. textarea.expanding {
  11.         line-height: 18px;
  12. }
  13.  
  14. </style>

now crate textarea form with and give class name

  1. <textarea style="width: 400px; height: 84px; min-height: 84px;" class="expanding" name="myTextarea"></textarea>

 You can see  ajax demo here :  textarea auto-grow

and download full demo here : textarea-autogrow.rar

Posted by admin   @   10 October 2009
Tags : , ,

Related Posts

1 Comments

Comments
Trackbacks to this post.
Leave a Comment

Name

Email

Website

Previous Post
« Open Source CMS Award 2009
Next Post
Ajax Form Validation Tutorial »
Powered by Wordpress   |   Lunated designed by ZenVerse
Top Footer