0

I have a blazor server app. The main layout of the pages is consisting of 1) Side Navigation screen 2) Header screen and 3) the body screen in the center of the page In the main screen (Page1) the client has to make a machine selection from a drop-down select box. What I want is very simple: I want that the selected machine is also shown immediatly in the header part(Page2). I have programmed a data-binding like below. But if a machine is selected , it is not shown in the header screen. Just when I manual reload the page I see the correct selected machine in the header screen. What is missing in my data binding?

Page1 (Body razor page in the "Pages" directory) Here is the data generated

@page "/Selection" 
<select value="@selected_Machine" class="MAE" @onchange="func_MAE">
<option value="">-- Select Machine --</option>
<option value="">-- Machine-1 --</option>
<option value="">-- Machine-2 --</option>
<option value="">-- Machine-3 --</option>    
</select>

@code {
 public static string selected_Machine { get; set; }; 
 void func_MAE(Microsoft.AspNetCore.Components.ChangeEventArgs e)
    {          
      selected_Machine = e.Value.ToString();
    }
}

Page2 (Header razor page in the "Shared" directory) Here the data should be actualised immediatly when data changes in Page1.

<p>Selected Machine: @Pages.Page1.selected_Machine</p>
Mdarende
  • 469
  • 3
  • 13
  • Sounds like what you are looking for is `StateHasChanged()` REF: https://learn.microsoft.com/en-us/aspnet/core/blazor/components/rendering?view=aspnetcore-6.0 – Adam Vincent Jul 07 '22 at 18:47
  • Take a look at my answer to this question - https://stackoverflow.com/questions/70713133/blazor-child-component-rendering-and-parameter-changes. Your "Machine data" belongs in a service that all your components can access with an event to notify when it changes, and the components can trigger a re-render. There's also a gist here - https://gist.github.com/ShaunCurtis/7e7b09b0403b8b707d0ddb502e4e0c8c – MrC aka Shaun Curtis Jul 07 '22 at 19:25
  • @AdamVincent - calling `StateHasChanged` to make a component re-render either means: 1. You're coding a standard event handler. 2. You're in a multi-step process and want to update the UI of progress, or 3. [99.x% of the cases] Your logic/code is wrong. Here its 3. In Blazor code peer review top of my list would be a search for `StateHasChanged` and then ask Why? – MrC aka Shaun Curtis Jul 07 '22 at 19:37
  • I left it as a comment, because it's simply pointing to the next step in learning the platform. If your information is more complete, leave an answer. – Adam Vincent Jul 07 '22 at 19:52

0 Answers0