Adjust textarea height to fit content

Is it possible to have a textarea adjust it's height tp fit it's contents on a form?

Tagged:

Comments

  • edited November 2019

    Hello @Splay,

    Is it possible to have a textarea adjust it's height tp fit it's contents on a form?

    By "adjusting its height to fit its contents" do you mean you want to adjust the height dynamically, i.e. on a key press?

    It seems possible, although the end result will depend entirely on the specific functionality you'd like to see. The general idea consists of dynamically redefining textarea's height and applying the new height by calling the resize() method. The resize() method will render the input anew, which will drop the focus from it, that's why you will need to call the focus() method now to regain the focus. After that, you have to restore the cursor position and set it to the very end of the input (since the cursor position will also get reset).

    Here are a few rough examples of how this could be done:

    https://snippet.webix.com/0mmu7wc0 (arbitrary linecount variable)

    https://snippet.webix.com/lmohja2h (using the rows attribute)

  • Brilliant @Dzmitry

    Adjusting it dynamically is great and I see how you are doing it with splitting on the \n newline character. That's nice.

    I would like it to stretch at load time too. I could do the same kind of thing.

    It's a description field on a form. I tried some richtext plugins but they don't seem to have a "onUpdated" event.
    I want a form with no "Save" button. Instead using the "lose focus" event on each field to update the server.

Sign In or Register to comment.

Howdy, Stranger!

It looks like you're new here. If you want to get involved, click one of these buttons!