jQuery + CodeIgniter pagination system including source code

[eluser]Ramania[/eluser]
Hello everyone,

i needed to create a jQuery plugin that allows me to bypass the CI out of the box pagination library, not that i don't like it, but i thought i needed a more "elegant" solution, more customizable on the front end of the site and less demanding on the back end, you might agree or disagree based on your coding style, but well, i quiet like what i created .. here is an example of it in Arabic, please note the site is still undone, plus you don't need to understand the language to understand the functionality

http://www.mmdrap.com/mmdrap2/songs#ramiPagination

.. so how does it work for me? well simple!

first the JS code in this first page, i put this in my document.ready function..

Code:

//Start of pagination
    
    var rpOptions = {
     'rpLimit' : '<?=$limit?>',
     'rpTotalResults' : '<?=$total_results?>',    
     'rpMaxNumberOfPages' : 10,
     'rpNextButton' : 'الصفحة التالية',
     'rpPrevButton' : 'الصفحة السابقة',
     'rpFirstPage' : 'الصفحة الأولى',
     'rpLastPage' : 'الصفحة الأخيرة',
     'rpContId' :'#ramiPagination ul',
     'rpPageWrapperTagOpen' : '<li>',
     'rpPageWrapperTagClose' : '</li>',
     'rpPostHref' : '',
     'rpReturnFunction' : function(currentPage)
     {                  
         varpostLimit = '&lt;?=$limit?&gt;';
         varpostOffset = (varpostLimit * currentPage) -  varpostLimit;                  
         varSearchTerm = '&lt;?=$search_term?&gt;';
        
         $('#songsIndexContainer').empty();
         $('#songsIndexContainer').html('جاري التحميل ...');            
        
         $.post('&lt;?=$this->config->site_url()?&gt;songs/index',{limit: varpostLimit , offset: varpostOffset , ajax: true,search_term : varSearchTerm},function(data)
         {
            $('#songsIndexContainer').empty();
            $('#songsIndexContainer').html(data);
                    
         })
        
     }
    };    
            
    $().ramiPagination(rpOptions);
    
    //End of Pagination

and this div where i want the pagination to show

Code:

<div id="ramiPagination">
    <ul>
    </ul>
</div>

what the first Js code would do is set the options of the pagination plugin, allowing further customization, localization, on the fly, and since you already have a call back function "rpReturnFunction" .. then you can customize the way you want the data to be sent, i chose to use ajax post, you can create whatever way your want since you can get the currentPage variable in your function...

for the server side i used this in my songs index file

Code:

$data['limit'] = $this->input->post('limit') ? $this->input->post('limit') : 10;
$data['offset'] = $this->input->post('offset') ? $this->input->post('offset') : 0;
$data['total_results'] = $this->extra_model->getCountExample() ;

well that's about it, it might sound complicated or no use, but i just wanted to share with you .. and here is the plugin file

http://www.mmdrap.com/mmdrap2/system/ass...ination.js

this was the work of few hours, so i please excuse me if i've forgotten something, the js code might not be the best out there, but well, i enjoyed writing the code .

best regards,

Rami