We help IT Professionals succeed at work.

Check out our new AWS podcast with Certified Expert, Phil Phillips! Listen to "How to Execute a Seamless AWS Migration" on EE or on your favorite podcast platform. Listen Now

x

Expanding textarea on key down

higgsy
higgsy asked
on
Medium Priority
305 Views
Last Modified: 2008-02-26
Hi,

Ive got a situation whereby i need to be able to print the contents of a form out. The problem arises that there are textarea fields on the form. If the user has input so much information that it is only all viewable by scrolling to the bottom of the textarea then this part would not show up when printed.

The only way i can see round this is when a key is pressed within the textarea element, javascript needs to check whether there are more rows of text than the default value of rows....if so then the script needs to add another row each time this occurs.

Does anyone know how this can be done as i cant even find a script that detects how many rows a textarea element has???

Thanks in advance

Al Higgs
Comment
Watch Question

Commented:
Unlock this solution with a free trial preview.
(No credit card required)
Get Preview

Commented:
the above works on keyup, you could always change it to keydown if you so choose.
Here is my try of the keyup event, it can be off any event eg onblur or form submit. The area expands when text is added and will contract if text is removed

<script>
function resize(obj){
minRows=5
numRows=obj.value.match(/\n/g).length
if (numRows > minRows)
 return numRows
  else return minRows
}
</script>

<textarea rows=5 cols=20 onkeyup='this.rows=resize(this)'>
</textarea>

CERTIFIED EXPERT

Commented:
here with one line:
<textarea style=width=300px;height:23px onkeyup="this.style.height=this.scrollHeight+5"></textarea>
Unlock the solution to this question.
Thanks for using Experts Exchange.

Please provide your email to receive a free trial preview!

*This site is protected by reCAPTCHA and the Google Privacy Policy and Terms of Service apply.

OR

Please enter a first name

Please enter a last name

8+ characters (letters, numbers, and a symbol)

By clicking, you agree to the Terms of Use and Privacy Policy.