Update README.md

README.md

@@ -16,9 +16,68 @@ Follow the steps below to implement a confirmation dialog:
 
 1. Add a [DxPopup](https://docs.devexpress.com/Blazor/DevExpress.Blazor.DxPopup) component to the page, disable default user actions that dismiss the popup, and add custom buttons to the component's content area.
 
+    ```html
+    <DxPopup @bind-Visible="@ConfirmationShown" 
+             HeaderText="@HeaderText"
+             HeaderCssClass="confirmation-dialog-header"
+             ShowCloseButton="false" 
+             CloseOnOutsideClick="false" 
+             CloseOnEscape="false" 
+             Width="400px">
+        <BodyContentTemplate>
+            <p>@BodyText</p>
+            <div class="confirmation-dialog-content">
+                <DxButton Text="Yes" Click="YesClick" RenderStyle="ButtonRenderStyle.Primary"></DxButton>
+                <DxButton Text="No" Click="NoClick" RenderStyle="ButtonRenderStyle.Secondary"></DxButton>
+            </div>
+        </BodyContentTemplate>
+    </DxPopup>  
+    ```
+
 2. Handle the [DxSxheduler](https://docs.devexpress.com/Blazor/DevExpress.Blazor.DxScheduler) component's [AppointmentRemoving](https://docs.devexpress.com/Blazor/DevExpress.Blazor.DxScheduler.AppointmentRemoving) event to display a confirmation dialog when a user attempts to delete an appointment.
 
-3. Create a [task](https://learn.microsoft.com/en-us/dotnet/api/system.threading.tasks.taskcompletionsource-1?view=net-7.0) that displays the confirmation form. Handle button clicks to store user choice - confirm or cancel. The scheduler's event reads the user choice and cancels deletion if necessary. 
+    ```html
+    <DxScheduler AppointmentRemoving="OnAppointmentRemoving" ...
+
+    @code {
+        ConfirmationDialog confDialog;
+        async Task OnAppointmentRemoving(SchedulerAppointmentOperationEventArgs args) {
+            args.Cancel = !(await confDialog.ConfirmOperation("Delete an appointment",
+                "Are you sure you want to delete this appointment?"));
+        }
+    }
+    ```
+
+3. Create a [task](https://learn.microsoft.com/en-us/dotnet/api/system.threading.tasks.taskcompletionsource-1?view=net-7.0) that displays the confirmation form. Handle button clicks to store user choice - confirm or cancel. The scheduler's event reads the user choice and cancels deletion if necessary.
+
+    ```cs
+    bool ConfirmationShown { get; set; } = false;
+    string HeaderText { get; set; } = string.Empty;
+    string BodyText { get; set; } = string.Empty;
+    TaskCompletionSource<bool> tcs;
+    
+    public Task<bool> ConfirmOperation(string headerText, string bodyText) {
+        HeaderText = headerText;
+        BodyText = bodyText;
+        ConfirmationShown = true;
+        InvokeAsync(StateHasChanged);
+    
+        tcs = new TaskCompletionSource<bool>();
+        tcs.Task.ContinueWith(_ => {
+            ConfirmationShown = false;
+        });
+        return tcs.Task;
+    }
+    private void YesClick() {
+        tcs.SetResult(true);
+    }
+    private void NoClick() {
+        tcs.SetResult(false);
+    }
+    public void Dispose() {
+        tcs = null;
+    }
+    ```
 
 ## Files to Review
 
@@ -27,9 +86,9 @@ Follow the steps below to implement a confirmation dialog:
 
 ## Documentation
 
-- [Implement a Confirmation Dialog Based on Blazor Popup](https://docs.devexpress.com/Blazor/404363/components/dialogs-and-windows/popup-based-confirmation-dialog)
 - [DxScheduler - Manage Appointments](https://docs.devexpress.com/Blazor/404770/components/scheduler/appointments#manage-appointments)
-
+- [Confirmation Dialog Based on DevExpress Blazor Message Box](https://docs.devexpress.com/Blazor/404497/components/dialogs-and-windows/confirmation-dialog)
+- 
 ## More Examples
 
 - [Grid for Blazor - Create a custom record deletion confirmation dialog](https://github.com/DevExpress-Examples/blazor-dxgrid-show-custom-confirmation-dialog)