I have a button like the one below on a razor server component page.The aim is that when the button is clicked, the button goes in disabled mode until the task is finished. This works on one of the pages, but I cannot manage to get it to work in other pages in the same application. The button does trigger the DoSearch() function and refreshes the content when it has finished, but it does not update itself half way through. Any ideas why please?
<button type="button" class="btn btn-primary" @onclick="DoSearch" disabled="@SearchDisabled">@SearchBtnName</button> protected bool SearchDisabled { get; set; } = false; protected string SearchBtnName { get; set; } = "Search"; protected async Task DoSearch() { SearchDisabled = true; SearchBtnName = "Searching ..."; List<string> log = new(); try { //Do some work which takes a few seconds .... } finally { SearchDisabled = false; SearchBtnName = "Search"; } }I tried changing the way I code the onclick such as:@onclick="@(async() => await DoSearch())"
I tried calling StateHasChanged() and await InvokeAsync(StateHasChanged);I also tried to see what else could be different in that page, but could not figure it out.