Codeigniter Asset Management : Load Javascript

21 Oct

Codeigniter Asset Management : Load Javascript

Posteds by admin in Tentang Opensource, Uncategorized

tags: codeigniter, php

Tutorial berikut membahas tehknik me-load javascript secara optimal menggunakan framework php codeigniter yang berorientasi pada konsep asset management.
Keuntungan dari tehnik ini ialah anda dapat meng-optimalkan halaman tertentu untuk me-load javascript tertentu…efek-nya tentu saja dari sisi end-user halaman web anda dapat lebih enteng dibuka-nya. sehingga penggunaan javascript tidak mubazir sia-sia.. bayangkan saja jika halaman yang tidak menggunakan jquery tapi ikut me-load jquery versi normal(1.3.2) , maka sekitar 118kb akan terbuang sia-sia..belum lagi jika anda menggunakan plugin-plugin jquery tambahan..

Tutorial berikut ditulis menggunakan file dummy welcome.php yang terdapat dari tiap paketan download codeigniter..btw, anda sebaiknya memahami seluk beluk konsep MVC (model-controller-viewer) codeigniter sebelum membaca lebih jauh tutorial berikut ini.. jika anda sudah mengetahui lebih lanjut silakan simak tutorial berikut ini

Berikut tutorial singkatnya :

1. Atur asset management codeigniter folder seperti berikut :

codeigniter
- system
- assets
  - css
  - images
  - js

2. Masukkan file-file sesuai folder-nya

Dalam hal ini maka file javascript dimasukkan pada folder codeigniter/assets/js/

3. Atur base_url codeigniter anda

buka file config.php (application/config.php)

masukkan parameter base url sesuai folder codeigniter anda, misalnya:

$config['base_url'] = “http://localhost/codeigniter/”;

4. Pada controller..

untuk melakukan load javascript sesuai dengan view-nya,masukkan nama file javascript yang dikehendaki pada controller ,misalnya :

class Welcome extends Controller {

 function Welcome()
{

 parent::Controller();

 function index()

{
$this->load->helper('url');
$data['js'] = array('jquery.min.js','jquery-ui.min.js');
$this->load->view('welcome_message',$data);
}
}

jangan lupa menambahkan $this->load->helper('url') pada controller index-nya

5. pada view..

Dalam hal ini file welcome_message.php akan dimodifikasi pada bagian headernya didalam tags <head>…</head>

masukkan code berikut :

<?php
if(isset($js)){
   foreach($js as $jsload) {
   echo '<script type="text/javascript" src="'.base_url().'assets/js/'.$jsload.'"></script>';
   }
}
?>

sip dahh..

dengan demikian file javascript yang akan di load dapat di optimasi lewat controller sesuai kebutuhan..mudah kan..?!

selamat mencoba

Share On :