title: Blazor List Refresh After Update
body: <p><strong>This post is entirely updated to put all code in one class and to try to make it as straight-forward as possible.</strong></p>
  <p><strong>The project works perfectly EXCEPT for one thing:</strong> <em>When a student record is updated, the database is updated, but the visible list does not update</em>.</p>
  <p>The only way I've been able to see the changes is when I refresh the entire page (see NavigationManager line at bottom of code).</p>
  <p>Can you please help me understand what I'm not doing right here.</p>
  <pre><code>@page &quot;/Students2&quot;;
  @using ParentChild.Models;
  @inject IJSRuntime JS;                          // Used for Confirmation Dialog &amp; Alert Box
  @inject NavigationManager NavigationManager     // Used to Refresh Entire Page
  
  &lt;h3&gt;Students 2&lt;/h3&gt;
  
  @if (byStudents == null)
  {
      &lt;p&gt;&lt;em&gt;Loading...&lt;/em&gt;&lt;/p&gt;
  }
  else if (!byStudents.Any())
  {
      &lt;p&gt;&lt;em&gt;No students in database.  Please add some.&lt;/em&gt;&lt;/p&gt;
  }
  else
  {
      &lt;table class=&quot;table&quot;&gt;
          &lt;thead&gt;
              &lt;tr&gt;
                  &lt;th&gt;First&lt;/th&gt;
                  &lt;th&gt;Last&lt;/th&gt;
                  &lt;th&gt;Street&lt;/th&gt;
                  &lt;th&gt;City&lt;/th&gt;
                  &lt;th&gt;State&lt;/th&gt;
                  &lt;th&gt;Zip&lt;/th&gt;
                  &lt;th&gt;Cell&lt;/th&gt;
                  &lt;th&gt;Home&lt;/th&gt;
                  &lt;th&gt;Email&lt;/th&gt;
                  &lt;th&gt;Note&lt;/th&gt;
                  &lt;th&gt;&lt;/th&gt;
              &lt;/tr&gt;
          &lt;/thead&gt;
          &lt;tbody&gt;
              @foreach (var byStudent in byStudents)
              {
                  &lt;tr&gt;
                      &lt;td&gt;@byStudent.SFirst&lt;/td&gt;
                      &lt;td&gt;@byStudent.SLast&lt;/td&gt;
                      &lt;td&gt;@byStudent.SStreet&lt;/td&gt;
                      &lt;td&gt;@byStudent.SCity&lt;/td&gt;
                      &lt;td&gt;@byStudent.SState&lt;/td&gt;
                      &lt;td&gt;@byStudent.SZip&lt;/td&gt;
                      &lt;td&gt;@byStudent.SCell&lt;/td&gt;
                      &lt;td&gt;@byStudent.SHome&lt;/td&gt;
                      &lt;td&gt;@byStudent.SEmail&lt;/td&gt;
                      &lt;td&gt;@byStudent.SNote&lt;/td&gt;
                      &lt;td&gt;
                          &lt;input type=&quot;button&quot; class=&quot;btn btn-primary&quot; @onclick=&quot;@(() =&gt; OpenEditStudent(@byStudent.SId))&quot; value=&quot;Edit&quot; /&gt;
                          &lt;nbsp&gt;&lt;/nbsp&gt;
                          &lt;input type=&quot;button&quot; class=&quot;btn btn-danger&quot; @onclick=&quot;@(async () =&gt; await DeleteStudentAction(@byStudent.SId))&quot; value=&quot;Delete&quot; /&gt;
                      &lt;/td&gt;
                  &lt;/tr&gt;
              }
          &lt;/tbody&gt;
      &lt;/table&gt;
  }
  
  &lt;button class=&quot;btn btn-primary&quot; @onclick=&quot;() =&gt; OpenAddStudent()&quot;&gt;Add New Student&lt;/button&gt;
  
  @if (showBackdrop)
  {
      &lt;div class=&quot;modal-backdrop fade show&quot;&gt;&lt;/div&gt;
  }
  
  &lt;!-- Define Modal Pop-UP in this Page --&gt;
  &lt;div class=&quot;modal @modalClass&quot; tabindex=&quot;-1&quot; role=&quot;dialog&quot; style=&quot;display:@modalDisplay; overflow-y: auto;&quot;&gt;
      &lt;div class=&quot;modal-dialog modal-lg&quot; role=&quot;document&quot;&gt;
          &lt;div class=&quot;modal-content&quot;&gt;
              &lt;div class=&quot;modal-header&quot;&gt;
                  &lt;h5 class=&quot;modal-title&quot;&gt;
                      &lt;!-- Pop-Up Title Section --&gt;
                      @{
                          var txt = &quot;&quot;;
                          if ((SId == null) | (SId == &quot;&quot;))
                          {
                              txt = &quot;Add Student&quot;;
                              @txt;
  
                          }
                          else
                          {
                              txt = &quot;Edit Student&quot;;
                              @txt;
                          }
                      }
                  &lt;/h5&gt;
                  &lt;!-- Pop-Up Close Button at Top --&gt;
                  &lt;button type=&quot;button&quot; class=&quot;close&quot; data-dismiss=&quot;modal&quot; aria-label=&quot;Close&quot; @onclick=&quot;Close&quot;&gt;
                      &lt;span aria-hidden=&quot;true&quot;&gt;&amp;times;&lt;/span&gt;
                  &lt;/button&gt;
              &lt;/div&gt;
              &lt;div class=&quot;modal-body&quot;&gt;
                  &lt;!-- Pop-Up Body Section --&gt;
                  &lt;div class=&quot;form-group row&quot;&gt;
                      &lt;input id=&quot;SId&quot; @bind=&quot;SId&quot; type=&quot;hidden&quot; class=&quot;col-sm-4 form-control&quot; /&gt;
                  &lt;/div&gt;
                  &lt;div class=&quot;form-group row&quot;&gt;
                      &lt;label for=&quot;@SFirst&quot; class=&quot;col-sm-8 col-form-label&quot;&gt;First Name:&lt;/label&gt;
                      &lt;input id=&quot;SFirst&quot; @bind=&quot;SFirst&quot; class=&quot;col-sm-4 form-control&quot; /&gt;
                  &lt;/div&gt;
                  &lt;div class=&quot;form-group row&quot;&gt;
                      &lt;label for=&quot;@SLast&quot; class=&quot;col-sm-8 col-form-label&quot;&gt;Last Name:&lt;/label&gt;
                      &lt;input id=&quot;SLast&quot; @bind=&quot;SLast&quot; class=&quot;col-sm-4 form-control&quot; /&gt;
                  &lt;/div&gt;
                  &lt;div class=&quot;form-group row&quot;&gt;
                      &lt;label for=&quot;@SStreet&quot; class=&quot;col-sm-8 col-form-label&quot;&gt;Street:&lt;/label&gt;
                      &lt;input id=&quot;@SStreet&quot; @bind=&quot;SStreet&quot; class=&quot;col-sm-4 form-control&quot; /&gt;
                  &lt;/div&gt;
                  &lt;div class=&quot;form-group row&quot;&gt;
                      &lt;label for=&quot;@SCity&quot; class=&quot;col-sm-8 col-form-label&quot;&gt;City:&lt;/label&gt;
                      &lt;input id=&quot;@SCity&quot; @bind=&quot;SCity&quot; class=&quot;col-sm-4 form-control&quot; /&gt;
                  &lt;/div&gt;
                  &lt;div class=&quot;form-group row&quot;&gt;
                      &lt;label for=&quot;@SState&quot; class=&quot;col-sm-8 col-form-label&quot;&gt;State:&lt;/label&gt;
                      &lt;input id=&quot;@SState&quot; @bind=&quot;SState&quot; class=&quot;col-sm-4 form-control&quot; /&gt;
                  &lt;/div&gt;
                  &lt;div class=&quot;form-group row&quot;&gt;
                      &lt;label for=&quot;@SZip&quot; class=&quot;col-sm-8 col-form-label&quot;&gt;Zip:&lt;/label&gt;
                      &lt;input id=&quot;@SZip&quot; @bind=&quot;SZip&quot; class=&quot;col-sm-4 form-control&quot; /&gt;
                  &lt;/div&gt;
                  &lt;div class=&quot;form-group row&quot;&gt;
                      &lt;label for=&quot;@SCell&quot; class=&quot;col-sm-8 col-form-label&quot;&gt;Cell #:&lt;/label&gt;
                      &lt;input id=&quot;@SCell&quot; @bind=&quot;SCell&quot; class=&quot;col-sm-4 form-control&quot; /&gt;
                  &lt;/div&gt;
                  &lt;div class=&quot;form-group row&quot;&gt;
                      &lt;label for=&quot;@SHome&quot; class=&quot;col-sm-8 col-form-label&quot;&gt;Home #:&lt;/label&gt;
                      &lt;input id=&quot;@SHome&quot; @bind=&quot;SHome&quot; class=&quot;col-sm-4 form-control&quot; /&gt;
                  &lt;/div&gt;
                  &lt;div class=&quot;form-group row&quot;&gt;
                      &lt;label for=&quot;@SEmail&quot; class=&quot;col-sm-8 col-form-label&quot;&gt;Email:&lt;/label&gt;
                      &lt;input id=&quot;@SEmail&quot; @bind=&quot;SEmail&quot; class=&quot;col-sm-4 form-control&quot; /&gt;
                  &lt;/div&gt;
                  &lt;div class=&quot;form-group row&quot;&gt;
                      &lt;label for=&quot;@SNote&quot; class=&quot;col-sm-8 col-form-label&quot;&gt;Note:&lt;/label&gt;
                      &lt;input id=&quot;@SNote&quot; @bind=&quot;SNote&quot; class=&quot;col-sm-4 form-control&quot; /&gt;
                  &lt;/div&gt;
              &lt;/div&gt;
              &lt;div class=&quot;modal-footer&quot;&gt;
                  &lt;!-- Pop-Up Body Section --&gt;
                  @{
                      if ((SId == null) | (SId == &quot;&quot;))
                      {
                          &lt;button type=&quot;button&quot; class=&quot;btn btn-primary&quot; @onclick=&quot;async () =&gt; await AddStudentAction()&quot;&gt;Add&lt;/button&gt;
                      }
                      else
                      {
                          &lt;button type=&quot;button&quot; class=&quot;btn btn-primary&quot; @onclick=&quot;async () =&gt; await UpdateStudentAction(this.SId)&quot;&gt;Update&lt;/button&gt;
                      }
                  }
                  &lt;button type=&quot;button&quot; class=&quot;btn btn-secondary&quot; data-dismiss=&quot;modal&quot; @onclick=&quot;() =&gt; this.Close()&quot;&gt;Close&lt;/button&gt;
              &lt;/div&gt;
          &lt;/div&gt;
      &lt;/div&gt;
  &lt;/div&gt;
  
  
  @code {
  
      //-------------------------------------------------------------------------
      // Modal Control Variables and Code
      //-------------------------------------------------------------------------
      private string modalDisplay = &quot;none;&quot;;
      private string modalClass = &quot;&quot;;
      private bool showBackdrop = false;
  
      //--- Open Modal...
      public void Open()
      {
          modalDisplay = &quot;block;&quot;;
          modalClass = &quot;show&quot;;
          showBackdrop = true;
      }
  
      //--- Close Modal...
      public void Close()
      {
          modalDisplay = &quot;none&quot;;
          modalClass = &quot;&quot;;
          showBackdrop = false;
      }
  
  
  
      //-------------------------------------------------------------------------
      // Student List from Database
      //-------------------------------------------------------------------------
      DB_136837_byogaContext db = new DB_136837_byogaContext();
      private List&lt;ByStudents&gt; byStudents;
  
      //--- Build Student List on Page Initialization...
      protected override void OnInitialized()
      {
          byStudents = db.ByStudents.ToList();
      }
  
  
      //-------------------------------------------------------------------------
      // Modal Parameters
      //-------------------------------------------------------------------------
      private Modal modal { get; set; }
  
      [Parameter]
      public string SId { get; set; } = &quot;&quot;;
  
      [Parameter]
      public string SFirst { get; set; } = &quot;&quot;;
  
      [Parameter]
      public string SLast { get; set; } = &quot;&quot;;
  
      [Parameter]
      public string SStreet { get; set; } = &quot;&quot;;
  
      [Parameter]
      public string SCity { get; set; } = &quot;&quot;;
  
      [Parameter]
      public string SState { get; set; } = &quot;&quot;;
  
      [Parameter]
      public string SZip { get; set; } = &quot;&quot;;
  
      [Parameter]
      public string SCell { get; set; } = &quot;&quot;;
  
      [Parameter]
      public string SHome { get; set; } = &quot;&quot;;
  
      [Parameter]
      public string SEmail { get; set; } = &quot;&quot;;
  
      [Parameter]
      public string SNote { get; set; } = &quot;&quot;;
  
  
      //-------------------------------------------------------------------------
      // Open Modal to Add Student
      //-------------------------------------------------------------------------
      protected void OpenAddStudent()
      {
          //-- Clear Any Info Set in Previous Edit Requests...
          SId = &quot;&quot;;
          SFirst = &quot;&quot;;
          SLast = &quot;&quot;;
          SStreet = &quot;&quot;;
          SCity = &quot;&quot;;
          SState = &quot;&quot;;
          SZip = &quot;&quot;;
          SCell = &quot;&quot;;
          SHome = &quot;&quot;;
          SEmail = &quot;&quot;;
          SNote = &quot;&quot;;
  
          //--- Open Modal Popup...
          this.Open();
      }
  
  
      //-------------------------------------------------------------------------
      // Open Modal to Edit Student
      //-------------------------------------------------------------------------
      protected void OpenEditStudent(int myID)
      {
  
          //--- Build &amp; Run SQL Select Statement...
          using (var myContext = new DB_136837_byogaContext())
          {
              //--- Grab Info for Selected Student...
              var myQuery = (from s in myContext.ByStudents where s.SId == myID select s).Single();
  
              //--- Set Fields on Popup Form...
              this.SId = myQuery.SId.ToString();
              this.SFirst = myQuery.SFirst;
              this.SLast = myQuery.SLast;
              this.SStreet = myQuery.SStreet;
              this.SCity = myQuery.SCity;
              this.SState = myQuery.SState;
              this.SZip = myQuery.SZip;
              this.SCell = myQuery.SCell;
              this.SHome = myQuery.SHome;
              this.SEmail = myQuery.SEmail;
              this.SNote = myQuery.SNote;
          }
  
          //--- Open Modal Form...
          this.Open();
      }
  
  
      //-------------------------------------------------------------------------
      // Delete Selected Student from Database with Confirmation Dialog
      //-------------------------------------------------------------------------
      protected async Task DeleteStudentAction(int myID)
      {
  
          bool isConfirmed = await JS.InvokeAsync&lt;bool&gt;(&quot;confirm&quot;, $&quot;Do you sure you want to permanently delete whis record?&quot;);
  
          if (isConfirmed)
          {
              //--- Build &amp; Run SQL Delete Statement...
              using (var myContext = new DB_136837_byogaContext())
              {
                  var myQuery = (from d in myContext.ByStudents where d.SId == myID select d).Single();
                  myContext.ByStudents.Remove(myQuery);
                  myContext.SaveChanges();
              }
  
              //--- Delete Complete Dialog...
              await JS.InvokeVoidAsync(&quot;alert&quot;, &quot;Record Deleted&quot;);
  
              //--- Refresh Page...
              await InvokeAsync(() =&gt;
              {
                  StateHasChanged();
                  this.OnInitialized();
              });
          }
  
      }
  
  
      //-------------------------------------------------------------------------
      // Add Student to Database
      //-------------------------------------------------------------------------
      protected async Task AddStudentAction()
      {
          //--- Define the New Student...
          var newStudent = new ByStudents();
          newStudent.SFirst = SFirst;
          newStudent.SLast = SLast;
          newStudent.SStreet = SStreet;
          newStudent.SCity = SCity;
          newStudent.SState = SState;
          newStudent.SZip = SZip;
          newStudent.SCell = SCell;
          newStudent.SHome = SHome;
          newStudent.SEmail = SEmail;
          newStudent.SNote = SNote;
  
          //--- Add New Student to Database...
          using (var myContext = new DB_136837_byogaContext())
          {
              myContext.ByStudents.Add(newStudent);
              myContext.SaveChanges();
          }
  
          //--- Close the Popup...
          this.Close();
  
          //--- Refresh Page...
          await InvokeAsync(() =&gt;
          {
              StateHasChanged();
              this.OnInitialized();
          });
  
      }
  
  
      //-------------------------------------------------------------------------
      // Update Student in Database
      //-------------------------------------------------------------------------
      protected async Task UpdateStudentAction(string myID)
      {
  
          //--- Build &amp; Run SQL Select Statement...
          using (var myContext = new DB_136837_byogaContext())
          {
              //--- Update Info for Selected Student...
              var myQuery = (from d in myContext.ByStudents where d.SId == Convert.ToInt32(myID) select d).Single();
              myQuery.SFirst = this.SFirst;
              myQuery.SLast = this.SLast;
              myQuery.SStreet = this.SStreet;
              myQuery.SCity = this.SCity;
              myQuery.SState = this.SState;
              myQuery.SZip = this.SZip;
              myQuery.SCell = this.SCell;
              myQuery.SHome = this.SHome;
              myQuery.SEmail = this.SEmail;
              myQuery.SNote = this.SNote;
              myContext.ByStudents.Update(myQuery);
              myContext.SaveChanges();
          }
  
          //--- Close the Popup...
          this.Close();
  
          //--- Refresh Page...
          await InvokeAsync(() =&gt;
          {
              StateHasChanged();
              this.OnInitialized();
          });
  
          //--- Refresh Page by Reloading...SHOULD NOT HAVE TO DO THIS!
          //NavigationManager.NavigateTo(&quot;Refresh/Students2&quot;);
  
      }
  
  }
  </code></pre>
  <p>Any and all help is appreciated.  Thanks!</p>