I'm implementing infinite scroll with will_paginate and ajax. Whenever I press the 'load more' elements, it brings me the next 4 elements in the collection. At the moment, everything is ok. But when I remove some element of some page, the next page has been already established in the 'load more' button; because of this, the next time I press the 'load more' button, one element is skipped. Does anybody know how can I solve this? (Sorry about my english)
Pagination gems don't work very well in your use case.
The easiest way to solve this is: if you have a list of elements ordered by e.g. id, on your next page request send the id of the last element on the current page, and use it to offset the next page.
What is happening is that pagination isn't eager loading the next set, but instead is doing an offset count
initial index + page_length * (page number - 1)
limit page_length
When you delete an element it forward shifts the index of every element after it in the database for this query. Which leaves your front end element indexes at a different state than the backend has.
You will need to re-load every "page" starting with the one containing the deleted element and work to the latest loaded "page" to get the front end to have the same element indexes that the back end has.
Related
I have a page where I've added anchor IDs at various points, and at the top of the page I created links to jump to the IDs. When I first load the page the link doesn't work, and I've determined that it's because it hasn't loaded the portion of the page that contains the section ID that it should jump to. Only after I manually scroll through the portion of the page with the ID and then scroll back to the top does the link work properly.
Is there a way to either force the page to be loaded in its entirety (not just the initially visible region of the screen) when it is first opened, so that it recognizes the IDs without needing to physically scroll to them first? Alternatively, is there a better way to handle this? I'd just like to be able to skip to the ID tags as soon as the page is loaded.
Thanks in advance for any help with this.
I have an mvc app where I pass a list to a view. In a most click, I want to be able to render the next item in the last but am having trouble figuring out how to do that efficiently. My approach originally was to use an index i but I realized that one the page is rendered, accessing my model last at i will always leaf to the same result since that item in the list is rendered on page load and can't just be accessed dynamically. Any insight to an approach for this problem?
The model can't be accessed as it's only used on the server side.
There are a few ways of solving the problem, you can use Knockout.js or similar client side view model components, once the user click on the button just render then next item from the knockout model.
Or use AJAX to retrieve the next value from the back end and then render it to the screen.
Or generate the whole screen and just hide all items from the user and then display them once the user clicks the button
I need to implement some logic for to show 3 elements on the first page and by 1 element on all the next. For the first page there is no problems:
items = #model.limit(#first_page_items)
and for all the next ones i tried:
#model.offset(#first_page_items).page(#current_page - 1).per(#per) #makes no offset at all - all the items going from the beginning
#model.page(#current_page - 1).per(#per).offset(#first_page_items) #produces 4-th element on the second page and stays on it for ever
What am I doing wrong? thx
I'm having an issue whereby I navigate around my site but when I return to the first (initial) page of the website, the DOM doubles up. I.E there are two div data-role pages with the same ID.
It's because as you navigate around your site, for some reason, JQM always keeps the first initial page in the DOM, but then when you return to it, it doubles up (and consequently your handlers on elements don't work because they are inside the hidden data-role="page" element and the new ones have no handlers..
Have I done something wrong here or is this a common problem one needs to work around in JQM? Thanks
I also don't understand why JQM holds onto the initial page... I thoguht it was supposed to hold on to the last
Please look at this issue: https://github.com/jquery/jquery-mobile/issues/2258
The first page will never be removed
So use
a href='#id' // jump to #id, which is already in DOM
but NOT
a href='index.html#id' // jump to 'create' a new one
I'm working on a Rails3 application. I'm trying to create a slider type display where 5 elements (from a table in the database) are on the page in a row and on both sides there are arrows.
What i want is that by pressing the arrows, the next (or prev, depending on the arrow) element will be displayed by re-rendering the whole slider and replacing the content with the appropriate elements. At all times i want 5 elements to be displayed on the page and each click of an arrow will seem to make one element disappear on one side and another to appear on the other side. I also want it to be a round slider, meaning It never ends just jumps from the last element to the first.
How do i achieve this. All the work should be done within the controller. In addition I want the starting point of the elements to be randomized, meaning that on the first load of the page the slider may be in the middle of it's cycle. Any ideas?
I'd rather better ways than re-rendering the whole slider, like simply changing its content by AJAX and only changing what must be changed.
What you are looking for is a carousel. There are many plugins to do this if you are using any of the JavaScript libraries like JQuery or PrototypeJS. This is an example of one such thing. And here is a list of Top 10 Javascript slideshows, carousels and sliders.
These two videos might help
http://railscasts.com/episodes/254-pagination-with-kaminari
http://railscasts.com/episodes/51-will-paginate
If you used will_paginate for example you could set your controller as follows
def self.search(search, page)
paginate :per_page => 5, :page => page,
:conditions => ['name like ?', "%#{search}%"],
:order => 'name'
end
Then just use CSS to skin the navigation as you need it information on that here
Pagination 101
Pagination Gallery