0
votes

Is it possible to have a synchronised version of the Blazor Syncfusion confirm and prompt dialog?

Meaning that a modal dialog is shown from a method, awaits the yes/no confirmation, returns the users input and continues the method that initially showed the dialog?

2

2 Answers

1
votes

We have validated the reported query. Yes, you can perform you actions based on the SfDialog button clicked, using the lambda expression. Check the below code block for reference.

@using Syncfusion.Blazor.Popups 
@using Syncfusion.Blazor.Buttons 
 
<SfButton @onclick="@OpenDialog">Open Dialog</SfButton> 
 
<SfDialog Width="250px" ShowCloseIcon="true" IsModal="true" @bind-Visible="@IsVisible"> 
    <DialogTemplates> 
        <Header> Dialog </Header> 
        <Content> This is a Dialog with button and primary button </Content> 
    </DialogTemplates> 
    <DialogButtons> 
        <DialogButton Content="Confirm" IsPrimary="true" OnClick='(e => CloseDialog("Yes"))' /> 
        <DialogButton Content="Cancel" OnClick='(e => CloseDialog("No"))' /> 
    </DialogButtons> 
</SfDialog>
 
@code { 
    private bool IsVisible { get; set; } = true; 
 
    private void OpenDialog() 
    { 
        this.IsVisible = true; 
    } 
 
    private void CloseDialog(string userResponse) 
    { 
        if (userResponse == "Yes") 
        { 
            // Perform your action 
            this.IsVisible = false; 
        } else 
        { 
            this.IsVisible = true; 
        } 
    } 
} 

Please let us know if the solution helps,

0
votes

Thanks NDRA JITH,

You suggestion contains two methods, it would be nice if it's possible in one method, just like the confirm method in JavaScript. So open the Confirm dialog wait for the user to answer and based on the answer continue in the same method.

In Blazored it is possible (but I want it in Syncfusion) with the following code:

Parent screen:

@inject IModalService Modal

<BlazoredModal />

@code {
  var modalImport = Modal.Show<ModalImport>("Title comes here");
  var result = await modalImport.Result;
  if (!result.Cancelled)
  {
    var doSomethingWithThisResult = result.Data;
  }
}

Modal screen:

@inject IModalService ModalService;
<button  @onclick="HandleStartImport" class="btn btn-secondary">Start</button>
<button @onclick="No" class="btn btn-secondary">Cancel</button>

@code {
  [CascadingParameter] BlazoredModalInstance BlazoredModal { get; set; }
  
  async Task HandleStartImport()
  {
    BlazoredModal.Close(ModalResult.Ok("I clicked OK!"));
  }
  void No() => BlazoredModal.Cancel();
}