title: Blazor - Reload Grid component
body: <p>I created the razor page with add and display values in grid in same page. While adding the records, it is saving in database but after saving the records grid is not refreshed. I need to reload the grid component only since i need to display success message in same page.</p>
  <p>Here is my code:</p>
  <p>Grid.razor:</p>
  <pre><code>    @typeparam TableItem
  
  &lt;table&gt;
      &lt;thead&gt;
          &lt;tr class=&quot;blazor-grid-header&quot;&gt;@GridHeader&lt;/tr&gt;
      &lt;/thead&gt;
      &lt;tbody&gt;
          @foreach (var item in ItemList)
          {
  &lt;tr class=&quot;blazor-row-item&quot;&gt;@GridRow(item)&lt;/tr&gt;}
      &lt;/tbody&gt;
  &lt;/table&gt;
  &lt;div class=&quot;pagination&quot;&gt;
  
      &lt;button class=&quot;btn pagebutton btn-info&quot; onclick=@(new Action(async () =&gt; SetPagerSize(&quot;back&quot;)))&gt;&amp;laquo;&lt;/button&gt;
      &lt;button class=&quot;btn pagebutton btn-secondary&quot; onclick=@(new Action(async () =&gt; NavigateToPage(&quot;previous&quot;)))&gt;Prev&lt;/button&gt;
  
      @for (int i = startPage; i &lt;= endPage; i++)
      {
          var currentPage = i;
  &lt;button class=&quot;btn pagebutton @(currentPage==curPage?&quot;currentpage&quot;:&quot;&quot;)&quot; onclick=@(new Action(async () =&gt; updateList(currentPage)))&gt;
      @currentPage
  &lt;/button&gt;}
  
      &lt;button class=&quot;btn pagebutton btn-secondary&quot; onclick=@(new Action(async () =&gt; NavigateToPage(&quot;next&quot;)))&gt;Next&lt;/button&gt;
      &lt;button class=&quot;btn pagebutton btn-info&quot; onclick=@(new Action(async () =&gt; SetPagerSize(&quot;forward&quot;)))&gt;&amp;raquo;&lt;/button&gt;
  
      &lt;span class=&quot;pagebutton btn btn-link disabled&quot;&gt;Page @curPage of @totalPages&lt;/span&gt;
  
  &lt;/div&gt;
  
  @functions { int totalPages;
      int curPage;
      int pagerSize;
  
      int startPage;
      int endPage;
  
      /// &lt;summary&gt;
      /// Header for BlazorGrid.
      /// &lt;/summary&gt;
      [Parameter]
      public RenderFragment GridHeader { get; set; }
  
      /// &lt;summary&gt;
      /// Rows for BlazorGrid.
      /// &lt;/summary&gt;
      [Parameter]
      public RenderFragment&lt;TableItem&gt; GridRow { get; set; }
  
      /// &lt;summary&gt;
      /// The list of item supplied to the BlazorGrid.
      /// &lt;/summary&gt;
      [Parameter]
      public IEnumerable&lt;TableItem&gt; Items { get; set; }
  
      /// &lt;summary&gt;
      /// Size of each page of BlazorGrid. This is a required field.
      /// &lt;/summary&gt;
      [Parameter]
      public int PageSize { get; set; }
  
      public IEnumerable&lt;TableItem&gt; ItemList { get; set; }
  
  
      protected override async Task OnInitializedAsync()
      {
          pagerSize = 5;
          curPage = 1;
  
          ItemList = Items.Skip((curPage - 1) * PageSize).Take(PageSize);
          totalPages = (int)Math.Ceiling(Items.Count() / (decimal)PageSize);
  
          SetPagerSize(&quot;forward&quot;);
      }
  
      public void updateList(int currentPage)
      {
          ItemList = Items.Skip((currentPage - 1) * PageSize).Take(PageSize);
          curPage = currentPage;
          this.StateHasChanged();
      }
  
      public void SetPagerSize(string direction)
      {
          if (direction == &quot;forward&quot; &amp;&amp; endPage &lt; totalPages)
          {
              startPage = endPage + 1;
              if (endPage + pagerSize &lt; totalPages)
              {
                  endPage = startPage + pagerSize - 1;
              }
              else
              {
                  endPage = totalPages;
              }
              this.StateHasChanged();
          }
          else if (direction == &quot;back&quot; &amp;&amp; startPage &gt; 1)
          {
              endPage = startPage - 1;
              startPage = startPage - pagerSize;
          }
      }
  
      public void NavigateToPage(string direction)
      {
          if (direction == &quot;next&quot;)
          {
              if (curPage &lt; totalPages)
              {
                  if (curPage == endPage)
                  {
                      SetPagerSize(&quot;forward&quot;);
                  }
                  curPage += 1;
              }
          }
          else if (direction == &quot;previous&quot;)
          {
              if (curPage &gt; 1)
              {
                  if (curPage == startPage)
                  {
                      SetPagerSize(&quot;back&quot;);
                  }
                  curPage -= 1;
              }
          }
  
          updateList(curPage);
      } } 
  </code></pre>
  <p>PlantMaster.razor:</p>
  <pre><code> @page &quot;/&quot;
      @inherits PlantMasterBase
  
  
  &lt;h3&gt;Plants&lt;/h3&gt;
  
  &lt;Alert @ref=&quot;AlertMessage&quot; Color=&quot;Color.Success&quot;&gt;
      &lt;Heading&gt;
          Success
          &lt;CloseButton @onclick=&quot;AlertMessage.Hide&quot; /&gt;
      &lt;/Heading&gt;
  
      @if (AlertMode == &quot;Add&quot;)
      {
          &lt;Paragraph&gt;
              Plant has been added successfully...
          &lt;/Paragraph&gt;
      }
      else
      {
          &lt;Paragraph&gt;
              Plant has been updated successfully...
          &lt;/Paragraph&gt;
      }
  &lt;/Alert&gt;
  
      &lt;EditForm Model=&quot;@Plant&quot;&gt;
      &lt;div class=&quot;form-group row&quot;&gt;
          &lt;label for=&quot;plantName&quot; class=&quot;col-sm-2 col-form-label&quot;&gt;
              Plant Name:
          &lt;/label&gt;
          &lt;div class=&quot;col-sm-10&quot;&gt;
              &lt;InputText id=&quot;plantName&quot; class=&quot;form-control&quot; placeholder=&quot;Plant Name&quot; @bind-Value=&quot;Plant.PlantName&quot;&gt;&lt;/InputText&gt;
          &lt;/div&gt;
      &lt;/div&gt;
      &lt;div class=&quot;form-group row&quot;&gt;
          &lt;label for=&quot;address&quot; class=&quot;col-sm-2 col-form-label&quot;&gt;
              Address:
          &lt;/label&gt;
          &lt;div class=&quot;col-sm-10&quot;&gt;
              &lt;InputText id=&quot;address&quot; class=&quot;form-control&quot; placeholder=&quot;Address&quot; @bind-Value=&quot;Plant.Address&quot;&gt;&lt;/InputText&gt;
          &lt;/div&gt;
      &lt;/div&gt;
      &lt;button class=&quot;btn btn-primary&quot; type=&quot;button&quot; id=&quot;AddClick&quot; @onclick=&quot;Add_Click&quot;&gt;Add&lt;/button&gt;
      &lt;/EditForm&gt;
  
      @if (Plants == null)
      {
          &lt;div class=&quot;spinner&quot;&gt;&lt;/div&gt;
      }
      else
      {
          &lt;Grid Items=&quot;@Plants&quot; PageSize=&quot;5&quot;&gt;
              &lt;GridHeader&gt;
                  &lt;th&gt;PlantName&lt;/th&gt;
                  &lt;th&gt;Address&lt;/th&gt;
                  &lt;th&gt;Action&lt;/th&gt;
              &lt;/GridHeader&gt;
              &lt;GridRow&gt;
                  &lt;td&gt;@context.PlantName&lt;/td&gt;
                  &lt;td&gt;@context.Address&lt;/td&gt;
                  &lt;td&gt;
                      &lt;button class=&quot;btn btn-primary&quot; type=&quot;button&quot; @onclick=&quot;(() =&gt; ShowModal(context.PlantId))&quot;&gt;Edit&lt;/button&gt;
                  &lt;/td&gt;
              &lt;/GridRow&gt;
          &lt;/Grid&gt;
      }
  
      @code{
      public IEnumerable&lt;Plant&gt; Plants { get; set; }
  
      protected override async Task OnInitializedAsync()
      {
          Plants = await GetPlants();
      }
  
      protected async Task Add_Click()
      {
          await PlantRepository.AddPlant(Plant);
          Plants = await GetPlants();
          AlertMessage.Show();
          AlertMode = &quot;Add&quot;;
          StateHasChanged();
      }
  }
  </code></pre>
  <p>Please help me to resolve this reload issue?</p>