split dynamic content loading in multiple loading steps

Question

Maybe the title is bit off but I dont know how else to put it.

I have a script which allows to display Bing search results on keyup(jquery) The number of results can be set to a maximum of 50 results for each request. What I would like for my website is the ability to show only the first 10 results and by clicking a div each time other ten results would appear.

I can hide/show but that would mean that the 50 results would be loaded anyway which I want to avoid because of loading time.

Please take a look at this example to have a better understanding: Google Powered site search

This is exactly what Im looking for but I dont understand the coding..

This is the actual script Im using: JsFiddle

Any help would be appreciated.

Answer 1

Why dont you just set the web.count=10 then when they click on the div, set the Web.Offset+=Web.Count+1 and load those results from the api?