ConfirmSample

Use this when you want to confirm some operation.

The component has two display modes, one where it overlays the entire window, and one where it only overlays the immediate parent container. Both are shown below.

Also, you can use an EventCallback, which will notify you immediately when the user clicks a button, or pass in an action which will be run before the pop-up closes if the user clicks yes. In this case, you may need to call StateHasChanged() to see the updates in the UI.

Overlaying the parent container

The pop-up will only cover the fieldset in which this text and the button appear.

Overlaying the entire window

The pop-up will cover the entire browser window. Even if the page contents are longer than the window size allows, the pop-up will always appear in the middle of the viewport.

Result:

Spurious content to add vertical space...

Just to confirm that when the page contents are longer than the window and we use DisplayOptions.Window, the confirm buttons are centered vertically, we'll add some, erm, interesting reading!

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vivamus non ex et leo ultrices lobortis. Quisque iaculis ullamcorper est luctus vestibulum. Nunc aliquam nisl id enim aliquet elementum. Sed vehicula leo id leo vulputate, at viverra risus iaculis. Pellentesque condimentum mauris sapien, non rhoncus sem dictum vel. Nullam dolor enim, semper eu orci ut, ultricies egestas quam. Pellentesque placerat odio vitae leo venenatis fermentum. Quisque ac libero eget arcu viverra sodales.

Nulla facilisi. Nam sit amet aliquet risus. Fusce aliquet suscipit metus, quis accumsan nunc dictum nec. Aenean nec congue sapien. Suspendisse cursus arcu id ullamcorper dapibus. Pellentesque placerat nunc nibh, a tristique arcu pellentesque vitae. Donec congue lacus vel sapien egestas mollis. Nunc a magna ac magna venenatis euismod nec eu dui. Orci varius natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Sed sed quam elementum, luctus sapien at, pulvinar est. Pellentesque finibus massa et mi auctor, sed ultrices tortor lobortis. Nunc lacus ipsum, porta nec odio a, ullamcorper pharetra eros. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Vestibulum lacus tortor, egestas ac varius eget, condimentum quis eros. Duis eget urna ante. Aenean eget orci quis erat luctus ultrices.

Aenean ante augue, tempor eu nulla eget, tristique condimentum mi. Integer aliquam velit ac eleifend laoreet. Nunc non massa ut arcu tristique scelerisque. Donec tempus felis ac nunc sodales, sed accumsan velit fermentum. Maecenas pretium hendrerit augue. Duis facilisis velit nisl, in laoreet erat malesuada sed. Praesent malesuada semper neque, at posuere neque posuere eu. Pellentesque lacus tortor, interdum eget dui id, tempor ullamcorper erat. Donec ligula arcu, consequat et odio id, bibendum bibendum felis. Duis posuere convallis est ornare tincidunt. Vivamus nec aliquam diam. Vestibulum venenatis ipsum vel luctus viverra. Proin porta iaculis risus non placerat. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos.

Fusce a aliquet nulla. Morbi interdum scelerisque eros vel laoreet. Nam pellentesque porta hendrerit. Fusce tincidunt, nisl a faucibus facilisis, lectus elit venenatis dui, eu eleifend ipsum sem ut erat. Maecenas imperdiet sit amet nulla quis fringilla. Nulla porta pulvinar efficitur. Maecenas erat justo, finibus quis felis ut, vulputate fermentum sapien. Integer convallis lobortis pulvinar. Nam convallis nunc elit, a tempus neque dictum ut. Phasellus tempus arcu metus, non suscipit odio accumsan quis. Sed sem odio, posuere et rutrum vitae, pretium vel enim. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Orci varius natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Fusce et metus et nulla volutpat dignissim nec eget arcu. Sed iaculis vehicula sodales.

Sed suscipit est purus, malesuada hendrerit ex efficitur eget. Quisque fermentum leo nulla, sit amet vehicula risus hendrerit eget. Suspendisse at eleifend mauris. Phasellus facilisis ex massa, consequat rutrum odio hendrerit quis. Pellentesque at dui enim. Maecenas nec elit eget odio suscipit aliquam. Curabitur id metus blandit, sagittis tortor a, egestas ligula. Nulla luctus congue facilisis. Maecenas tempus ultricies tellus efficitur ultricies. Nulla tempus enim vitae ex semper pretium. Aliquam varius auctor mollis. Pellentesque vel lobortis odio. Ut sit amet metus eget ex eleifend egestas et nec mi. Cras est neque, malesuada ac dignissim vel, vehicula eget velit. Aliquam tempus consequat nunc non posuere. Praesent ante dui, elementum in eros at, venenatis tempor nisi.

An error has occurred. This application may no longer respond until reloaded. Reload 🗙