Migrate Grid scrolling example to v3.0 (#160)

Co-authored-by: Dimo Dimov <dimo@Dimos-MacBook-Pro.local>

Author: dimodi

grid/scroll-to-selected-row/scroll-to-selected-row/Pages/RegularPaging.razor

@@ -46,4 +46,4 @@
     {
         GridData = await DataService.GenerateData();
     }
-}
+}

grid/scroll-to-selected-row/scroll-to-selected-row/Pages/Virtualization.razor

@@ -9,16 +9,16 @@
 
 <TelerikButton OnClick="@SelectItem">Select item 48</TelerikButton>
 
-<TelerikGrid Data=@GridData
+<TelerikGrid @ref="@GridRef"
+             TItem="@Employee"
+             OnRead="@ReadItems"
              SelectionMode="GridSelectionMode.Single"
              @bind-SelectedItems="@SelectedItems"
+             Sortable="true"
              ScrollMode="@GridScrollMode.Virtual"
              RowHeight="40"
              PageSize="@PageSize"
-             @ref="@GridRef"
-             TotalCount=@Total OnRead="@ReadItems"
-             Height="300px"
-             Sortable="true">
+             Height="300px">
     <GridColumns>
         <GridColumn Field=@nameof(Employee.Name) />
         <GridColumn Field=@nameof(Employee.Team) Title="Team" />
@@ -27,9 +27,9 @@
 
 @code {
     string theGridClass { get; set; } = "theSpecialGrid";
-    TelerikGrid<Employee> GridRef { get; set; }
-    int Total { get; set; }
-    List<Employee> GridData { get; set; }
+    TelerikGrid<Employee> GridRef { get; set; }
+    int GridDataCount { get; set; }
+    int AllDataCount { get; set; }
     int PageSize { get; set; } = 20;
     DataSourceRequest lastRequest { get; set; }
 
@@ -70,19 +70,17 @@
         //this should actually be happening on the server, but for brevity we do it here
         //see more at https://github.com/telerik/blazor-ui/tree/master/grid/datasourcerequest-on-server
         var datasourceResult = AllData.ToDataSourceResult(args.Request);
-        GridData = (datasourceResult.Data as IEnumerable<Employee>).ToList();
-        Total = datasourceResult.Total;
+        var data = (datasourceResult.Data as IEnumerable<Employee>).ToList();
+        args.Data = data;
+        args.Total = AllDataCount = datasourceResult.Total;
+        GridDataCount = data.Count;
 
-
-        // see more about why this is done here https://docs.telerik.com/blazor-ui/knowledge-base/grid-large-skip-breaks-virtualization
+        // see more about why this is done here https://docs.telerik.com/blazor-ui/knowledge-base/grid-large-skip-breaks-virtualization
         int allowedSkip = ValidateSkip(args.Request.Skip);
         if (allowedSkip != args.Request.Skip)
         {
             await SetSkip(allowedSkip);
         }
-
-
-        await InvokeAsync(StateHasChanged);
     }
 
     async Task SetSkip(int skip)
@@ -108,8 +106,8 @@
     {
         if (desiredSkip < 0) return 0;
         int itemsThatFitPerPage = 7; // see how the grid renders and determine this from there
-        bool isInvalidSkip = GridData.Count < itemsThatFitPerPage;
-        return isInvalidSkip ? Total - itemsThatFitPerPage : desiredSkip;
+        bool isInvalidSkip = GridDataCount < itemsThatFitPerPage;
+        return isInvalidSkip ? AllDataCount - itemsThatFitPerPage : desiredSkip;
     }
 
     // data generation follows
@@ -120,4 +118,4 @@
     {
         AllData = await DataService.GenerateData();
     }
-}
+}

grid/scroll-to-selected-row/scroll-to-selected-row/Services/GridDataService.cs

@@ -11,7 +11,7 @@ public class GridDataService
         public async Task<List<Employee>> GenerateData()
         {
             List<Employee> data = new List<Employee>();
-            for (int i = 0; i < 55; i++)
+            for (int i = 1; i <= 100; i++)
             {
                 data.Add(new Employee()
                 {

grid/scroll-to-selected-row/scroll-to-selected-row/scroll_to_selected_row.csproj

@@ -5,7 +5,7 @@
   </PropertyGroup>
 
   <ItemGroup>
-    <PackageReference Include="Telerik.UI.for.Blazor" Version="2.26.0" />
+    <PackageReference Include="Telerik.UI.for.Blazor" Version="3.0.1" />
   </ItemGroup>
 
 </Project>