Using JQuery with CodeIgniter

Using JQuery with CodeIgniter is simple. In fact, using most Ajax frameworks with CodeIgniter is easy. I created a simple JQuery plugin that displays randomly selected images (imBannerRotater).

First I use CodeIgniter’s ‘base_url’ function to link the necessary Javascript files in a main view of my application:

<script type="text/javascript" src="js/jquery/jquery-1.3.1.min.js"></script>
<script type="text/javascript" src="js/jquery/jquery.imBannerRotater-0.5.js"></script>

Next, I define a Javascript variable to be used with by the plugin:

<script type="text/javascript">
//<![CDATA[
base_url = '<?= base_url();?>';
//]]>
</script>

I then use this variable in my JQuery Plugin:

?View Code JASVASCRIPT
$(document).ready(function(){
     $(".randPic").imBannerRotater({
	data_url: base_url + 'assets/sidebar/sidebar.php',
	base_path: base_url + 'assets/sidebar/'
     });
});

That’s about it. While this is a simple example, using CodeIgniter’s base_url function is the key to using JQuery or any other Ajax Framework.

Be Sociable, Share!

Checkout My New Site - T-shirts For Geeks