1 of 2
1
New Plugin: AJAX Pagination
Posted: 14 January 2009 11:43 AM   [ Ignore ]  
Research Assistant
Avatar
RankRankRank
Total Posts:  417
Joined  11-17-2008

Greetings,

This is my very first plugin, so please if there are any faults in the code or anyone has any suggestions for improvement or features then please let me hear them smile.

Basically this plugin makes it easy to implement a non-refresh pagination for your weblog entries.  You can tell it how many entries it should list per page.

Updates
V 1.3
- Fixed a potential bug for people not removing index.php from their URLs.

V 1.2
- Updated code to make it actually work, doh! ><

V 1.1
- Added several checks to make sure the syntax is used properly.
- Added two more optional parameters called “prev_class” and “next_class”.  These are used to define the CSS class of each link.
- Made “prev_link” and “next_link” conditionals as well so you can check to see if they are set.  Check example below to see how I’ve used them.
- Made “limit” parameter optional and if left blank, it will default to 4 entries per page.
- Updated usage section.

V 1.0
- Initial Concept

Usage
:: Setup ::
1) Create your main template where your entries will be shown. This is where you Holder <div> needs to be located and inside that Holder <div> you need to embed the AJAX template. Also jQuery 1.2.6 needs to be included in the header tags. An example will be shown below.
2) Create your AJAX template for the ajaxification (real word?) to take place. Make sure in your {exp:weblog:entries} tag you include limit=”{limit}”, offset=”{offset}” and dynamic=“off”. Again, example will be shown below.

:: Parameters ::
These parameters must not be blank:
weblog - Define which weblog you are pulling entries from.
template - The full url to your Ajax Template
holder - Define what <div> on your main template is going to hold the entries.
parse - This needs to be set to “inward” for the plugin to work.

These parameters are optional:
limit - Define how many entries should be shown per page. Default is 4 if left blank.
next - Define exactly how you want the “Next” text to look. Default is “Next >>” if left blank.
prev - Define exactly how you want the “Prev” text to look. Default is “<< Prev” if left blank.
next_class - Define the CSS class you want to use for the Next link. Default is class=”” if left blank.
prev_class - Define the CSS class you want to use for the Prev link. Default is class=”” if left blank.

:: Variables ::
The plugin will not work if any of these variables are missing in your template.
{prev_link} - This gets replaced by the Previous Link. Can also be used as conditional. Example below.
{next_link} - This gets replaced by the Next Link. Can also be used as conditional. Example below.
{limit} - This tells the {exp:weblog:entries} tag how many to show each page as told by the “limit=” parameter above.
{offset} - This tells the {exp:weblog:entries} tag how many entries to offset.

:: Barebones Example Usage ::
Main Template:
<div class=“codeblock”> <html>
<
head>
script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.2.6/jquery.min.js" >< /script >
</
head>
<
body>
<
div id="wrapper">
<
div id="body">
    <
h1>This is an example for AJAX Pagination</h1>
    <
div id="ajax_content">{embed="template_group/ajax_template"}</div>
  </
div>
</
div>
</
body>
</
html
</div>
AJAX Template:

{exp:ajax_pagination weblog="weblog" limit="4" template="{site_url}template_group/ajax_template" holder="ajax_content" parse="inward"}
{prev_link} {if prev_link 
&& next_link}|{/if} {next_link}
{exp
:weblog:entries weblog="weblog" disable="pagination|member_data|trackbacks" limit="{limit}" offset="{offset}" dynamic="off"}
<h3>{title}</h3>
{body}
{
/exp:weblog:entries}
{
/exp:ajax_pagination} 
File Attachments
pi.ajax_pagination.zip  (File Size: 4KB - Downloads: 636)
 Signature 

- cody

Plugins: AJAX Pagination | AJAX Comments
Extensions: jQuery Quick Save (updated) | Goto Latest Comment
FieldTypes: MS Img Saver
MeanStudios.com

Profile
 
 
Posted: 14 January 2009 04:38 PM   [ Ignore ]   [ # 1 ]  
Moderator
Avatar
RankRankRankRankRank
Total Posts:  3248
Joined  05-13-2004

This looks good - Definitely could have a use for it on a future project.

 Signature 

Recent version: EE 2.4.0 | 2.x Bug Tracker | How to Post a Support Request | Version Upgrade | 2.4.0 Change Log

on twitter @CS_sean

Profile
 
 
Posted: 14 January 2009 06:42 PM   [ Ignore ]   [ # 2 ]  
Research Assistant
Avatar
RankRankRank
Total Posts:  417
Joined  11-17-2008

Thanks Sean smile.

I updated the plugin.  Update notes are in OP.

 Signature 

- cody

Plugins: AJAX Pagination | AJAX Comments
Extensions: jQuery Quick Save (updated) | Goto Latest Comment
FieldTypes: MS Img Saver
MeanStudios.com

Profile
 
 
Posted: 28 March 2009 07:34 PM   [ Ignore ]   [ # 3 ]  
Lab Assistant
Avatar
RankRank
Total Posts:  166
Joined  06-26-2003

Hi Cody,

Thanks for cooking this up. Does it change the url when you page through the pagination this generates?

I gave it a test run today and it’s duplicating h2 on the page and not progressing to the next page. Here’s my setup:

<html>
<
head>
[removed][removed]
</head>
<
body>
<
div id="ajax_content">
{embed="incs/ajax_template"}
</div>
</
body>
</
html>

{exp:ajax_pagination weblog="weblog" limit="1" template="ajax_template" holder="ajax_content" parse="inward"}
{prev_link} {if prev_link 
&& next_link}|{/if} {next_link}
{exp
:weblog:entries weblog="weblog" disable="pagination|member_data|trackbacks" limit="{limit}" offset="{offset}" dynamic="off"}
<h3>{title}</h3>
{/exp:weblog:entries}
{
/exp:ajax_pagination} 

As you can see I stripped all those original divs out of there trying to get to the bottom of why it’s not working, but I couldn’t figure it out.

Profile
 
 
Posted: 28 March 2009 07:36 PM   [ Ignore ]   [ # 4 ]  
Lab Assistant
Avatar
RankRank
Total Posts:  166
Joined  06-26-2003

here’s a link to a test page showing what’s happening: http://andyandyandy.com/index/gallery/test/

Profile
 
 
Posted: 28 March 2009 07:53 PM   [ Ignore ]   [ # 5 ]  
Research Assistant
Avatar
RankRankRank
Total Posts:  417
Joined  11-17-2008

Andy,

It’s nothing you’ve done.  I actually made this while working with the built in EE Calendar and it’s tailored to work with that.  I never did test it with weblog entries ><.  I’m now looking at the code going, “Oh my god, what was I thinking ahaha.” So I need to update this plugin so it actually works for weblog entries, very sorry hmmm.

To answer your question though, no, it does not change the URL.  It’s only meant for a small bit of your website, not main content.  I wouldn’t recommend using it for main content (when I’ve reworked the plugin) as google won’t like it too much smile.

Again, sorry about that!

 Signature 

- cody

Plugins: AJAX Pagination | AJAX Comments
Extensions: jQuery Quick Save (updated) | Goto Latest Comment
FieldTypes: MS Img Saver
MeanStudios.com

Profile
 
 
Posted: 28 March 2009 08:19 PM   [ Ignore ]   [ # 6 ]  
Lab Assistant
Avatar
RankRank
Total Posts:  166
Joined  06-26-2003

No problem Cody, thanks for getting back with me so quick!
It was simple enough to test out so no worries.
I’ll be trying your ajax comments tomorrow, thanks for sharing!

Profile
 
 
Posted: 28 March 2009 09:20 PM   [ Ignore ]   [ # 7 ]  
Research Assistant
Avatar
RankRankRank
Total Posts:  417
Joined  11-17-2008

Alright, I have fixed the problem.  To make this work, make sure in your Ajax Template in the paramater “template” you enter int your Template Group and Template to your Ajax Template smile.  So if your Ajax Template was called “ajax_stuff” and it’s under the Template Group “includes” then the “template” parameter would be:

template="includes/ajax_stuff" 

Have fun! smile

 Signature 

- cody

Plugins: AJAX Pagination | AJAX Comments
Extensions: jQuery Quick Save (updated) | Goto Latest Comment
FieldTypes: MS Img Saver
MeanStudios.com

Profile
 
 
Posted: 28 March 2009 09:42 PM   [ Ignore ]   [ # 8 ]  
Research Assistant
Avatar
RankRankRank
Total Posts:  417
Joined  11-17-2008

Updated the plugin again to fix a potential bug for people not removing index.php from their URL’s.  The change is to put the full URL to your Ajax Template in the “template” parameter. I’m guessing 99% of the time it could look like this:

template="{site_url}template_group/ajax_template" 
 Signature 

- cody

Plugins: AJAX Pagination | AJAX Comments
Extensions: jQuery Quick Save (updated) | Goto Latest Comment
FieldTypes: MS Img Saver
MeanStudios.com

Profile
 
 
Posted: 29 March 2009 09:41 AM   [ Ignore ]   [ # 9 ]  
Lab Assistant
Avatar
RankRank
Total Posts:  166
Joined  06-26-2003

Hi Cody,
These udpates still mean it only works with the calendar still right?
Andy

Profile
 
 
Posted: 29 March 2009 02:18 PM   [ Ignore ]   [ # 10 ]  
Research Assistant
Avatar
RankRankRank
Total Posts:  417
Joined  11-17-2008

Nope, it works for weblogs now smile.

 Signature 

- cody

Plugins: AJAX Pagination | AJAX Comments
Extensions: jQuery Quick Save (updated) | Goto Latest Comment
FieldTypes: MS Img Saver
MeanStudios.com

Profile
 
 
Posted: 08 April 2009 04:55 AM   [ Ignore ]   [ # 11 ]  
Summer Student
Total Posts:  7
Joined  02-19-2009

Hi
Just tried out your plugin and it works really well! However is it possible to make it work with orderby and sort also? Now the order doesn’t work when using the prev and next.

Profile
 
 
Posted: 14 April 2009 02:36 AM   [ Ignore ]   [ # 12 ]  
Summer Student
Total Posts:  7
Joined  02-19-2009

Hi again,
There is also a problem when I change the limit. It’s the right limit when I first enter the page but when I use the next/prev links it changes to only show 4.

Profile
 
 
Posted: 14 April 2009 02:40 AM   [ Ignore ]   [ # 13 ]  
Summer Student
Total Posts:  7
Joined  02-19-2009

Ignore my last post, just found the problem smile

Profile
 
 
Posted: 06 May 2009 03:51 PM   [ Ignore ]   [ # 14 ]  
Research Assistant
RankRankRank
Total Posts:  307
Joined  03-04-2009

Wow, this is excellent! Thank you!!

Any chance of adding number support? (i.e. “Page 1 of 4” and “1 2 3 4” as links)?

Profile
 
 
Posted: 06 May 2009 08:48 PM   [ Ignore ]   [ # 15 ]  
Research Assistant
Avatar
RankRankRank
Total Posts:  417
Joined  11-17-2008

Thanks smile
I would really like to add that feature but I’m currently swamped with client work atm.  I originally wanted to do that but this plugin isn’t meant to replace all your pagination needs since it’s not SEO.  Google won’t be able to find your stuff and if it does it will think you have duplicate page titles which is also bad.  I made this for a small section of your website where you want to show non-important data or want to scroll through a calendar or something.
But on the bright side, I do have a plan to re-write this to be SEO friendly wink.  All in good time!

 Signature 

- cody

Plugins: AJAX Pagination | AJAX Comments
Extensions: jQuery Quick Save (updated) | Goto Latest Comment
FieldTypes: MS Img Saver
MeanStudios.com

Profile
 
 
Posted: 15 May 2009 12:19 AM   [ Ignore ]   [ # 16 ]  
Summer Student
Avatar
Total Posts:  27
Joined  11-13-2007

Hi Cody,

Great plugin! Unfortunately, i’m having trouble getting it to work. I’m able to view the first “page” of entries, and the “next >>” link shows, but the “next >>” link isn’t functional. Clicking it does nothing.

Any ideas? Here’s my “ajax_template” code:

{exp:ajax_pagination weblog="videos" limit="9" template="{site_url}commercial5/ajax_template" holder="items" parse="inward"}
{prev_link} {if prev_link 
&& next_link}|{/if} {next_link}
{exp
:weblog:entries weblog="videos" disable="pagination|member_data|trackbacks" limit="{limit}" offset="{offset}" dynamic="off"  }
 
// weblog entry content here //
{/exp:weblog:entries}
{
/exp:ajax_pagination} 

I really appreciate the help! I can PM you the URL if you need to look at it.

Profile
 
 
Posted: 21 May 2009 12:48 AM   [ Ignore ]   [ # 17 ]  
Research Assistant
Avatar
RankRankRank
Total Posts:  417
Joined  11-17-2008

Plasmajam, ya, I’ll need a link to see what you are doing.  Are you using anything else with jQuery that might be interfering?  Are you sure you are including jQuery correctly?

 Signature 

- cody

Plugins: AJAX Pagination | AJAX Comments
Extensions: jQuery Quick Save (updated) | Goto Latest Comment
FieldTypes: MS Img Saver
MeanStudios.com

Profile
 
 
Posted: 06 July 2009 09:20 AM   [ Ignore ]   [ # 18 ]  
Lab Assistant
Avatar
RankRank
Total Posts:  206
Joined  12-29-2008
MeanStudios - 21 May 2009 04:48 AM

Plasmajam, ya, I’ll need a link to see what you are doing.  Are you using anything else with jQuery that might be interfering?  Are you sure you are including jQuery correctly?

I am having the exact same issue as Plasmajam.

Here is a link to my site.

Thanks!

 Signature 

Ben Schaaf
Snowfox Design + Development

Profile
 
 
   
1 of 2
1