Symfony Framework Versi 1.4 telah dirilis beberapa waktu yang lalu. pada versi 1.4 dan versi 1.3 Symfony secara default tidak menyertakan Ajax atau Javascript framework di dalam Symfony.
Bila pada Symfony Framework versi 1.2 dan sebelum -nya Symfony secara default untuk keperluan Ajax dan Javascript Framework menggunakan Script Script Aculo dan Prototype JS yang sudah di "bungkus" dengan tag-tag symfony sehingga lebihmudah dalam penggunaannya.
Pada Symfony Framework Versi 1.4 Prototype JS dan Script Aculo tidak menjadi default symfony dalam hal ajax dan javascript, sekarang Symfony merekomendasikan menggunakan Jquery
Proses Pemasangan Jquery pada Symfony Versi 1.4 harus dilakukan secara manual kemudian untuk menggunakan feature-feature ajax dan javascript ,symfony tidak menyediakan tag-tag symfony melainkan kita harus menuliskannya secara native perintah-perintah Jquery.
Pada posting ini saya akan menjelaskan cara instalasi Jquery di Symfony 1.4 dan cara penggunaan sederhana Javascript dan Ajax di JQuery yang diimplementasikan di dalam sebuah modul Symfony Framework.
Sebaiknya sebelum instaal JQuery di Symfony Framework 1.4 telah mengerti Install Symfony Framework dan mengerti struktur folder di Symfony Framework
I. INSTAAL JQUERY DI SYMFONY FRAMEWORK 1.4
1. Dowload JQuery versi terbaru di http://jquery.com/
2. Copy-kan hasil download JQuery (contoh: jquery-1.4.2.min.js) di folder web/js dari Symfony Framework,sebagai contoh seperti gambar dibawah ini
3. Load JQuery di template Aplikasi atau template Module, sebagai contoh saya akan melakukan load Jquery di template aplikasi.
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
<?php use_javascript('jquery-1.4.2.min.js') ?>
<?php include_javascripts() ?>
</head>
<body>
<?php echo $sf_content ?>
</body>
</html>
<?php use_javascript('jquery-1.4.2.min.js') ?>
<?php include_javascripts() ?>Baris tersebut adalah perintah untuk load JQuery
II. MEMANFAATKAN JQUERY UNTUK AJAX & SIMPLE JAVASCRIPT
A. Tuliskan statement-stamenent Jquery di template apliksi atau template module yang membutuhkan, sebagai contoh saya menuliskan sebuah statement Jquery di template module.
B. Sebagai contoh saya akan menuliskan sebuah simple javascript menggunakan Jquery untuk keperluan validasi sebuah Inputan, pada sebuah template module atau template aplikasi.
<input type="text" id="search_keywords" />
<script type="text/javascript" >
$('#search_keywords').keyup(function(key)
{
if (this.value.length >= 3)
{
alert('Maaf, Maksimal Anda memasukan tiga karakter');
}
});
</script>Kode diatas akan mendeteksi bila inputan ber-id search_keywords jumlah karakter yang di-inputkan lebih dari tiga maka akan memunculkan alert bertuliskan
'Maaf, Maksimal Anda memasukan tiga karakter'.
C. Sebagai contoh saya akan menuliskan sebuah simple Request Page/modole menggunakan Ajax pada sebuah template module atau template aplikasi
<a href="#" id="klik">Klik Ajax</a>
<div id="results">
</div>
<script type="text/javascript" >
$('#klik').click(function() {
$('#results').load('<?php echo url_for("modulPertama/index") ?>');
});
</script>Kode diatas akan mendeteksi bila link ber-id klik di tekan maka akan melakukan request ajax ke module/ page bernama modulePertama/index kemudian hasil dari request tersebut akan di sisipkan kedalam div yang ber-id result.
nb:
Untuk melihat dan cara pengunaan feature ajax dan javascript yan dimiliki Jquery dapa di lihat dokumentasi nya di Documentation JQuery
mas klo pake plugin sfJqueryReloadedPlugin gmn, tau ndak?
ReplyDeletethx
yang ini kan.. http://www.symfony-project.org/plugins/sfJqueryReloadedPlugin sepertinya dapat mengerti penggunaan plugin tersebut seperti yang ditulikan di page readme nya...
ReplyDelete