Apologize for the delay in sending this.

Per your request, I enclosed a sample of custom VirtualLoad paging of WebGrid which is implemented in InitializeDataSource event of WebGrid. Please have the attached sample evaluated on your end and let us hear your feedback.

Hi Yudi,

Our clients are facing lot of performance issues with loading with large number of records.

They are having 50000 type of records.

If we implement the custom paging also, if clicking on load more data at certain level say like if record reached like 5000,10000 etc performance issue will come as it is keep on querying the top records from database.

So Our requirement is to implement the paging (say paging size 500)

1. Webgrid should load with initial paging size 500 records.

2. On click of next another 500 set of records should load (should not load top 1000)

3. On click of next another 500 set of records should load (should not load top 1500)

how do we achieve this requirement?

Please provide us with a sample to achieve this scenario.

We are in critical stage of the project .Please advice.

Regards,

Madhavan

Regards,

Madhavan  

Regards,

Madhavan

Thank you for your feedback.

I made a minor modification to the sample – which is enclosed on my previous post (May 27, 2013) – and run it in browser. VirtualPageSize property is set to “10”. Initially, the select command of OleDbDataAdapter will select top 10 of Order Details. Next, when user loads more data, it will select top 20 of Order Details and so on.

WebGrid has a mechanism to handle its custom virtual load paging.

Please try to open Developer Tools of your IE browser and enable the network traffic capturing. It will show you the XML which is returned from the server. The XML contains information of rows when user loads more data.

Initially, the XML will returns with 10 rows.

Next, when user loads more data, instead of returning XML with 20 rows, the XML will contains 10 rows (the information of rows #11 to #20) and so on.

Each POST takes only one hundred something millisecond (less than one second).

Hope this helps.

Hi Yudi,

One more point to add We have multi select functionality.

We have option to select items across multiple pages and perform the operation based on the selected check box and other column values for the selected row,

SO how this will work in custom virtual mode.

Regards,

Madhavan

for (int j = 0; j < rowsCount; j++)
                    {
                        if (WebGrid1.RootTable.Rows[j] != null)
                        {
                            if (WebGrid1.RootTable.Rows[j].Type == RowType.Record)
                            {
                                if (WebGrid1.RootTable.Rows[j].KeyValue.ToString() == WebGrid1.RootTable.GetCheckedRows()[i].ToString())
                                {
                                    string workflow = WebGrid1.RootTable.Rows[j].Cells.GetNamedItem("Workflow").Text;
                                    Guid WorkitemId = new Guid(WebGrid1.RootTable.GetCheckedRows()[i].ToString());
                                    Skelta.HWS.WorkItem workitem = new Skelta.HWS.WorkItem(new Skelta.Core.WorkflowObject(workflow, new Skelta.Core.ApplicationObject(_ApplicationName)), WorkitemId);
                                    if (multiSelectQueueId == Guid.Empty)
                                    {
                                        if (workitem.QueueId != Guid.Empty)
                                        {
                                            multiSelectQueueId = workitem.QueueId;
                                        }
                                    }
                                    workitemObj.Add(workitem);
                                }
                                else
                                {
                                    continue;
                                }
                            }

WebGrid allows you to create efficient multiple rows selection grid interface quickly using WebGridColumn’s IsRowChecker property. In order to obtain the checked rows can be done via server side or client side.

In the provided snippet code, GetCheckedRows() method is used. This method returns the checked rows for the WebGridTable. The return value of this method is object of HTML RowElement Collection.

On the custom mode of virtual load, developers need to specify the data fetching logic. Sorting, editing, and all-other data aware functionalities can work in this mode. However, checking all rows (by checking the IsRowChecker column header) requires all rows to be loaded.

Hope this helps.

Hi Yudi,

Is there any way we can acheive the following scenario?

Say we have 50000 type of records.

Say our paging size is 50.

1.First on load webgrid should load 50 records.(Database call should be for retrieving 50 records).

2.On click of next Webgrid should load 50-100 records.(Database call should be for retrieving 50 records).

3.On click of next Webgrid should load 100-150 records.(Database call should be for

retrieving 50 records).

Please advice us achieving the above mentioned scenario will benefit us heavily.

Thanks in advance,

Regards,

Madhavan

In my opinion, it seems that you wish to use the custom virtual load paging but doesn’t want to use the “select top n rows from [tablename]” as the select query of WebGrid.

I have managed to create a simple sample of custom virtual load-enabled WebGrid where the select query is no longer use “select top n rows from [tablename]”. The select query is made based on the requirement specified in your post (on June 11, 2013).

However, I’m not lucky enough to have the expected result on WebGrid. The first time I click the button to load more data, instead of showing record (for example) 1 – 100, WebGrid shows data 51 – 100.

I will have this discussed with WebGrid development team to find out whether it is ok or not to set the WebGrid’s data source in such way when custom virtual load is enabled. I will get back to you as soon as I heard something from the team regarding this.

Hi Yudi,

Anything you heard from your developement team.

Regards,

Madhavan

I haven’t heard any news from the team yet, but I will surely updates in the next couple of days.

Hi Yudi,

Please advice us with update on this incident.

Regards,

Madhavan

Apologize for the delay in sending this.

When enabled, VirtualLoad paging feature work as follow: initially load 50 rows (or n number of rows as specified in VirtualPageSize property); as user scroll the data forward more data will be retrieved from server transparently and virtually; previously displayed data is retained along with the currently required page.

On the custom mode, developers need to specify the data fetching logic. Per your request, you will need to query the data so that it will return n rows of data as specified in VirtualPageSize property (not load top n rows). I use following select query to return n rows of data.

"WITH NumberedMyTable AS ( SELECT ProductId, ProductName, ROW_NUMBER() OVER (ORDER BY ProductId) AS RowNumber FROM Products ) SELECT ProductId, ProductName FROM NumberedMyTable WHERE RowNumber BETWEEN " + fromRown + " AND " + toRowm,

Next, we will need to combine this data with the previously displayed data. To obtain the previously displayed data, we can invoke the GetCachedDataSource() method. This method returns the data source object that kept in cache.

Alternatively, you can try to use the classic paging mode. Hope this helps.

Hi Yudi,

How the classic paging will help?

Because it is also binding the entire data.

We want to achieve the binding of only specified records.

Please add this paging requirement as a feature request?

Regards,
Madhavan