I can use mobiscroll to make a text area auto grow as I type by using mbsc-textarea, and this is great. However, if I load the page with a bunch of content already in the text area it only shows the first line.
I’d like it to also auto grow on page load if I render the page with content already in the text area. How do I accomplish this?
Hi Vincent,
You can control the height of the textarea by setting the rows attribute:
<textarea mbsc-textarea rows="10">...</textarea>
Yes, but then I’d have to know how many rows to display based on the content. I’d like to have the input as small as possible each time, so if there’s only one line of text it’s only showing one row high, but if there are three lines it shows three rows high.
I assumed I could call the same function you use to auto-grow it when the user is typing, but just call it on page load. Is that not possible?
Sorry about the misunderstanding!
Could you please share what method are you using for setting the value of the textarea? Do you change the value dynamically?
I’m just including it on page load from the database. For example (using PHP):
echo "<textarea onchange=updateDailyReport('mood') id=dr-mood-note data-role=none mbsc-textarea data-input-style='underline' data-label-style='floating'>".$moodnote."</textarea>";
Could you please share what kind of mobiscroll version are you using?
Sorry gabi, got busy with other things. I’m using version 4.10.9. Would still appreciate a way to do this if possible. Thank you.
Hi Vincent!
If you update the textarea value dynamically, you have to refresh the form with the textarea in it.