Tuesday, October 14, 2014

Cara Menggunakan Textarea Pada PHP

Textarea adalah elemen form untuk masukan berupa multi-line text. Jika pada input text kita hanya bisa memasukkan baris dalam satu baris saja, maka pada textarea kita bisa memasukkan text dalam beberapa baris. Textarea bisa menampung jumlah karakter yang tak terbatas dan biasanya text ditampilkan dalam font yang fix-width seperti Courier.

Salah satu kelebihan dari textarea yang tidak dimiliki oleh elemen form yang lain adalah sifatnya yang sizeable, artinya bisa diubah-ubah ukurannya oleh pengguna. Meski demikian, ukuran textarea juga bisa diset saat form load dengan atribut cols dan rows. Ukuran textarea juga bisa diset melalui css.

Cara membuat textarea pada form

Pada form html, textarea dibuat dengan menggunakan tag <textarea> dengan tag penutup </textarea. Jika ingin mengisikan data pada textarea bisa ditaruh diantara tag <textarea> dan </textarea>.

Untuk melakukan pengaturan terharap textarea ada beberapa atribut yang bisa dipakai, diantaranya :

1.name

Merupakan atribut untuk mendefinisikan nama dari textarea. Atribut name ini berupa text.
contoh:
<textarea name="komentar"></textarea>

2.autofocus

Digunakan untuk menetapkan focus pada textarea saat pertama kali form di load. Atribut ini bernilai boolean dan untuk menggunakan atribut ini cukup ditulis nama atribut saja tanpa value.
contoh:
<textarea autofocus></textarea>

3.cols

Digunakan untuk menetapkan lebar sebuah textarea saat diload. Atribut ini bernilai angka (integer).
contoh:
<textarea cols="50"></textarea>

4.rows

Digunakan untuk menetapkan tinggi sebuah textarea saat diload. Atribut ini bernilai angka (integer).
contoh:
<textarea rows="50"></textarea>

5.disabled

Digunakan untuk membuat textarea dalam kondisi tidak bisa dipakai, artinya text area tidak dapat diedit dan diselect. Atribut ini bernilai boolean dan untuk menggunakan atribut ini cukup ditulis nama atribut saja tanpa value.
contoh:
<textarea disabled></textarea>

6.maxlength

Merupakan atribut untuk membatasi jumlah karakter dalam textarea. Ini digunakan untuk membatasi jumlah dari textarea yang tak terbatas yang bisa menyebabkan error saat proses submit form.
contoh:
<textarea maxlength="50"></textarea>

7.placeholder

Berfungsi memberikan petunjuk terhadap pengisian textarea. Petunjuk ini akan tampil saat textarea kosong dan akan menghilang saat textarea diisi atau focus.
contoh:
<textarea placeholder="Silahkan isi komentar disini..."></textarea>

8.readonly

Digunakan untuk membuat tulisan pada textarea hanya bisa dibaca saja. Atribut ini berbeda dari disabled, karena isi dari textarea masih bisa diselect, dicopy dan disubmit. Atribut ini bernilai boolean dan untuk menggunakan atribut ini cukup ditulis nama atribut saja tanpa value.
contoh:
<textarea readonly></textarea>

9.required

Merupakan atribut untuk membuat kondisi textarea harus diisi saat form disubmit.  Atribut ini bernilai boolean dan untuk menggunakan atribut ini cukup ditulis nama atribut saja tanpa value.
contoh:
<textarea required></textarea>

10.wrap

Atribut ini menentukan bagaimana textarea dikemas saat proses submit form.
contoh:
<textarea rows="2" cols="20" wrap="hard">

Penggunaan textarea

Textarea biasanya digunakan untuk masukan multi-line text seperti saat memasukkan komentar pada suatu blog. Contoh lain adalah saat melakukan posting artikel pada blog juga menggunakan textarea. Jika hanya menggunakan satu baris text sebaiknya digunakan input text bukan textarea.

Menentukan text awal pada textarea

Saat form load kita bisa menampilkan text awal pada textarea dengan cara menaruh text tersebut diantara tag <textarea> dan </textarea>. Teks ini bisa panjang tak terbatas. Text awal ini juga menjadi nilai balikan textarea saat form disubmit.

Mengambil nilai dari textarea

Cara mengambil nilai dari textarea mengacu pada nama textarea dan menggunakan variabel super global sesuai metode form yang dipilih. Untuk menampilkan text dengan karakter enter (baris baru) harus digunakan fungsi nl2br(). Jika tidak maka text akan ditampilkan urut secara horiszontal tanpa baris baru, meski pada textarea ditulis baris baru.

Contoh penggunaan textarea pada PHP

Membuat textarea pada form

 Silahkan isi komentar:<br/>  
 <form action="" method="post">  
 <textarea rows="5" cols="50" name="komentar"></textarea><br/>  
 <input type="submit" name="enter" value="Enter">  
 </form>  

Tampilan form diatas pada browser

Silahkan isi komentar:


Membuat script untuk menangani textarea

  <?php   
  if(isset($_POST['enter']))   
  {   
   if(empty($_POST['komentar']))  
   {  
   echo "Anda belum mengisi komentar!";  
   }  
   else echo "Komentar anda: <br/>".nl2br($_POST['komentar']);  
  }   
  ?>   

Penjelasan script

Pada form terdapat satu textarea dan satu tombol submit. Ukuran textarea diset tinggi 5 baris dan lebar 50 kolom, kemudian diberi nama komentar. Pada textarea tersebut tidak ditulis text awal, jadi antara tag <textarea> dan </textarea>  dikosongkan.

Untuk mengambil data dari form prinsipnya sama seperti yang lain, dalam hal ini form di submit dengan metode post maka pengambilan data menggunakan variabel $_POST. Kemudian data akan dicek, jika kosong/belum diisi akan ditampilkan pesan "Anda belum mengisi komentar!". Dan jika sudah diisi akan ditampilkan dengan terlebih dahulu diproses oleh function nl2br() untuk menambahkan tag
pada baris baru.

Referensi :

2 komentar: