prev/next button a bit like on "editor", but on another page than table

rlorentz

When in a table and I click a row, I redirect the user to a new page with more information about the item on the clicked row.
I would like the user to be able to click a prev and a next button on this page to go back/forward on the original table-list.
Any ideas on how to achieve this?

rlorentz

Additional info:
Go to www.casainfo.net, and click on "latest ads". A table will appear. Click on one of the rows, and the mentioned page with information about item will appear. On this I have a "back to list" option along arrow right/left. Would like to be able to click the arrows and get to next/previous item in original table.

regards,
Roar Lorentzen

allan

You need to know a number of things to be able to do that - firstly what the next item in the list was, and that will depend upon the ordering, so you need to know the ordering as well. Perhaps one solution might be to read the state of the table when the row is clicked, save it into localStorage and then use that information in your next/previous buttons. But not really something DataTables will help you with!

Allan

rlorentz

Thanks for quick reply.
How do I access the localStorage to get the row above and below?

Roar

allan

https://developer.mozilla.org/en-US/docs/DOM/Storage - you'd need to use fnGetData and store the data in localStorage.

Allan

rlorentz

Yes, I have read those. Did not make me any smarter. To use fnGetData it seems I need to initialize the table on the new page where I do not use the table? I may misunderstand something here, but I'm looking for a simple explanation on how to store the table and retrieve the content of the table at will. I'll think a little more about the need for this functionality, and see if I put up a bounty for someone to help me get it.

Roar

allan

It might be best to ask this question on SO or similar as it isn't directly a DataTables question, more a general Javascript one. however, the approach I'd take is:

1. In the on click handler for your row, store the order of the data from the table in local storage
2. Use that saved local storage in your details page to provide the forwards / backwards navigation controls.

Allan

rlorentz

I agree with the steps. But I do not have the knowledge to implement it, and have yet to see an example of it.
Is this something you could help with, and how much would it take in £/€?

Roar

allan

As I say, that falls outside the scope of DataTables for the most part. All you really need on the DataTables side of things is fnGetData or the fnGetColumnData API plug-in (if you only need a single column of data).

Something like:

[code]
localStorage.setItem( 'navigation', JSON.stringify( table.fnGetColumnData(0) ) );
[/code]

would store the information from the first column in a local storage parameter, which could then be accessed else where.

Allan

rlorentz

Thanks, seems I'm a step further. New day with new eyes and all looks much easier.
Is there a way to store the "id" of each "tr" by use of the localStorage.setItem, and JSON.stringify?

Roar

allan

Yes - use the DataTables $ API method or fnGetNodes to get all TR elements, loop over them, and get the ID for each.

Allan

rlorentz

Phew, what a fast reply. Did not have time to edit my comment before the reply came in.
I'll give this a try.

thanks,
Roar

rlorentz

Hi,

Have sorted it out, but it seems table.fnGetNodes( ) is not up to date with the sorting?
If I do a sort on a column, and later do the fnGetNodes() it is not in correct order?

Roar

allan

Ah yes - sorry. You should use the $ method - which does have an option to return the nodes int he sorted order - http://datatables.net/docs/DataTables/1.9.4/#$.

Allan

edit - Whoohoo - that was post 14'000 :-)

rlorentz

Hi,
I tried this : var tableRows = slTable.$('tr', {'page': 'current'});, and I loop tableRows.
It seems to work.

But I get an error on sorting after I added this, but only on the last column of my table:

TypeError: p[(("string" + "-") + o[c][1])] is not a function
http://www.casainfo.net/js/jquery.dataTables.min.js
Line 84

Roar

Well, it might be something else causing this error, not sure when it turned up. any idea?
Strange, I can't remember doing any changes that should cause the sorting on price to fail.
I do use a plugin for this, but it has worked well. Only thing i did today was add another plugin to the file I have the number format plugin in, but I have removed this and restored the file. Still does not work.

rlorentz

Everything ok on this one. I added : jQuery.fn.dataTableExt.oSort, and the sorting works. Not sure what happened, but ok now. Thanks for great help.

Roar