Quantcast
Channel: Active questions tagged blazor - Stack Overflow
Viewing all articles
Browse latest Browse all 4839

StateHasChanged not updating UI

$
0
0

i know this is a common problem, but none of the solutions resolved my issue. All explanations seemed logical at first but after implementing them it did absolutely nothing and im kinda at a loss here.

Nothing I do to lets me update my UI component and just display some error messages which come from DataAnnotation attributes. I am manually checking my data model for validity and in the case of being invalid I'm updating a list of error messages which in turn should be displayed inside my UI.

This is my component:

<GridEditSettings AllowAdding="true" AllowEditing="true" AllowDeleting="true" Mode="EditMode.Dialog"  Dialog="DialogParams" ShowConfirmDialog="true"><Validator><DataAnnotationsValidator></DataAnnotationsValidator></Validator><Template>        @{            var unknownItem = (context as unknownasgdata);<div>                @if (validationResults.Any())                {<div class="validation-summary">                        @foreach (var validationResult in validationResults)                        {<div>@validationResult.ErrorMessage</div>                        }</div>                }<br/><div class="form-row"><div class="form-group col-md-6"><label><b>Bezeichnung</b></label><br />                    @(unknownItem.description)</div></div><div class="form-row"><div class="form-group col-md-6"><label><b>Betriebsstätte</b></label><br />                        @(unknownItem.house)</div></div><div class="form-row"><div class="form-group col-md-6"><label><b>Leistungsnummer</b></label><br />                        @(unknownItem.leinr)</div></div><div class="form-row"><div class="form-group col-md-6"><label><b>Preis</b></label><br /><SfNumericTextBox @bind-Value="@(unknownItem.articleprice)" ></SfNumericTextBox></div></div><br/><div class="form-row"><div class="form-group col-md-6"><label><b>Mahlzeitart</b></label><br/><SfDropDownList TValue="string" TItem="string" DataSource="@(new List<string> { "Frühstück", "Mittagessen", "Abendessen" })" @bind-Value="@(unknownItem.selectedMahlzeit)"></SfDropDownList></div> </div></div>        }</Template><FooterTemplate><SfButton OnClick="@SubmitForm" IsPrimary="true">Speichern</SfButton><SfButton OnClick="Cancel">Abbrechen</SfButton></FooterTemplate></GridEditSettings>@code{    private async Task<bool> ValidateModel()    {        validationResults.Clear();        bool isValid = Validator.TryValidateObject(unknownItem, validationContext, validationResults, true);        Task.Delay(3000);        return isValid;    }    private async Task SubmitForm()    {        if (await ValidateModel())        {            // Proceed with database updates            // Your database update logic here        }        else        {            // Handle validation failures            // Show validation messages            validationResults = new List<ValidationResult>(validationResults);            await Task.Delay(3000);            await InvokeAsync(() =>            {                StateHasChanged(); // Ensure the UI is updated to reflect validation errors            });            await Task.Yield();        }    }}

There is, of course, a bit of code missing here and there that is important to the class but you can just assume that the basics like initializing variables are working. What I am trying to do is just Submitting my Form and doing a Validation beforehand. ValidateModel() populates the List validationResults which I want to display in my razor component. In theory, shouldn't the component re render as soon as I update the List, since I am checking for elements inside my razor components? I tried calling StateHasChanged multiple times sync and async and using Task.Delay whenever I can but nothing works and nothing lets me update the UI.


Viewing all articles
Browse latest Browse all 4839

Trending Articles



<script src="https://jsc.adskeeper.com/r/s/rssing.com.1596347.js" async> </script>