Automatically extending textarea

I wish to create a textarea which will extend its height according to how many lines there in it so that one won't need to scroll. To do this I have created a textarea thus:

Everytime the user type in the textarea it calls the function 'wordWrap()' which detects the number of lines in the textarea and adjusts the height accordingling:

The problem I have is that this function will only calculate the line created by the user pressing ENTER and not lines created by automatic (hard) wrap (which to my knowledge inserts carriage returns automatically where the lines break).

How can I detect all newlines/line breaks/carriage returns in my textarea? Has anyone done something like this before. I've scoured the internet for a solution without luck.

Netvibes.com have manage to get this to work almost perfect. But I've noticed a little glitch when u write a word that is too long.

re: Automatically extending textarea

hmm have you tried splitting it by line feed instead of carriage return? which would be \n if i am not mistaking

re: Automatically extending textarea

I believe that is what I'm doing with:

n = myText.value.split(/\n/).length;

Or do you mean something else?

re: Automatically extending textarea

I can't remember how word wrap works exactly if it adds a line feed and carriage return, drawing blanks right now will try to figure it out and post later with some help.

re: Automatically extending textarea

in visual studio I use
<asp:textbox id="txttxtarea" runat="server" TextMode="MultiLine" Height="0px" >txtarea</asp:textbox>
This creates a textarea with auto height

re: Automatically extending textarea

the wraps inserted by the browser do not affect the content of the textarea, they can't, less the mess up form submitting.

you can increase the rows propery of the textarea instead, and that will prevent the line breaks, and thus give you an accurate estimation of the needed height.

re: Automatically extending textarea

try this, give your textarea a unique id such as [id='txt4']

re: Automatically extending textarea

This works pretty well, but when the textarea gets bigger than the window you will have to scroll the window. And make sure none of the textarea's ancestors has an absolute height style property, or they will get the scroll bar.

// test
var T= document.getElementsByTagName('textarea')[0];
T.onkeypress= Run.rerow;