Welcome to the Treehouse Community
Want to collaborate on code errors? Have bugs you need feedback on? Looking for an extra set of eyes on your latest project? Get support with fellow developers, designers, and programmers of all backgrounds and skill levels here with the Treehouse Community! While you're at it, check out some resources Treehouse students have shared here.
Looking to learn something new?
Treehouse offers a seven day free trial for new students. Get access to thousands of hours of content and join thousands of Treehouse students and alumni in the community today.
Start your free trial
nicholas maddren
12,793 PointsJSON loading problem
I have data in a JSON format, I now want to display this data on the front end of my website, the data includes 8 image links per row and quite a lot of string data.
I need to develop a script that can display the JSON data on the front end for example to display all data in a list style and be able to filter and search results depending on the data in the JSON rows.
The issue is that if a client visits the search page/script they will need to load all of the JSON data which I could see being very inefficient.
How can I make it so the client only requests 10 of the data rows at a time for each page? For example when they press the second page of results the data is then requested for those list items?
Thanks, any ideas?
2 Answers
miguelcastro2
Courses Plus Student 6,573 PointsUse an Ajax request to load the items as needed.
Aaron Graham
18,033 PointsYou are basically talking about pagination. You will need to set up your server to understand url query strings like http://example.com/items?start=1&end=10. This is a purely arbitrary example, you don't have to use 'start' and 'end', but the basic idea remains. You need a way of telling your server the number, and range, of items you want it to deliver. Once your server has constructed the requested representation, you basically have one of two options: 1) render the page with the requested number of results. Each time you want the next set of results you will have to reload the entire page. Or... 2) Deliver just the number of items requested by the client using AJAX, as Miguel Castro mentioned. You already have your data in JSON format, so that shouldn't be too difficult to work out. The advantage here is that you just have to update the data in question. You don't have to re-render the page on the server and send the entire thing back to the client.
Do some searching on pagination and you will probably get a wealth of information and ideas.