How to shrink a TextArea
i am using YUI 3.1 Library from Yahoo and also the TextExpander to let a TextArea to grow up when a user type.
The code below initialize the TextArea:
YUI({gallery: 'gallery-2010.03.23-17-54'
}).use("node", 'gallery-text-expander', function(Y) {
Y.one('#myTextArea').plug(Y.TextExpander);
});
It's work perfectly but now i have a question in this scenario:
1) The user type, the TextArea grow up for many rows and then the message is post to the server.
2) After the post, i clean the TextArea with $('myTextArea').value=''
but it's not shrink as expected and still have many rows when in real must back to the original size.
I notice inside the code of the TextExpander (http://yuilibrary.com/gallery/buildtag/text-expander/gallery-2010.03.23-17-54) exist a method called "shrink_area
" but how i can call this method
$('myTextArea').shrink_area()
?
(i know is a wrong line o开发者_如何转开发f code but i need to obtain something like this) or what is the best way ?
Thanks in advance for the suggestions and tips.
Textarea has rows
and cols
properties for changing the size. Try setting these.
Oh well i solved the problem myself.
So instead to try to call the internal method of the plugged class (that was nice to know how to do, probably using a custom namespace) i wrote a little function that do the trick.
1) first of all i set the CSS property min-height
in the class
2) after clear the TextArea i set the height
as the min-height
the code below shown the function that do the trick
function shrinkTextArea(element) {
// clear
$(element).value ='';
// shrink
$(element).style.height = $(element).style.minHeight;
}
精彩评论