luis-almeida / jpages Goto Github PK

The pagination controls as they stand are just a list of links. Would it be possible to add functionality to populate an unordered list? Bootstrap has a good pagination style and this script is great but needs some serious tweaking to get it working correctly.

Hi there,

Just wanted to ask if the newer version of jquery will work on this plugin? if yes can you teach me how to do it. I tried adding this in wordpress and it is having a conflict with jquery built in wp which is a newer version.

I tried the jpages plugin but it does not work and I want to have more control.

Thanks

Can someone give a clue on how to do something like "1 - 10 of 40 Items".
I think this would be a pretty common use case.

Thanks,

How can I make as an exemplary'm second page and the addres link in url to be (example) www.site.com/scrollbrowse.html?page=2.
Thanks

Hi,

I've noticed that a elements inside .holder div haven't any class.
I was wondering if there is any way to customize this thing initializing the jPages plugin.
Something like the data-title behavior... but with a data-classes attribute for example.

Thanks anyway
Best regards
Carlo

Hi there

I'm trying to create a simple link to a page outside of the jPages navigation. I see that there is a jump to method using numerical page values using 'parseInt'

$("button").click(function(){
/* get given page /
var page = parseInt( $("input").val() );
/ jump to that page */
$("div.holder").jPages( page );
});

but is there something similar that can be implemented with text strings using split text and an anchor point instead of an input field?

Trying to use jPages on a page with standard bootstrap tabs. The pagination doesn't seem to work if it is located in one of the hidden tabs but does work if it's in the active tab.

Any reason this would be or fixes for it?

There is a bug when you are jump to page over the api, the auto-rotation stops not after clicking.

This is more of an issue with the default settings but I couldn't figure out why the UL containing my list was extending to the height of all of the contents that were being paginated.

Basically on page load the UL would be sized properly for a second and then it would increase in height and extend to the height of the actual content. Each time I clicked through to a page the new li would show up but further down the page.

Oddly, this didn't happen if I set the start page to anything other than 1.

So after a bit of troubleshooting and removing all of the css in my project I realised there was a minimum-height being set in the js and once I set that to false in the options the pagination starting displaying properly.

This didn't happen with the demo site so I'm not entirely sure what the difference was but this might help someone else facing the same issue.

Thanks a lot for this script - it's excellent.

In my paginção more than 1740 records, and I realized that after this many items, paging stops working,
What can be happening? how to fix this "error"

Thank you!

Hi,

i am using this for images list inside a bootstrap tab, on the fist page it is working for other tabs it is not working, i could not understand where the problem lies can you please help me in this issue, i think it may because of js calsh, if yes, let me know what is the solution

Thank you
Karthik

Dear Sirs,

I use jpages, i like the script, but i have one question:

If i click next or previous in my navigation, i want to jump to the top of te page, is that possible?

thx in advance!

Hi
I have been working on this for a few hours and no luck at all.
jPages works in all browsers, except IE8.

Works fine for me on IE7, IE9 but not 8

When I try to paginate, only show the first item of the array/content.
If I disable, my content shows.

Any help on this?

Thanks

the page in here http://luis-almeida.github.com/jPages/custombuttons.html is right, but when i run the html from the clone or the page source of the url in localhost via Chrome , it seems doesn't page

Can you tell me how I can make jPages work similar to http://www.nikolakis.net/liquidcarousel/?

Somehow you would have to change the number of items displayed when the window resizes.

My hope is to use this as fluid/responsive carousel that I could use with a touch swipe library like http://eightmedia.github.com/hammer.js/ to swipe between the pages.

The issue can be replicated even on the project's demo page here:
http://luis-almeida.github.com/jPages/itemsperpage.html

If you change items per page a couple of times (and change the viewing page some times too) you will start to permanently lose some list items which never get visible again.

My guess is that the new function to ignore hidden items on the item count is causing this, so when you have changed to eg page 2/20 then change items per page to something else, the moment jpages re-initializes the items of page 1 are hidden, thus are not counted toward the total.

Thanks for the great plugin btw :)

hi, is there any way i can avoid repeating information?

i mean:

html5 "data-" has an information ex:

<li data-director="spielberg">

..and then.. i'm retyping it..:

<span>Director: <i>spielberg</i></span>

i'm using it over github so no variables available..

any way to avoid repeating everything?

thanks!

how do I go when the mouse, slide stop? I want him going, but when mousing, would have to stop

My issue is here: http://tinyurl.com/cahjhoq

The items per page is set to 15, but on the second page it seems to load a lot more than that. Any suggestions?

Thanks

I've got an issue in table, not all row is showing.
ex.
you add 6 rows data and i set perPage to 5,
now it will have 2 pages but if i add another row: that row will not show.

Another is when i select page 2 then i add another row,
the pages is resetting to 1 and remains 2 rows.

please check it here: http://jsfiddle.net/joemarvalete/v9kuf/2/

I have applied pagination with jPages plugin.
Pagination works fine for the first time along with search input. But when you change the filters on the right side, pagination has disappear.

any one can give solution.

in HEAD ||

in body||

Show All Waiting Payment Confirmed Completed Cancel

my js.php
function getData()
{
var filter = document.getElementById("filter").value;
var tfq = document.getElementById("tfq").value;
var variabel ='code_ax.php?filter='+filter+'&tfq='+tfq;
request.open('get',variabel);
request.onreadystatechange = parseGetData;
request.send('');
}

function parseGetData()
{
if (request.readyState == 4)
{
var answer = request.responseText;
document.getElementById("LISTDATA").innerHTML = answer;
}
}

code_ax.php

I'm loading image thumbs from flickr.
When all the info from flickr is loaded (callback response), unordered list is created, after that jpages plugin is instantiated.
But it seems that the plugin is not aware of the list elements (children - thumbs) inside the container.
It fires the callback, but there are no items in the items object, although if i query the container element directly inside the callback via jquery it gives me all the children of the container.
The workaround that I'm currently using is setTimeout (fired 1000ms after flickr callback)
If I delay running the plugin , then it works.

Also, strange thing it works when loading from cache.

Hi there,
I might be missing something but I couldn't see if there was a way for the pagination to be hidden until the page has reached the limit. i.e if you're paginating reviews and there have been 3 so far and you've set the limit per page to 5 the pagination navigation should not appear, once its passed 5 and a second page is necessary then the pagination navigation should appear. Is this an option.

Other than that great work, cheers.

Hi @luis-almeida ,
We are cdnjs team, we want to host your project on cdnjs.
But I'm not sure which files in this repo need to be added, could you please help up find out the main files?
Thank you.

cdnjs/cdnjs#8046

In my responsive layout, I have the items changing their 'display' rule: when on desktop it's 'display: table-row' and on mobile it is 'display: block'.

however, the plugin only seems to recognize the 'display' property on load and maintain it through out, so when the user resizes the window the 'display' property that should have changed is not changing, so the layout becomes a mess after that.

Issues is when all items count less than perpage, still pagination showing with "1".

Hi ! I'm currently working on a project and I'm using jPages.
This is a very good plugin for sure, quite simple and efficient nevertheless is there any events ?
I'd like to launch a function everytime I'm displaying a page and an event would be very great.

Thanks !

Hi Luis, and first of all thanks for those two great plugins (jPages and Filtrify).

We are using both of them on the same page and therefore need to constantly destroy and reload the pagination.
We had some issues when this scenario is combined with external "next" and "previous" links: after the first destroy-reload, the navigation starts to act strangely.

I've been tracking down the cause and it seems to me that this is due to the destroy method not unbinding the events on the navigation links. I just added the following lines to it and the problem seems to be gone:

        this._next.unbind("click.jPages").empty();
        this._previous.unbind("click.jPages").empty();

Abraço,

Julien

Hi @luis-almeida ,
We found that the repo doesn't have any release. Could you please add git tags so that the git auto-updater in cdnjs can recognize the correct version and automatically update the repo?
Thank you.

cdnjs/cdnjs#8046

Hi,
I have this kind of error "Uncaught TypeError: $(...).jPages is not a function". Why this error could appear?
(Everithing done according to your guide(http://luis-almeida.github.io/jPages/))

My reviews are being dynamically loaded via AJAX. After the reviews are loaded in, I am calling the jPages function, but it doesn't always work. Sometimes just the previous and next buttons show up, but it doesn't always paginate. There are no errors in the output either.

Here is a screen shot. http://screencast.com/t/5oA3KIckK

http://www.aidanceproducts.com/test-landing/test/#reviews is the page in question

hi, when 2nd page is opend,after refreshing it loads 1st page not second

I get a 404 error when trying to access http://luis-almeida.github.io/jPages/

I need to use < and > for the next/previous links, but any time I put them in it breaks the script. Are there any solutions for this?

I have tried using "&lt" and "<" and "&#60" with no success...

Hi,
first of all, thank you so much for this plugin, it's amazing!

then, a little problem..I am using it with youtube iframe. When I change pages videos change but sometimes when i go with the mouse over one video it will change back to the video on another page.

Please can you fix it?

thank you!!

Hi,
your plugin is one of the most amazing ones i have seen on net, but i am having big problem, it seems that your plugin works after the DOM elements are loaded, in other word it just hides the full number of elemnts and create paging numbers out of them, and in this way you cant set number of pages,
what i mean is i want to do simple ajax request to get records from DB, where i have forexample 100 records and i want to return 10 per request, so i will naturally end up with 10 pages numbers with your plugin, but sadly it does not work :(

any hint i would totally appreciate it.

thanks in advanced.

I have successfully implemented and tested all functionality of "jPage" in my wordpress page. Now I am trying to implement it along with Isotop jquery. I can see there is no conflict between those two jQuery scripts,both are working on my page without any error in firebug error console. But problem is that while loading my page all images and css animation are loading on first Image (first: li item area only) and overlaps all Images on first:li instead of displaying all over div block. definitely this is css error. As I found both scripts working with CSS3 "Transform" property. I tried with removing all animation with transform in animate.css and then its works well. But now I cant use other css animation with Transform property. Is there any solution to overcome this conflict of Transform property in both scripts?

Hi
I'm reading your jPages plugins to help a friend.
He had the need to hide the navigation and use only next and prev.

Well, I modified
linha 21:
links: "numeric", // blank || title
to
links: "numeric", // blank || title || none

linha 122:
var navhtml = this.writeNav();
to
var navhtml;
if ( this.options.links != "none") {
navhtml = this.writeNav();
}

In test worked well ...

Thanks in development.

Nice work.

Hi Luis,
first I want to thank you for the great plugins. You've done a really good job!

I'm testing the jPage plugin and i've one issue.

Look at this: http://extensions.styleware.eu/index.php/k2-jpage/k2-jpage-scroll-browse
The pages are scrolling only in one directions,regardless of which direction I move the mouse wheel.

Can you give me some hint what I miss?

The 'destroy' is destroying incorrect jPages control in case multiple jPages controls exist on the page.

To reproduce see: http://jsfiddle.net/HNKEz/
Change value in the first combobox and both jPages controls get broken.

See https://github.com/jredden/johnrredden/blob/master/cosmosreport.html

for the gory details. It's a short page.

It fails in function Plugin at this line:
if (!this._container.length) return;

How i can create button "Show all" which shows all elements?

The demo "Items Per Page" show ALL the images (like when the Js is disabled) during less than 1 second each time we change the value of "items per page".

http://luis-almeida.github.com/jPages/itemsperpage.html

Hi Luís, first of all sorry for my english.

Your plugin is GREAT!!!

Only one "bug"... the lack of browser history.

If I have multiple page in navigation holder, browser back button don't work.

Is possible to add the hashchange function at your plugin?

If yes, how?

Do you can makes me an example of the code to use?

Thanks for your work! ;-)))

Maximo.

When we load jpages via ajax callback it doesn't work.

Is there a way to disable animations in Options setup?

$("div.holder").jPages({
containerID : "itemContainer"
});

I'd like to disable all animations in one case and leave animations as it is in another case. Basicaly I'd like to setup JPages by 2 different ways:

1. Basic setup

$("div.holder").jPages({
containerID : "itemContainer"
});

2. Setup without animations

$("div.holder").jPages({
containerID : "itemContainer",
animation:none,
jqueryanimation:none
});

I'd appretiate the other way of disabling animations too!

Hello,
I try to show only the previous and next item link (with title links) instead of previous and next function.

I play with the startRange, midRange, endRange but i can't find the right combination.

(Sorry for my english)

If you want to set the pervious and next to an HTML entity you will get an error.

The javascript:

                            $('div.pagination').jPages({
                                containerID : 'itemHolder',
                                perPage : 9,
                                previous : '‹',
                                next : '›'
                            });
                        });

And the error inside jQuery 1.7.2 (it also happens in 1.7.1):

Syntax error, unrecognized expression: ‹