Skip to content

Instantly share code, notes, and snippets.

What would you like to do?
Auto Growing text-area [Stimulus] [Rails]
<!-- Some form -->
<div data-controller="auto-grow-textarea">
<%= form.text_area :body, cols: 20, row: 2, placeholder: 'Bir yorum yazın...', class:'form-control', data: { action: 'input->auto-grow-textarea#resize', target: 'auto-grow-textarea.input' } %>
<!-- Some form continued -->
import {Controller} from "stimulus";
export default class extends Controller {
static targets = ["input"];
connect() {
console.log('auto-grow-textarea controller connected...'); = 'none'; = `${this.inputTarget.scrollHeight}px`;
resize(event){ = '5px'; = `${}px`;
Copy link

goulvench commented Jul 14, 2020

Small improvement: you can add = 'hidden'; at the end of the connect method to prevent the scrollbar from appearing when adding text.

Copy link

yunusemredilber commented Jul 14, 2020

Well, I made it in the CSS but it's a nice tip! It might help others. Thanks, @goulvench.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment