Open a Window from another component
Environment
Product | Window for Blazor |
Description
I want to make a separate razor page to hold the markup and code for the Window component and be able to open it from another page. How to achieve that?
Solution
You can get a reference to the component hosting the Window and use that to toggle the field that is bound to the Visible parameter of the window.
Another option would be to send such a reference as a cascading parameter if you have a more complex hierarchy and you need to go up and not down.
@* The page/component that you want to open the Window from *@
<TelerikButton OnClick="@ToggleWindow" ThemeColor="primary">Toggle Window</TelerikButton>
<Window @bind-WindowIsVisible="@Visible"></Window>
@code {
bool Visible { get; set; }
void ToggleWindow()
{
Visible = !Visible;
}
}
@* Separate component hosting the markup and logic for the TelerikWindow *@
<TelerikWindow Visible="@WindowIsVisible" VisibleChanged="@WindowIsVisibleChanged">
<WindowTitle>
<strong>The Title</strong>
</WindowTitle>
<WindowContent>
This is my Window from another component.
</WindowContent>
<WindowActions>
<WindowAction Name="Minimize"></WindowAction>
<WindowAction Name="Maximize"></WindowAction>
<WindowAction Name="Close"></WindowAction>
</WindowActions>
</TelerikWindow>
@code {
[Parameter]
public bool WindowIsVisible { get; set; }
[Parameter]
public EventCallback<bool> WindowIsVisibleChanged { get; set; }
}