New to KendoReact? Learn about KendoReact Free.
Visibility
Updated on Oct 27, 2026
By default, the KendoReact Dialog is visible whenever you render it.
To control its visibility, conditionally render the Dialog based on a state variable. When the condition is falsy, the Dialog is removed from the view.
jsx
// Unmount the Dialog to hide it.
{visible && <Dialog />}To hide the Dialog based on user interaction, handle its onClose event, which fires when users click the titlebar Close button or press Esc, and update the state that controls its rendering.
The following example demonstrates how to show and hide the Dialog based on its state. The Dialog renders while the state is true and closes when you click the Close button, No, or Yes. Clicking Open Dialog renders it again.
Loading ...