Going back/forward a page with Server Side Paging

[MatthewVParticipant]

I have a very large data set that can not be returned in a single JSON result so I have modified the SQL script that generates the results to handle paging. This has worked to give a limited data set back to the user for display quickly and efficiently, unfortunately since the SQL script it’s self is only returning 20 rows at a time the jQWidgets grid does not know how many pages total there are so when it displays the simple pager at the bottom of the grid clicking on the back and forth buttons do nothing. I have looked around for a solution to this but I am not seeing any sort of solution to getting the pager to make call backs when the buttons are pressed. I did see the demo at http://www.jqwidgets.com/jquery-widgets-demo/demos/jqxgrid/index.htm#demos/jqxgrid/paging.htm where the code:

pager: function (pagenum, pagesize, oldpagenum) {

                    // callback called when a page or page size is changed.

                }

was mentioned but I can’t find any reference to using this correctly so I don’t know if that is the solution or how to use it. Can anyone tell me or point me to an example of how to make the grid do a new call back when the next/last buttons on the simple pager are clicked so I can re-call the asp.net method that will fetch a new data set for the grid to display?

[HristoParticipant]

Hello MatthewV,

Please, take a look at this tutorial.
I would like to suggest you look at this demo.

Best Regards,
Hristo Hristov

jQWidgets team
http://www.jqwidgets.com

[MatthewVParticipant]

I have looked at that first link before and I did not see anything of help, I have already tried using

            pagerrenderer: function ()
            {
                var element = $("<div style='margin-top: 5px; width: 100%; height: 100%;'></div>");
                var paginginfo = $("#ReportTable").jqxGrid('getpaginginformation');
                
                    var anchor = $("<a style='padding: 5px;' href='#1'>" + 1 + "</a>");
                    anchor.appendTo(element);
                    anchor.click(function (event)
                    {
                        var pagenum = parseInt($(event.target).text());
                        $("#ReportTable").jqxGrid('gotopage', pagenum);
                    });
                return element;
            },

but that does nothing to the rendered grid. That second demo just uses the built in pageing which I have already said does not work and either link answer the code question. So both links do nothing to answer anything I asked.

[HristoParticipant]

Hello MatthewV,

The example that I mentioned it is not as you notice. It is “Grid Server Paging” (PHP demo).
Please, take a look at this example (with pagerrenderer).

Best Regards,
Hristo Hristov

jQWidgets team
http://www.jqwidgets.com

[MatthewVParticipant]

I don’t think that will work since the SQL query is only returning 20 results and not all results there is no way to calculate how many pages there will be. Every example I have see on your site all presume that all the results of the entire query come back at once. This is not possible for me, I don’t want to force my users to sit for 15 minutes on every run of the report so there is no way of knowing the amount of pages. I need a solution that will allow me to just do an AJAX call, get the next set of results, and refresh the grid with that. Is that even possible or should we be moving to a different product?

Also, in all this time you still have not given any examples of how to use the “pager:” code from my first post.

[HristoParticipant]

Hello MatthewV,

About “all the results of the entire query come back at once” it is not that.
The source.totalrecords is a field that contains all records and based on this, it calculates a number of the pages.
This is called each time when changing the page.
I would like to suggest you review the whole example.
Also, you could check your backend (is there any errors).

Best Regards,
Hristo Hristov

jQWidgets team
http://www.jqwidgets.com

[MatthewVParticipant]

That demo does not help. I don’t know PHP so I can’t tell 100% but it looks like that fetches all the results on the back end at once then passes the total amount of results up. As I have stated before I can not do this, the SQL I run takes over 15 minutes to get all the results back so I do pagination at the SQL side, though only ever returning 20 results at a time. I can not calculate the total amount of rows to return to allow jqwidgets to figure out how many pages there are going to be. I need a solution that does not require me to know the total rows. Nothing you have given me helps me do this.

As for checking my backend, why? There is nothing wrong with my backend. It is 100% the jqwidgets issue of not being able to get it to fire an AJAX call and refresh the page. This is a blocking issue now, I either need a solution from you guys on how to get jqwidgets grid to do a full refresh and AJAX call so I can pass another 20 results to it as I have described here multiple times. If you guys are not willing to provide that information, can not provided that information, or your product can not do this I need to know now so I can move on to finding a software sweet that is more capable.

So in summery: Please quickly provide examples/demos of creating a pager that does not require knowing the total amount of rows. Just a single back and forward button that will create an AJAX call to a back end page and refresh the grid with the new result set.

[HristoParticipant]

Hello MatthewV,

The demo that I shared in the previous post shows that the items are loaded on demand.
javascript:

...
beforeprocessing: function(data)
{		
	source.totalrecords = data[0].TotalRows;
}
...

...
        pageable: true,
        virtualmode: true,
        rendergridrows: function(obj)
	{
		return obj.data;     
	},
...

php:

$data[] = array(
	'TotalRows' => $total_rows,
	'Rows' => $customers
);

I would suggest you to review the example and debug it. Please, take a look at this image and you will see how the mechanism works.
What would I like to suggest you is try to recreate your scenario based on this demo.
You could find this example or another one in the “download package” in folder “demos”.
If you experience difficulties with PHP we have similar demos on: ASP .NET MVC and Java Integration.

Another alternative (not better) is to bind to pagechanged event and change the source (localdata or url) with the desired data.
Please, take a look at this example: http://jsfiddle.net/jqwidgets/dRbAE/

PS: If you want faster response you could contact our support department: support@jqwidgets.com

Best Regards,
Hristo Hristov

jQWidgets team
http://www.jqwidgets.com

[Author]

Posts