Auto-expanding form text area?

Design help General
1

Heyah,

I would like a form text area to automatically get “taller” the more lines someone types into it.

Currently, the one I am working with goes into “scroll” mode instead.

Here you can see it live: http://wishdish.webflow.io/share

And here’s my public link: https://preview.webflow.com/preview/wishdish?preview=c33ed8b016e396b492c1d2e70a81a5f0

Many thanks,
Christopher

3

Are auto-expanding form text areas possible?

4

Hi!
I found and tested this script. You can paste it into the custom code or in a separate js-file. Appoint id for text area and paste it in the script.

function flexibleTextarea(){
	var _txt = document.getElementById('comment'); // comment is id of text area, that you want to expand
	var _minRows = 7; // height of field (number of rows)

	if (_txt) {
		function setRows() {
			_txt.rows = _minRows;
			do {
				if (_txt.clientHeight != _txt.scrollHeight) _txt.rows += 1;
			} while (_txt.clientHeight < _txt.scrollHeight);
		}
		setRows();
		_txt.rows = _minRows;

		_txt.onkeyup = function(){
			setRows();
		}
	}
}
if (window.addEventListener)
	window.addEventListener("load", flexibleTextarea, false);
else if (window.attachEvent)
	window.attachEvent("onload", flexibleTextarea);
1 Like
5

Hm, interesting! I doesn’t work for me though… :confused:

6

http://ekaterinas-top-notch-site.webflow.io/

1 Like
7

It didn’t work for me either… hmm. Where on webflow are you inserting the code, Eka? And what exact name do I appoint to my text area?

8

see Screenshot by Lightshot

1 Like
9

Hi @Eka,
You probably misunderstood the original request. Christopher wants that the text area keeps expanding while user adding the text there

10

Oooops, my apology! Seems it works on test example. Just figured out that text area will expand after press “Enter”

1 Like
11

Allright, cool! :smile:

One that automatically expands is cooler…like this one:
Like this form: http://www.fhoke.com/contact/

12

Holy crap was that built in Webflow? Beautiful form!

13

Naah, don’t think so but its a nice effect! :smile:

14

This topic was automatically closed 60 days after the last reply. New replies are no longer allowed.