Skip to content

Commit 95a95f4

Browse files
chore(window): add open button to modal window sample
1 parent edc632a commit 95a95f4

File tree

1 file changed

+20
-12
lines changed

1 file changed

+20
-12
lines changed

components/window/modal.md

Lines changed: 20 additions & 12 deletions
Original file line numberDiff line numberDiff line change
@@ -15,19 +15,27 @@ The Window for Blazor can be modal so that the user is unable to interact with t
1515
To make a modal window, set its `Modal` property to `true`.
1616

1717
````CSHTML
18-
<TelerikWindow Modal="true" Visible="true">
19-
<WindowTitle>
20-
<strong>The Title</strong>
21-
</WindowTitle>
22-
<WindowContent>
23-
I am modal so the page behind me is not available to the user.
24-
</WindowContent>
25-
<WindowActions>
26-
<WindowAction Name="Minimize" />
27-
<WindowAction Name="Maximize" />
28-
<WindowAction Name="Close" />
29-
</WindowActions>
18+
@* Open and close a modal window *@
19+
20+
<TelerikWindow Modal="true" @bind-Visible="@isModalVisible">
21+
<WindowTitle>
22+
<strong>The Title</strong>
23+
</WindowTitle>
24+
<WindowContent>
25+
I am modal so the page behind me is not available to the user.
26+
</WindowContent>
27+
<WindowActions>
28+
<WindowAction Name="Minimize" />
29+
<WindowAction Name="Maximize" />
30+
<WindowAction Name="Close" />
31+
</WindowActions>
3032
</TelerikWindow>
33+
34+
<TelerikButton OnClick="@( _ => isModalVisible = true )">Open the window</TelerikButton>
35+
36+
@code{
37+
bool isModalVisible { get; set; } = true;
38+
}
3139
````
3240

3341
>note A modal window is centered.

0 commit comments

Comments
 (0)