Textarea with lines of text size

Asked

Viewed 616 times

3

Can you help me?

I have a Javascript function that increases the textarea size as we type the text and give ENTER. So far, everything ok.

However, when pulling this information from the database, the textarea does not come with its size respecting the text size.

Following example to try to illustrate better:

Problem: inserir a descrição da imagem aqui

Ideal: inserir a descrição da imagem aqui

<textarea class="form-control" readonly>{{ $resposta->resposta }}</textarea>

Would they know how to fix it? Thank you!

1 answer

2


Just adjust the textarea height by the scroll height it has:

document.addEventListener("DOMContentLoaded", function(){
   var txtarea = document.querySelector("textarea.form-control");
   txtarea.style.height = txtarea.scrollHeight+"px";
});
<textarea class="form-control" readonly>linha 1
linha 2
linha 3
linha 4
linha 5
linha 6</textarea>

  • Hello! Thank you for your reply. When I write the message in pure html, it returns with the correct line size. But when I bring the information from the database, no. From what I saw when inspecting the element, js is loading before the system pulls the database data. Then it loads empty. I even put that js at the bottom of the page, yet it loads before. I would know how to get around it?

  • I found my problem. There was another textarea right up there, so he was counting the lines of this first one, not the one just below. Set a different class for each and done. Solved! Thanks a lot for the help!!

Browser other questions tagged

You are not signed in. Login or sign up in order to post.