wesnolte / pajinate Goto Github PK
View Code? Open in Web Editor NEWA jQuery Pagination Plugin
Home Page: http://th3silverlining.com/2010/04/15/pajination-a-jquery-pagination-plugin/
License: MIT License
A jQuery Pagination Plugin
Home Page: http://th3silverlining.com/2010/04/15/pajination-a-jquery-pagination-plugin/
License: MIT License
http vs. https
Blocked source:
http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js
Just a tiny issue, am pretty satisfied of your plugin anyway 👍
If we don't have the same DOM structure as in your examples, navigation numbers are left hidden.
In my case, i've nav_panel in a folder 2 children lower. Based on your file not minified, on line 133, it should be :
total_page_no_links = $page_container.find(options.nav_panel_id+':first').children('.page_link').size();
instead of :
total_page_no_links = $page_container.children(options.nav_panel_id+':first').children('.page_link').size();
is their a way to reset the pajinate after applying data sort or filter on list items.
Are there callback functions?
Like
.trigger("pajinateChanged")
where you can add a listener from outside like
$('.list_holder').pajinate().bind("pajinateChanged", function(){
alert("do what you like");
})
i tried to use the same pajinate class for two list but paginator works just for one list, click the next page in the navigator above, but it changes the list below, and click the next page in the navigatoer beloew and changes the list below, how can i make it work for every list i put, the problem is that the content is dynamic, and i can't assign a different class. sorry about my english
Hello, thank you very much for this wonderful jquery!
I set on my page but I detect an error, not if due to a misconfiguration on my part or is it really a mistake.
The bar numbers of pages initially I get the'...' front and behind the numbers whether or not they have more pages (<<<... 1 ...>>>). Then, clicking on the numbers or <<<>>> the situation corrects itself.
Greetings.
Hi There,
Just wondering if I am using your awesome pajinate correctly, please advise:
I have 5 images displaying and pajinate is set to have 8 items per pagers.
I tried to set show_paginate_if_one to false, but the pagers are still showing.
My code is:
$('#thumbs').pajinate({
items_per_page : 8 ,
show_paginate_if_one: false
});
Thank you,
Michel
Pajinate does not work with jQuery 3.2.1, the following error comes up:
jquery-3.2.1.min.js:2 Uncaught TypeError: $items.size is not a function
According to jQuery, the method .size which was deprecated, has now being removed: https://api.jquery.com/size/
This makes the plugin not compatible with the latest jQuery version, any plans to update?
pajinate not work on multiple instance when a class selector is used instead of an id (pagination work only with the last container element)
i had solved this problem for my use, take a look:
https://github.com/m-d/Pajinate/blob/master/jquery.pajinate.js
As .size() has been deprecated since JQ version 1.8, I had problems displaying the page number links.
trying to fix it... :/
BTW, good work, amazing plugin 👍
Regards.
Can you guys please fix the minified version? its not working.
If the first or last page is active the promised no_more
class is not attached to prev / next links
Very nice plugin! I use it extensively in place of will_paginate when I need pagination on the client side. However, I've noticed that the ellipses are wrapped in a href that, when clicked, causes a page reload. This clears any javascript driven modification to the page, in my case all the selected users in the paginated list are forgotten.
In my application I am using 2 paginator in same page with default configuration
$('#global-faq-container').pajinate({
nav_label_first : '<<',
nav_label_last : '>>',
nav_label_prev : '<',
nav_label_next : '>',
num_page_links_to_display : 5,
items_per_page : 5,
wrap_around: true,
abort_on_small_lists: true
}).hide().fadeIn('slow');
and
$('#my-faq-container').pajinate({
nav_label_first : '<<',
nav_label_last : '>>',
nav_label_prev : '<',
nav_label_next : '>',
num_page_links_to_display : 5,
items_per_page : 4,
wrap_around: true,
abort_on_small_lists: true
}).hide().fadeIn('slow');
when I paginate using global paginate then the my-faq paginate also changing.
I am using the latest code and still facing the same problem.
Hello!
Is there a way to avoid having to restart the "pajinate" after injecting the contents by ajax for pagination?
Thank you for your work !
Regards.
Please update feature disable pagination when item didn't count to over user limit (item_per_page config).
I think its a great option and could default setting.
$('#paging_container').pajinate({
start_page :4
num_page_links_to_display : 3,
items_per_page : 5,
total_records:100;
});
i am using this code , when i mentioned start_page : 4 , page navigation is not showing 4th page with ellipses, as i mentioned num_page_links_to_display : 3 its just displaying 1,2,3.... but mine start_page is 4 , the excepted
result should be ...2,3,4.... or may be similar like this.
could you please help me to slove this issue.
Update option for animate effect when click page number or any button on div pagination such as "fade"
Hey there,
I've been using this library for one of my projects and the issue I am having is that if there are millions of results and I am showing 10 results per page, this will write out a lot of page links first in the document, hide them all and then only show 10 of them. This is extremely poor on performance. I am trying to add some code so that it only write 5 page links at a time and then once it reaches the end of the set, it will generate a new set and replace the old set. I am having some issue since I am not very good with js but I think this is a very useful for this library.
That's all.
Thanks.
If you'r on page 1 and click on "previous_link" -> it goes to last page.
But if you'r at the last page and i click on "next_link" -> it stays.
one of theme is rong or should be fixed :-)
Hi,
First of all thanks for this jquery.
It works great.
However I cannot find any way to center the page_navigation.
Any help?
Thanks,
Thomas
A few lines down in the viewPage() function, the items_per_page variable is added to the viewPage() parameter like so:
end_on = start_from + ipp;
However, the ipp variable is pulled out of element storage, and thus is treated as a string. So if you had items_per_page set to "2" and wanted to view page "3", the variable end_on would be set to "23" instead of "5".
I'm kind of perplexed this bug hasn't been addressed in at least one of the forks. I suppose maybe the reason this issue has gone unnoticed is that perhaps the jquery element data codebase has changed in a recent version. Anyways, hopefully somebody who has git setup will correct this problem and it will be merged with the master branch.
I'm using tables to paginate and when loading it will initially show the first ellipse before page one:
« Prev ... 1 2 3 ... Next »
It only happens on the initial load. If I click [1] or Next, the ellipse is remove.
I couldn't get YUI Compressor to compress my modified version of your Pajinate plugin, it kept spitting out "identifier is a reserved word" errors. Finally tracked it down to "goto" is a reserved word in Java, which YUI Compressor is written in. So obscure, but I ended up changing every goto() to gotoNum().
http://www.refresh-sf.com/yui/
http://developer.yahoo.com/yui/compressor/#work
http://docs.oracle.com/javase/tutorial/java/nutsandbolts/_keywords.html
Hi,
Using this code with concatenation and minifaction with other js I was getting this error:
"Uncaught ReferenceError: start_from is not defined"
It seems that this variable is only used in the gotopage function so I assumed all that was needed was to declare the variable.
It seems to work for me so here I suggest a patch to declare start_from and end_on.
Thanks for your gr8 work :)
@@ -216,10 +216,10 @@
// Find the start of the next slice
- start_from = page_num * ipp;
+ var start_from = page_num * ipp;
// Find the end of the next slice
- end_on = start_from + ipp;
+ var end_on = start_from + ipp;
If i am on "page 1", would it not make sense to have the "no_more" class on "first_link"?
And if you are on the last, "no_more" class on "last_link".
I used top and bottom navigation.
Using the bottom navigation:
-When i reached the last page (via "next" button) or if I clicked the "last" button, It directs me to the very bottom of the web page (footer).
The behavior is tolerable when viewing the web page on desktop, but on mobile, it's quite annoying.
i have a strange problem on one of my sites where by i am listing and paginating products and in ie7 and 8 once the pagination kicks in after all the products are added the list always seems to default to showing 5 products with a blank 5th one even though i have it set to display 9 products and 5 pages. Annoyingly i got no errors nothing to indicate whats going wrong and have the same pagination used on another page same site and not doing that so am at the brink of just looking for another pagination because i cant work out what the problem on that page is and was wondering if you might be able to shed some light. the page in question is http://www.rest-assured.co.uk/beds-mattresses/ and its working fine on http://www.rest-assured.co.uk/product-reviews/ (this is set to show 6 reviews instead of 9 that is the only difference and it works if i set it to 9 as well)
the code that conflict with the jQuery library :
{ < script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script > }
The error that is displayed :
Uncaught TypeError: $(...).pajinate is not a function
however , this library is needed for other functionality
if anyone knows of a way to fix ...
I am having multiple pagination in a page.
If i am clicking on ‘last’ page of the first pagination, ‘no_more’ style getting added in the other pagination link also.
This was happening when i am using 1.6.2.min library and it is working in 1.4.2 which you used.
But i am maintaining common js lib throughout my site. So, i want to make this getting solved with 1.6.2.min itself.
I'm working with a site where the amount of items to page may be less than the amount the script is set to show per page. It hides all the paging controls except for ellipses.
Ideal should be that this case is handeled by the plugin.
$(document).ready(function() { $('.NewsSearchResult').pajinate({ items_per_page: 2, nav_label_prev: '< Previous Page', nav_label_next: 'Next Page >', show_first_last: false, num_page_links_to_display: 5 }); });
The main problem of hiding with .hide() is that search engine bots can't index the content, which can be pretty problematic.
I had to edit the plugin to fix the problem. Instead of directly hiding/showing items, I gave them a class to toggle. This class hides the content with CSS in order to make it indexable.
It would be cool if you could add the option to give a class to toggle instead of hide/show. You can still leave the hide/show thing as a default value.
Thanks a lot. :)
Edit: by the way, here is the class I used.
.visually-hidden {
position: absolute;
overflow: hidden;
clip: rect(0 0 0 0);
height: 1px;
width: 1px;
margin: -1px !important;
padding: 0 !important;
border: none;
}
A declarative, efficient, and flexible JavaScript library for building user interfaces.
🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
An Open Source Machine Learning Framework for Everyone
The Web framework for perfectionists with deadlines.
A PHP framework for web artisans
Bring data to life with SVG, Canvas and HTML. 📊📈🎉
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
Some thing interesting about web. New door for the world.
A server is a program made to process requests and deliver data to clients.
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
Some thing interesting about visualization, use data art
Some thing interesting about game, make everyone happy.
We are working to build community through open source technology. NB: members must have two-factor auth.
Open source projects and samples from Microsoft.
Google ❤️ Open Source for everyone.
Alibaba Open Source for everyone
Data-Driven Documents codes.
China tencent open source team.