gal mor
gal mor

Reputation: 59

Display a telerikgrid in blazor on a button click - wont load

I have a blazor component. Im trying to display a test table once a button is clicked like so:

<button id="btnKltClms" class="slikaButton" @onclick="TestClick" hidden="@isBtnKltClmsHidden"></button>

  <div hidden="@isTbResultsHidden"> 
 <TelerikGrid Data="@resultTableData">
    <GridColumns>
        <GridColumn Field="@nameof(ResultTableRow_Klt_Clms.CompanyName)" Title="חברה" />
        <GridColumn Field="@nameof(ResultTableRow_Klt_Clms.CompanyNumber)" Title="מספר חברה" />
        <GridColumn Field="@nameof(ResultTableRow_Klt_Clms.DeliveryNumber)" Title="מספר משלוח" />
        <GridColumn Field="@nameof(ResultTableRow_Klt_Clms.RecordedEntriesNumber)" Title="מספר רשומות שנקלטו" />
        <GridColumn Field="@nameof(ResultTableRow_Klt_Clms.ShguimEntriesNumber)" Title="מספר רשומות שגויות" />
    </GridColumns>
</TelerikGrid> 
  </div>

And thats my code behind file:

       async Task TestClick()
       {
           resultTableData.Clear();
           for (int i = 0; i <= 5; i++)
           {
               current_Company1 = $"curComp{i}";
               current_Company_name1 = $"curCompName{i}";
               CURRENT_MISHLOACH1 = $"mishloah{i}";
               TOTAL_SHG_D1 = $"totalShg{i}";
               await BuildResultTable();
           }
           StateHasChanged();
       }

       async Task BuildResultTable()
       {
           resultTableData.Add(new ResultTableRow_Klt_Clms
           {
               CompanyName = StringUtil.Reverse(current_Company_name1),
               CompanyNumber = current_Company1.ToString(),
               DeliveryNumber = CURRENT_MISHLOACH1.ToString(),
               RecordedEntriesNumber = (recordarr.Length - 2).ToString(),
               ShguimEntriesNumber = TOTAL_SHG_D1.ToString()
           });
           isTbResultsHidden = false;
           isLabelErrorHidden = false;
           StateHasChanged();
       }

When I check in debug, obviously the list will include 6 items. When table is displayed ( after a button click it will display an empty table

Ive been trying to "play" with signatures , async void, async Task, await, not await, all of that.

Ive been also trying to do this

await InvokeAsync(() => StateHasChanged());

but its clear that something in that logic is beyond my understanding as of now. Any ideas? Thanks !!

Upvotes: 1

Views: 138

Answers (1)

Raphael
Raphael

Reputation: 66

You need to rebind the Grid after changing the Data:

At the end of TestClick() add

GridRef?.Rebind();

No need for StateHasChanged.

Also change your grid definition to

 <TelerikGrid @ref="@GridRef" Data="@resultTableData">

And add a variable

    private TelerikGrid<ResultTableRow_Klt_Clms> GridRef { get; set; }

Upvotes: 2

Related Questions