• 0 Vote(s) - 0 Average
  • 1
  • 2
  • 3
  • 4
  • 5
Need help with Ajax Pagination

#1
[eluser]Wonder Woman[/eluser]
Hi,

Basically I have an ajax search but I'd like to incorporate pagination into the results, at the moment they are returned in a list inside a div.

My controller looks like this:
Code:
function index()
{
$data['title'] = "Code Igniter Sample Application";
$data['property_search_javascript'] = '[removed][removed]';
$this->load->view('properties/index', $data);
}
    
function ajaxsearch()
{
$location = $this->input->post('location');
echo $this->properties_model->getSearchResults($location);
}
    
function search()
{    
$data['title'] = "Code Igniter Search Results";
$location = $this->input->post('location');
$data['search_results'] = $this->properties_model->getSearchResults($location);
$this->load->view('properties/search', $data);
}


My model looks like this:

Code:
function getSearchResults($location)
{
$this->db->distinct();
$this->db->like('town', $location);
$this->db->orderby('town');
$query = $this->db->get('properties');
if($query->num_rows() > 0) {
$output = '<ul>';
foreach($query->result() as $property_info)
{
$output .= '<li>'.$property_info->town.'</li>';
}
$output .= '</ul>';
return $output;
}
else
{
return 'You searched for property in '.$location.'<p>sorry no results</p>';
}
}

My view looks like this:

Code:
<div id="property_description">
&lt;?=$search_results;?&gt;
</div>

With the ajax file looking like this:

Code:
window.onload = function () {
new Ajax.Autocompleter("location", "autocomplete_choices", base_url+"properties/ajaxsearch/", {});
    
$('property_search_form').onsubmit = function () {
inline_results();
return false;    
}
}

function inline_results() {
new Ajax.Updater ('property_description', base_url+'properties/ajaxsearch', {method:'post', postBody:'location='+$F('location')});
new Effect.Appear('property_description');
}

If you could advise me that would be great. I am new to codeigniter.

Thanks.

#2
[eluser]Wonder Woman[/eluser]
Anyone? ^^

#3
[eluser]WanWizard[/eluser]
Advise you on what exactly? You haven't asked a single question (if you forget the one in the subject).

#4
[eluser]Wonder Woman[/eluser]
I did, I said I'd like to incorporate pagination into the results, ok so maybe I didn't put it as a question exactly but I was just wondering how I could implement pagination in to my results.

#5
[eluser]Gyzm[/eluser]
Hey fpp,

The Pagination class by default isn't setup to work via AJAX. As of yesterday I've modified it to be able to do so. The problem is in the create_links() function because it only creates regular links. There is no ability to put the
Code:
'#'
in the href nor is there a way to add
Code:
'onclick="func();"'
Updating the Pagination class was pretty simple. The hard part will be figuring out how you want to set it up from there i.e. your client side and server side AJAX code.

Please note that you'll probably want to extend the Pagination class rather than directly modify it so that, when updating codeigniter, you won't undo this code. Unfortunately I haven't done that yet; I just went ahead and modified the original so that's what I'm about to give you. Maybe just rename the original and put this one in it's place for now. I'll extend it later. No time right now.

Note that there is one new Class Variable call 'use_ajax' set to false by default. when set to true:
Code:
$config['use_ajax'] = true;
the create links function will return links that look like this:
Code:
<a href="#" nclick="ajax_pagination();">link number</a>
*nclick is not a typo. onclick is filtered by the system but you know what it's supposed to be.

So now all of your page links will be set to call a javascript function called ajax_pagination() and the argument passed will obviously be the page number.

So now in your in your ajax_pagination() function you'll have your AJAX request with your URL set to http://yoursite.com/controller/function/page_number so:
Code:
url: 'http://' + location.href + '/controller/function/' + n
With the result you'll want to have PHP create the javascript for you and you'll want to have your JS library (Mootools, JQuery, whatever) execute the code. In my case I use mootools so my ajax_pagination function looks something like this:
Code:
function ajax_pagination(n){
if(!n) n = '';

var req = new Request.HTML({
  url: 'http://' + location.href + '/controller/function/' + n,
  evalScript: true,
  onSuccess: function(trees, eles, html, js){
   // do some stuff as well as update links
   $('links_container')._inner_HTML = ''; // clear element for updated links
   $('links_container')._inner_HTML = plinks;
  },
  onFailure: function(trees, eles, html, js){
   //alert('Failed');
  }
});
req.send();
}
You should know what _inner_HTML is supposed to be. It's also filtered out by this system.

Lastly, you'll have to remember to send your links over through javascript. so:
Code:
$data['plinks'] = $this->pagination->create_links();
When php is creating the javascript just make another JS variable for the links so that you can put them in an element upon success as you can see above.

There is quite a bit to this so I hope that you're very familiar with a particular JS library and especially AJAX.

File is attached.

Cheers.


Digg   Delicious   Reddit   Facebook   Twitter   StumbleUpon  


  Theme © 2014 iAndrew  
Powered By MyBB, © 2002-2021 MyBB Group.