CakePHP 1.2.x - Ajax Pagination 'Next Page' Does Not Update, Stays on 2

Question

Good day all,

I am extremely comfortable in using CakePHP 2.x but am having to work on a much older CakePHP 1.2.x app at the moment.

I have implemented an Ajax pagination, which works perfectly fine for the first page, however the 'Next Page' link never does go past page 2. So even once page 2 is loaded, my paginator's next link still remains 'page:2'.

The difference is that my paginator links are GLOBAL. I do not load the pagination links as part of the new DOM injected HTML. The paginator links sit outside of my ajax container, and the content is loaded into the container on click. The paginator links are NOT loaded into that container.

I am well aware that CakePHP 2.x employs the $this->Js->WriteBuffer(); method to print out core JS, which as far as I know is used (amongst other things) to update the pagination links.

CakePHP 1.2.x to my knowledge does not have such a method.

Can anyone shed some light or offer some opinions on this?

My included components & helpers:

var $components = array('RequestHandler');
var $helpers = array('Javascript', 'Html', 'Form', 'Paginator');

My pagination:

$paginator->next('<h3>Next Page </h3>',array('escape'=>false));

I have an Ajax view and an Ajax layout for these ajax loads. The Ajax view just contains the content I want to load, literally just the loop. The ajax layout is ONLY a single line of <?php echo $content_for_layout ?>

I have placed this at the end of my ajax layout, but to no avail:

<?php echo $javascript->writeEvents(); ?>

Any help will be mega appreciated.

Simon

UPDATE: Adding JS code in head, and Ajax view code

Head loaded JS:

$javascript->link('jquery-ui-1.8.13.custom.min.js', false);
$javascript->link('scrollads.js', false);
$javascript->link('jquery.form.js', false);
$javascript->link('jquery.form-defaults.js', false);
$javascript->link('jquery.jplayer.min.js', false);
$javascript->link('jquery.sparkline.min.js', false);

$javascript->link('jquery.cookie.js', false); $javascript->link('jquery.tweet.js', false); $javascript->link('flowplayer.min.js', false); $javascript->link('jquery.validate.min.js', false); $javascript->link('coin-slider.min.js', false); $javascript->link('jquery.thslide.min.js', false); $javascript->link('jquery.barousel.min.js', false); $javascript->link('behaviour.js', false); echo ""; echo ""; echo "jQuery.noConflict();";

echo $asset->scripts_for_layout();

Ajax View File:

<?php foreach ($galleries as $gallery): ?>
                <div class="albumcontainer-wrapper">
                    <div class="albumcontainer-top"></div>
                        <div class="albumcontainer">
                            <a href="<?php echo Router::url('/gallery_images/index/'.$gallery['Gallery']['id']); ?>">
                                <?php echo $html->image($gallery['GalleryImage'][0]['Image']['default']['path_adjusted']); ?>
                            </a>
                            <h3><?php echo $gallery['Gallery']['title']; ?></h3>
                        </div>
                    <div class="albumcontainer-bottom"></div>
                </div>
            <?php endforeach; ?>
            <?php echo $javascript->WriteEvents(true); ?>

This is how I append the ajax loaded view to the existing content rather than replace it:

$paginator->options(
                    array(
                        'update' => 'ajaxAppendGalleries', 
                        'indicator' => false,
                        'evalScripts' => true,
                        'complete' => 'var tmp = jQuery("#ajaxAppendGalleries").html(); jQuery("#galleryContainer").append(tmp); tmp = null; jQuery("#ajaxAppendGalleries").empty();',
                        )
                    );

Sure, are you referring to the HTML structure of the Ajax loaded view, and the JS structure in the head of the main layout? — SimonDowdles
yes. is it possible that the js-events are becoming irrelevant after the first load? — yossi
I wouldn't imagine so no, because the instruction is constant: when clicking on the next link, ajax load the paged result into X container. Updating my question now. Thanks for your input so far, really appreciate you jumping on board man. — SimonDowdles
My load more ajax button is simply the next paginator option: echo $paginator->next('<h3>Load More</h3>',array('escape'=>false)); — SimonDowdles

yossi yossi · Accepted Answer · 2014-04-11T11:39:38

This will be pseudo since i am not familiar with cake 1.2
and although i assume that some of it is trivial, these are points that should be 'check listed'

In the controller's function:
Make sure that you are sending json content with empty layout and with no debugging info.

In the view, create a json structure similar to this:

data{
  paginationHtml: {htmlContent: /* here comes the output of the navigation-creation-function of the  paginator-helper*/, 
  anyOtherContent: ""},
  pageContentHtml: /* the iteration that print out the paged content itself */
}

In the original page use jquery to load the content and replace the innerHTML of the paged data, as well as the content of the pagination navigation links.

CakePHP 1.2.x - Ajax Pagination 'Next Page' Does Not Update, Stays on 2

2 Answers