I'm using the md.data.table to display data that I get from the backend,
there is a lot of data (~40000 row) so I'm using backend pagination like this:
in the fist time I get 100 row from the backend so with a limit of 10, the user can navigate in the first 10 pages, when he ask for a page in [11,20](for example) a new request is sent to get the newt 100 rows, and so on.
my problem is that when I get a new 100 rows from the backend (for example the user select the 11th page) I get the result but the page number return to 1 I tried to set it manually using : paginationParams.page=11 but it doesn't work
can anyone help.
thank you in advance :)
I find the solution my self, and here is the solution for those who will have the same issue
the problem was that when I send the request the get the next 100 rows, I copy it in the variable used to show the first 100 rows.
so the solution is, instead of copy the result in the variable, I add them to it, and that solve the problem
Related
Hello everyone,
I am using react-admin for admin panel. I am facing issue, the pagination does not work properly.
The pagination makes only for 10 records.
eg. if I have 100 records, there should be 10 pagination if every page has 10 records.
but it makes pagination for 10 records and shows all the records on the 1st-page. the plugin does not make pagination. Whether records are 100 or more than 100.
if i configure dataprovider with fake data, then it is working perfectly.
if anyone has idea about that please let me know solution.
Thanks
react-admin relies on Content-Range response header in order to build the pagination controls. Does your API return correct value like Content-Range: posts 0-9/100? Sorry I don't have enough reputation to post this as a comment.
For a weblog I am trying to get the top 10 popular posts from for example the last month. I figured I'd get the data out of Matomo, as that's already tracking visits and has an API. I've never used this API before though, so I've been reading the documentation and trying out some things. I am able to get data from the API using the Actions.getPageUrls method. However, when I try to filter using segment=^http://example.org/post I still get data from other URL's. It looks like it filters on session and gives back all data from the sessions that have at least 1 page that conforms to the filter.
The full URL I'm using is: http://example.org/matomo/index.php?&module=API&token_auth=12345&method=Actions.getPageUrls&format=json&idSite=1&period=month&date=today&expanded=1&segment=pageUrl%3D%5Ehttp%253A%252F%252Fexample.org%252Fpost. I've also tried with less and no URL encoding for the segment, but that doesn't seem to make a difference. If I use a URL that doesn't exist I get an empty array returned.
Am I doing something wrong? Is there a different way to only get the top pages with a URL starting with http://example.org/post? Or do I have to sift through the data myself to only get the pages I want?
I am using Matomo version 3.13.5.
I figured it out. There is no need to use segment. This can be achieved using the flat, filter_column and filter_pattern parameters.
Setting flat=1 will make it so all pages are returned in a single array, instead of hierarchically.
With filter_column and filter_pattern I can filter the results.
The URL I use now is: http://example.org/matomo/index.php?&module=API&token_auth=12345&method=Actions.getPageUrls&format=json&idSite=1&period=month&date=today&flat=1&filter_column=label&filter_pattern=%5E%2Fpost%2F. This does exactly what I want.
The unencoded pattern is ^/post/, so this will filter out any page that does not start with /post/.
I have the following sandBox https://codesandbox.io/s/mqk1z565qp with a custom implementation of react-virtualized using Table and InfiniteLoader components inspired by official documentation and examples. https://github.com/bvaughn/reactvirtualized/blob/master/docs/InfiniteLoader.md
but I am driving nuts when adding InfiniteLoader.
I need help from the community what is wrong with the current implementation and to help me to move forward.
In the current stand point initial data is not properly rendered. Only some of them are rendered... The expectation is that the first 50 batch of users are displayed with any interaction from user end. Why it is not happening right now?
Secondly when user scrolls down in some point a request should be done to the server for requesting next batch of rows (50 more). Right now, when user scrolls the example behaves wrongly.
As I understand from the documentation for each row a request is send to the server with a given startIndex / stopIndex.
Regarding this In a later stage have 2 thoughts pending to implement.
Reduce the number of request to the server. ideally only when scrolling is close to reach the bottom ask for next batch.
Translate from startIndex / stopIndex to a page param. My real API endpoint is the param that expects and not startIndex / stopIndex!
But for now I am happy enough having a scrollable table and loading data on demand through InfiniteLoader
note: I have a data.js. It fakes a resultset of data split in 3 pages.
I have a big data portion that I would like to post in a table. However, the data should be sorted and paginated. I know I am able to pass the whole data to the client at once and then paginate it using angular, but this will be too slow. I prefer to pass the data page-by-page, so one the client want to open a page from a table to load the data for it.
Up until now I have created an API that returns me the data that I need, based on the page number and the number of rows on the page. However, I don't know how to use it with AngularJS.
Can you please help me?
It looks like a backend problem. If you are using a standard restful backend, use the limit/skip parameters, you can encapsulate into a paginate.
Example:
localhost:1337/dataTable?skip=0&limit=100
localhost:1337/dataTable?skip=100&limit=100
localhost:1337/dataTable?skip=200&limit=100
...
On the frontend use a table object like ng-Table, and use the pages to keep track of the offset, the page number and the total items available.
skip = (pagNum - 1 * pageSize)
limit = pageSize
Make your backend return you the page you want plus the available dataNumber so you can build the pages controller.
Documentation for skip/limit on sails
http://sailsjs.org/documentation/reference/waterline-orm/queries/limit
http://sailsjs.org/documentation/reference/waterline-orm/queries/skip
Best approach is to keep track of the limit and offset in your controller. Then when user selects new page (offset) or changes items per page (limit), update the corresponding values and use them to make a new http request.
You could call a function on ng-change of a dropdown and that drop down would contain values of page number and number of records to fetch. Or you can provide two text boxes one for page number other for number of records and keep a button and on its ng-click event that will take value of those text boxes and post to your server and bring back data based on new values in text boxes
I m actually trying to developp a little application using de ui.grid library and I m facing problems when getting the data result set on a filter.
In fact, everything works great, I can filter, I can make opération on each line, but I cant get the full result set of a filter using :
http://ui-grid.info/docs/#/tutorial/103_filtering
Can you help ?
I repeat : everything works great, I can sort and filter, but I cant get my resultset
Thanks for advance & have a nice day ! :D
What do you mean by "get my resultset"?
I'm assuming this means you want to programmatically get at the filtered list of rows. ui-grid doesn't provide an API for doing that, but you can get it from gridApi.grid.renderContainers.body.visibleRowCache. This will give you a list of the current visible rows.
You can extract the original entities from your data array from those rows, the entity is typically in row.entity.