asked on

Angular - difference between these 2 pagination methods

I'm using Smart Table. http://lorenzofox3.github.io/smart-table-website/

Please scroll down to "Client side Pagination" and "pipe/ajax plugin"

In both methods, the database call to get the dataset has to be done upfront...is that correct? What does "pipe/ajax plugin" offer as far as performance that "client side pagination" doesn't offer? I think if both have to get the dataset upfront, there shouldn't be a difference as far as performance but not sure.

M. Tariq

Actually you can wrap the Client side Pagination manually in an ajax response to get or update the required variables, on the other hand
the Pipe/ajax plugin handles the same task with a proper defined manner.
So basically, both plugins/directives can do the same thing, but the pipe/ajax provide you with more configurations and options when it comes to requesting from the server.

Camillia

ASKER

I don't understand it. Both still require bringing the entire dataset when page loads...all at once...correct?

ASKER CERTIFIED SOLUTION

M. Tariq

membership

This solution is only available to members.

To access this solution, you must be a member of Experts Exchange.

Start Free Trial

Camillia

ASKER

Ah ok but that example in Smart Table doesn't work like that. Looks like they get the entire dataset upfront...link is above.

Their dataset is called randomItems...i think they load the entire thing... it's in pipe/Ajax plugin section...if you want to look at it.

M. Tariq

putting the following comments drive me to believe They did that for the sake of the documentation.

//fake call to the server, normally this service would serialize table state to send it to the server (with query parameters for example) and parse the response
	//in our case, it actually performs the logic which would happened in the server
	function getPage(start, number, params) {

		var deferred = $q.defer();

		var filtered = params.search.predicateObject ? $filter('filter')(randomsItems, params.search.predicateObject) : randomsItems;

		if (params.sort.predicate) {
			filtered = $filter('orderBy')(filtered, params.sort.predicate, params.sort.reverse);
		}

		var result = filtered.slice(start, start + number);

		$timeout(function () {
			//note, the server passes the information about the data set size
			deferred.resolve({
				data: result,
				numberOfPages: Math.ceil(filtered.length / number)
			});
		}, 1500);


		return deferred.promise;
	}

Open in new window

Camillia

ASKER

Looking for an example to pull all this together. I changed the stored proc and have row_number now. Page loads and I display 10 rows. But now, don't know how to pass parameter to display the next 20 rows. I'll keep at it.

SOLUTION

Julian Hansen

membership

This solution is only available to members.

To access this solution, you must be a member of Experts Exchange.

Start Free Trial

Camillia

ASKER

Makes better sense now. I changed the sp and code. I'll see how it works. I'll close this and post my code....if I can't figure out the rest.

Camillia

ASKER

I got the paging done but I know there are 2 issues. I'll close this and open a new one with code. I'll work on it some more and then post a new question.

Camillia

ASKER

I posted my question here https://www.experts-exchange.com/questions/29049514/Angular-Code-works-but-need-to-complete-it-paging-with-Smart-Table.html

I'll keep at it. I hope someone can help me. Close to getting it done.