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

BlazoredModal not closing WebApp Net 8

$
0
0

I've been using https://blazored.github.io/Modal/usage/passing-data to try and get a modal to pop up acting like a dialog and for users to Confirm or Cancel the button press.

I am using Blazor Web App net 8 with Blazored.Modal 7.3.1

If the Confirm button is pressed I receive a modalReference.Result.Confirmed of true, as I would expect and false if not.

The problem lies in that the modal just won't disappear, iinitially appears blacking out the rest of the web page (which is fine) and takes four clicks (of either button) in order for the modal to go and the page to be bought back. The brackground becomes less blacked out with each click.

Any idea why this could be happening?

App.razor

<CascadingAuthenticationState><CascadingBlazoredModal><Router AppAssembly="@typeof(App).Assembly"><Found Context="routeData"><AuthorizeRouteView RouteData="@routeData" DefaultLayout="@typeof(MainLayout)"/><FocusOnNavigate RouteData="@routeData" Selector="h1"/></Found><NotFound><PageTitle>Not found</PageTitle><LayoutView Layout="@typeof(MainLayout)"><p role="alert">Sorry, there's nothing at this address.</p></LayoutView></NotFound></Router></CascadingBlazoredModal></CascadingAuthenticationState>

Dialog Modal code:

<div class="row"><p>@Message</p></div><div class="row"><div class="col-md-6"><button type="button" class="btn btn-secondary" @onclick="Confirm">Confirm</button></div><div class="col-md-6"><button type="button" class="btn btn-secondary" @onclick="Cancel">Close</button></div></div>@code {    [CascadingParameter] BlazoredModalInstance DialogModal { get; set; } = default!;    [Parameter] public string? Title { get; set; }    [Parameter] public string? Message { get; set; }    // close - closes with a positive outcome    private async Task Confirm() => await DialogModal.CloseAsync(ModalResult.Ok(true));    // cancel - closes with no actions    private async Task Cancel() => await DialogModal.CancelAsync();}

Calling component:

<div><Button class="btn btn-primary mt-2" @onclick="ShowDialog">Show</Button></div></form>@code {    [SupplyParameterFromForm] public Request? Model { get; set; }    [CascadingParameter] private IModalService ModalService { get; set; } = default!;    private string? Message { get; set; }    protected override void OnInitialized()    {        Model ??= new Request();        Message = "Are you sure you wish to proceed ?";    }    private async void ShowDialog()    {        var parameters = new ModalParameters()            .Add(nameof(Dialog.Message), Message);        var dialogModalReference = ModalService.Show<Dialog>(parameters);        var result = await dialogModalReference.Result;        if (!result.Confirmed) return;        if (Model != null)           // do stuff    }}

Viewing all articles
Browse latest Browse all 4839

Trending Articles



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