logo_prototype.jpgSalah satu framework PHP dalam membangun aplikasi berbasis  web yang cukup terkenal adalah prototype framework. Prototype merupakan proyek open source dibuat oleh Sam Stephenson pada bulan Februari 2005. Hingga tulisan ini dibuat prototype telah mencapai versi 1.5. Hal ini tentunya telah dibuat dengan proses penyempurnaan. Dengan adanya prototype framework ini sangat memudahkan dalam pembuatan aplikasi berbasis web dengan menggunakan AJAX.
Ada beberapa utilitas yang penting (sering digunakan) dalam aplikasi berbasis web menggunakan AJAX, telah disederhanakan sehingga meminimalkan penulisan code.
Penggunaan protoype framework sangat mudah hanya menyertakan sebuah file prototype.js, maka semua utilitas yang disediakan oleh prototypr dapat digunakan. implementasinya sebagai berikut :

<script language=”javascript” src=”prototype.js” mce_src=”prototype.js”></script>

Adapun beberapa utilitas penting yang disediakan oleh prototype framework sbb:

$()
Fungsi $() digunakan sebagai penggati fungsi document.getElementById() yang biasa digunakan Javascript untuk mengakses DOM semua element dalam html yang menggunakan property id.
Format yang disediakan oleh fungsi $() adalah sebagai berikut :

$(id | element) -> Untuk HTMLElement tunggal
$((id_0 | element_0), … (id_n | element_n)) -> Untuk HTMLElement lebih dari satu

contoh:

<html>
<head>
<title>Fungsi $()</title>
<script language=”javascript” src=”prototype.js” mce_src=”prototype.js”></script>
<script>
   function data_tunggal()
   {
      var target = $(’data1′);
      alert(target.innerHTML);
   }

   function data_array()
   {
      var target = $(’data1′, ‘data2′) ;
      alert(target[0].innerHTML + “\n” + target[1].innerHTML);
   }
</script>
</head>

<body>
<div id=”data1″>Data element Pertama</div>
<div id=”data2″>Data element Kedua</div>
<input type=”button” value=”Data Tunggal” onClick=”data_tunggal()”><br>
<input type=”button” value=”Data Array” onClick=”data_array()”>
</body>
</html>

var target = $(’data1′);
perintah diatas sama dengan perintah : var target = document.getElementById(’data1′);

diguanakan untuk menagkses elemen dengan id ‘data1′, sedangkan untuk mengakses data lebih dari satu elemen dapat dilihat pada fungsi data_array yaitu :

      var target = $(’data1′, ‘data2′) ;
Untuk mengaksesnya sama seperti tipe data array yaitu mengganakan target[0] dan target[1].

bersambung …

previous post: Membuat Sub Menu Navigator Menggunakan CSS