This is a migrated thread and some comments may be shown as answers.

ServerPaging With Razor

6 Answers 455 Views

Grid

This is a migrated thread and some comments may be shown as answers.

Timothy J asked on 08 Oct 2019, 01:00 AM

I am trying to do ServerPaging with this example from telerik: https://github.com/telerik/ui-for-aspnet-core-examples/tree/master/grid/razor-pages-custom-datasource-date-editing/RazorPageGridTest/Pages/Customer

I have modified OnPostReadRecords by adding [DataSourceRequest] DataSourceRequest request

public JsonResult OnPostReadRecords([DataSourceRequest] DataSourceRequest request)

And I have added .ServerPaging(true) to the grid definition.

The resulting value of request is default and the page number is always '1'.

I am new to the telerik controls, so it's really like casting spells for me.

6 Answers, 1 is accepted

answered on 10 Oct 2019, 11:29 AM

Hi Timothy,

The project that you refer to uses a custom data source. When using the custom data soure all of the options are left for the developer to set. Therefore, you would have to handle the parameterMap for each of the CRUD operations.

However, I would recommend taking a predefined schema and parameter map by setting the type of the data source:

            .DataSource(d =>
                d.Custom()
                .Type("aspnetmvc-ajax")
                .ServerPaging(true)
                .ServerFiltering(true)
                .ServerSorting(true)
                .Transport(t =>
                {
                    t.Read(r => r.Action("Customer", "Index", new { handler = "ReadRecords" }).Type(HttpVerbs.Post));
                    t.Update(r => r.Action("Customer", "Index", new { handler = "UpdateRecord" }).Type(HttpVerbs.Post));
                    t.ParameterMap("parameterMap");
                })
                .Schema(s => s.Model(m =>
                {
                    m.Id(i => i.CustomerId);
                    m.Field("ClockOut", typeof(DateTime?));
                }).Total("Total").Data("Data"))
            )

As well as, you would have to indicate which fields from the response are holding the data of the grid and the number of items. Namely, the Data and Total options.

Lastly, on the server-side, you would have to create a DataSourceResult object. Or you can use the following method:

        public JsonResult OnPostReadRecords([DataSourceRequest] DataSourceRequest request)
        {
            List<RazorPageGridTest.Customer> data = new List<RazorPageGridTest.Customer>();

            for (int i = 1; i <= 100; i++)
            {
                data.Add(new RazorPageGridTest.Customer()
                {
                    CustomerId = i,
                    Name = "Name "+ i.ToString(),
                    Address = "Address " + i.ToString(),
                    ClockOut = DateTime.Now.AddHours(i)
                });
            }
            
            return new JsonResult(data.ToDataSourceResult(request));
        }

In case you would like to have just an ajax-bound grid, I would recommend taking a look at the example below which uses the predefined Ajax() data source:

https://github.com/telerik/ui-for-aspnet-core-examples/tree/master/grid/razor-pages-crud

Let me know in case further assistance is required.

Best regards,
Tsvetomir
Progress Telerik

Get quickly onboarded and successful with your Telerik and/or Kendo UI products with the Virtual Classroom free technical training, available to all active customers. Learn More.

Stoyan

commented on 27 Jan 2023, 05:36 PM

Hi Jorge,

Currently, I can't think of a reason why sending a GET request would be unsupported.

However one possible reason they would be rejected is if the AntiForgery token doesn't get attached or is not recognized by the backend.

Could you please ensure that is not the case?

Alternatively, if the issue persists consider sharing additional information about the configuration on your side. This will enable me to debug the issue further.

Thank you for your cooperation in advance.

Jorge Curiel

commented on 27 Jan 2023, 07:19 PM

Hi!

Currently paging it's not working if you are using asp net core with .net 7 with GET request for the read method of the grid datasource, I have some projects porting to net 7 that were working previously over net core 3.1 & net 6 and after the migration, sudenly the paging its not working anymore.

If you look at the answer provided by the telerik team on Timothy's post, also the samples works only over POST.

Regards!

Stoyan

commented on 02 Feb 2023, 04:52 PM

Hello Jorge,

The GridCrudOperations example from the Repo shared by Tsvetomir uses an Ajax DataSource that sends requests of type POST by default.

In the CustomDataSource example of the Grid showcases how you can configure the type of the request:

.DataSource(d =>
                d.Custom()
                .Transport(t =>
                {
                    t.Read(r => r.Action("Grid", "GridCustomDataSource", new { handler = "ReadRecords" }).Type(HttpVerbs.Get));
                    t.Update(r => r.Action("Grid", "GridCustomDataSource", new { handler = "UpdateRecord" }).Type(HttpVerbs.Post));
                    t.ParameterMap("parameterMap");
                })
               ...
                .PageSize(10)                
            )

Testing with that example I didn't notice any faults related to the paging. To showcase the behavior at my end I've recorded a screen capture. Am I missing something?

Ideally, it would be insightful, if you could share and isolated project with dummy data so I can continue the investigation.

Alternatively, you can create a test branch of the public repo, reproduce the behavior there and send me a link to test it on my end.

Regards,
Stoyan