Merubah Ukuran TextArea Sesuai dengan Isi

Image Source: return-true.com (jQuery HTML)

Textarea adalah area tempat untuk menyimpan text atau tulisan baru, atau bisa dikatakan sebuah komponen HTML yang digunakan untuk menampilkan text atau kode script dalam bentuk dan format text. Biasanya text area dipakai untuk menyimpan kode HTML yang tidak bisa di tulis langsung ke dalam postingan di blog.
Tag TEXTAREA ini digunakan untuk menampilkan suatu formulir dimana berisi tulisan dalam jumlah yang cukup banyak. Biasanya tag TEXTAREA digunakan untuk tempat dimana pengguna bisa mengisi komentar pada suatu situs atau tempat untuk menampilkan script-script program.

Secara umum untuk merubah ukuran komponen textarea ini menggunakan attribut cols, rows atau menggunakan style width dan height.

Untuk merubah ukuran TEXTAREA Sesuai dengan banyaknya isi, gunakan fungsi berikut:

// Javascript
function textAreaAdjust(o) {
 o.style.height = "1px";
 o.style.height = (25 + o.scrollHeight) + "px";
}
<textarea onkeyup="textAreaAdjust(this)" 
  id="txtArea" 
  name="txtArea"
  class="form-control" 
  style="overflow:hidden; width: 100%;" ></textarea>

// jQuery
function textAreaAdjust(o){
  o[0].style.height = "1px";
  o[0].style.height = (10 + o[0].scrollHeight) + "px";
}

textAreaAdjust($("#txtArea"));