Completed
Last Updated: 16 Jan 2020 09:32 by ADMIN
Release 2.6.1
Nick
Created on: 14 Nov 2019 18:01
Category: Grid
Type: Bug Report
8
OnRead called twice on initialization

Hi,

I've noticed some odd behaviour where the OnRead event is being called twice. Initially I thought it was my code, but I've got to a bizarre example where having two Console.WriteLine statements causes the repeated call, but having one doesn't!

In my testing with more code in the method it hasn't been consistent, so I'm not sure if it's a timing/threading issue. I have tested with the following:

  • Browser: Firefox and Chrome
  • VS: 16.4 Preview 5.
  • .Net Core: 3.1 Preview 2
  • Telerik: 2.3

My test code looks like this:

 

@layout EmptyLayout
@page "/testgrid"
<TelerikGrid Data=@GridData TotalCount=@Total
             Pageable=true PageSize=15
             OnRead=@ReadItems>
    <GridColumns>
        <GridColumn Field=@nameof(Employee.Id) Title="ID" />
        <GridColumn Field=@nameof(Employee.Name) Title="Name" />
    </GridColumns>
</TelerikGrid>
 
@code {
    public List<Employee> GridData { get; set; }
    public int Total { get; set; } = 0;
 
    protected async Task ReadItems(GridReadEventArgs args)
    {
        Console.WriteLine("ReadItems 1");
        // Remove this line and ReadItems is only called once!!!
        Console.WriteLine("ReadItems 2");
 
        // Adding this makes no difference
        //await Task.Delay(1);
    }
 
    public class DataEnvelope
    {
        public List<Employee> CurrentPageData { get; set; }
        public int TotalItemCount { get; set; }
    }
 
    public class Employee
    {
        public int Id { get; set; }
        public string Name { get; set; }
    }
}

 

Any help appreciated!
Thanks.

 

8 comments
ADMIN
Marin Bratanov
Posted on: 13 Jan 2020 16:49

Hi Alberto,

It is also important to note that when server pre-rendered components are used, the server rendeing goes through almost all the lifecycle initially, and some thing are expected to get hit twice.

When I tested this workaround it worked for me and I saw data, and at this point my best advice is to compare the code you have with our documentation - I see that the StateHasChanged() call at the end of the OnRead handler is missing and this can be a very probable cause why the data is not rendered in the grid.

if this does not help, please open a support ticket and send me an example of the problem so I can debug and investigate, and so we can avoid spamming other people here.

 

Regards,
Marin Bratanov
Progress Telerik

 UI for Blazor
Alberto
Posted on: 13 Jan 2020 11:08

If i remove workaround it loads data if not it doesnt load anything

 

protected async Task ReadHandler(GridReadEventArgs args)
    {
        //WORKAROUND DOUBLE CALL
        RequestsCount++;
        if (RequestsCount == 1) { return; }
        //END
        Skip = args.Request.Skip;
        await LoadFE();
    }

Alberto
Posted on: 13 Jan 2020 11:07
I tried the workaround but it doesnt load anything in the grid if it doesnt make the two calls. 
ADMIN
Marin Bratanov
Posted on: 13 Jan 2020 06:01

Here is a simple workaround (you can tweak it to match your coding preferences better if you like):

@using Telerik.DataSource.Extensions

<TelerikGrid Data=@GridData TotalCount=@Total OnRead=@ReadItems
             FilterMode=@GridFilterMode.FilterRow Sortable=true Pageable=true EditMode="@GridEditMode.Inline">
    <GridColumns>
        <GridColumn Field=@nameof(Employee.ID) />
        <GridColumn Field=@nameof(Employee.Name) Title="Name" />
        <GridColumn Field=@nameof(Employee.HireDate) Title="Hire Date" />
        <GridCommandColumn>
            <GridCommandButton Command="Save" Icon="save" ShowInEdit="true">Update</GridCommandButton>
            <GridCommandButton Command="Edit" Icon="edit">Edit</GridCommandButton>
            <GridCommandButton Command="Delete" Icon="delete">Delete</GridCommandButton>
            <GridCommandButton Command="Cancel" Icon="cancel" ShowInEdit="true">Cancel</GridCommandButton>
        </GridCommandColumn>
    </GridColumns>
    <GridToolBar>
        <GridCommandButton Command="Add" Icon="add">Add Employee</GridCommandButton>
    </GridToolBar>
</TelerikGrid>

@code {
    public List<Employee> SourceData { get; set; }
    public List<Employee> GridData { get; set; }
    public int Total { get; set; } = 0;

    //WORKAROUND
    int RequestsCount { get; set; }

    protected override void OnInitialized()
    {
        SourceData = GenerateData();
    }

    protected async Task ReadItems(GridReadEventArgs args)
    {
        //WORKAROUND
        RequestsCount++;
        if (RequestsCount == 1) { return; }
        //END WORKAROUND

        Console.WriteLine("data requested: " + args.Request);

        var datasourceResult = SourceData.ToDataSourceResult(args.Request);

        GridData = (datasourceResult.Data as IEnumerable<Employee>).ToList();
        Total = datasourceResult.Total;

        StateHasChanged();
    }

    private List<Employee> GenerateData()
    {
        var result = new List<Employee>();
        var rand = new Random();
        for (int i = 0; i < 100; i++)
        {
            result.Add(new Employee()
            {
                ID = i,
                Name = "Name " + i,
                HireDate = DateTime.Now.Date.AddDays(rand.Next(-20, 20))
            });
        }

        return result;
    }

    public class Employee
    {
        public int ID { get; set; }
        public string Name { get; set; }
        public DateTime HireDate { get; set; }
    }
}

 

Regards,
Marin Bratanov
Progress Telerik

 UI for Blazor
ADMIN
Marin Bratanov
Posted on: 20 Nov 2019 09:43

Hi Nick,

On my end it happens consistently, so I have logged it for general review. I just wanted to get all pertinent information, knowing a pattern helps with bug hunting.

 

Regards,
Marin Bratanov
Progress Telerik

 UI for Blazor
Nick
Posted on: 19 Nov 2019 13:57

Hi Marin,

I was getting inconsistent behaviour, which made it hard to nail down. Initially I was removing code from OnRead to try and identify the problem (assuming it was me), and at some point it stopped happening. I then reintroduced code and it started happening again, but I could find no correlation between my code and the double firing.

The console.writeline was fairly consistent for me, but it could be environmental. Sorry I'm not much help!

Nick.

 

 

 

ADMIN
Marin Bratanov
Posted on: 18 Nov 2019 14:58

Hi Nick,

I moved this to the feedback portal because on my end OnRead fires twice on every initialization, both in a client, and in a server app, and the Console.WriteLine() statements don't have a relation to that for me. You can Follow its status here: https://feedback.telerik.com/blazor/1442276-onread-called-twice-on-initialization.

Does this happen when you don't have any Console.WriteLine() statements? Does it happen if you have exactly two? Also, if the Console.WriteLine() statements change the number of times an even is called, this may be somehow related to how many times the component where the grid is declared is initialized. How many times does the OnInitialized method get called on your end? I'm asking these questions to get a better understanding of the behavior you see, because on my end it's the same in all cases and there aren't any special factors.

 

Regards,
Marin Bratanov
Progress Telerik

 UI for Blazor
Nick
Posted on: 14 Nov 2019 18:05
See attached file for output from the Console..
Attached Files: