New to Telerik UI for BlazorStart a free 30-day trial

A positioned popup anchored to an element with configurable alignment, collision behavior, offsets, size, and animation. Target the anchor via AnchorSelector; control attachment points with HorizontalAlign/VerticalAlign and anchor alignment through AnchorHorizontalAlign/AnchorVerticalAlign; handle viewport collisions using HorizontalCollision/VerticalCollision; add spacing via HorizontalOffset/VerticalOffset; set dimensions with Width/Height; and animate using AnimationType/AnimationDuration. Content is provided through ChildContent. Programmatic API: Show(), Hide(), Refresh().

Definition

Namespace:Telerik.Blazor.Components

Assembly:Telerik.Blazor.dll

Syntax:

C#
public class TelerikPopup : BaseComponent, IComponent, IHandleEvent, IHandleAfterRender, IDisposable

Inheritance: objectComponentBaseBaseComponentTelerikPopup

Implements: IComponentIDisposableIHandleAfterRenderIHandleEvent

Inherited Members BaseComponent.ShouldRender()BaseComponent.OnInitializedAsync()BaseComponent.OnAfterRenderAsync(bool)BaseComponent.Dispose()BaseComponent.InitLocalizer()BaseComponent.ThrowIfParameterIsNull(object, string)BaseComponent.HaveOptionsChanged(IDictionary<string, object>, IDictionary<string, object>)BaseComponent.GetClassString(params string[])BaseComponent.InvokeAsync<T>(string, params object[])BaseComponent.InvokeAsync<T>(string, CancellationToken, params object[])BaseComponent.InvokeVoidAsync(string, params object[])BaseComponent.InvokeVoidAsyncWithoutAwait(string, params object[])BaseComponent.InvokeComponentMethodAsync<T>(string, params object[])BaseComponent.InvokeComponentMethodAsync<T>(string, CancellationToken, params object[])BaseComponent.InvokeVoidComponentMethodAsync(string, params object[])BaseComponent.InvokeComponentVoidMethodAsync(string, object)BaseComponent.InvokeDisposeAsync()BaseComponent.StateHasChanged()BaseComponent.RootComponentBaseComponent.ClassComponentBase.OnInitialized()ComponentBase.OnParametersSet()ComponentBase.OnParametersSetAsync()ComponentBase.OnAfterRender(bool)ComponentBase.InvokeAsync(Action)ComponentBase.InvokeAsync(Func<Task>)ComponentBase.DispatchExceptionAsync(Exception)ComponentBase.SetParametersAsync(ParameterView)...

Constructors

C#
public TelerikPopup()

Properties

In combination with AnchorVerticalAlign, this specifies the point on the anchor to which the popup element should be attached. The available X options are: Left Center Right By default the point to which the popup element is attached is the bottom-left corner of the anchor.

C#
[Parameter]
public PopupAnchorHorizontalAlign AnchorHorizontalAlign { get; set; }

Specifies the selector of the element that will be used as an anchor. The popup will open next to that element.

C#
[Parameter]
public string AnchorSelector { get; set; }

In combination with AnchorHorizontalAlign, this specifies the point on the anchor to which the popup element should be attached. The available Y options are: Bottom Center Top By default the point to which the popup element is attached is the bottom-left corner of the anchor.

C#
[Parameter]
public PopupAnchorVerticalAlign AnchorVerticalAlign { get; set; }

The duration of the open/close animation in milliseconds.

C#
[Parameter]
public int AnimationDuration { get; set; }

The effect to use for playing the open/close animation.

C#
[Parameter]
public AnimationType AnimationType { get; set; }

The Popup Component content.

C#
[Parameter]
public RenderFragment ChildContent { get; set; }

The height of the popup.

C#
[Parameter]
public string Height { get; set; }

Specifies whether the Popup will close when the user clicks outside the component and its anchor. Default value is false.

C#
[Parameter]
public bool HideOnOutsideClick { get; set; }

In combination with VerticalAlign specifies which point of the popup element to attach to the anchor's origin point. The available X options are: Left Center Right. By default, the attached point is the top-left corner of the popup element.

C#
[Parameter]
public PopupHorizontalAlign HorizontalAlign { get; set; }

Specifies the behavior of the Popup when it does not fit in the viewport. Valid values are: Flip - the popup will flip if there is sufficient available space on the opposite side. Fit - the popup will be shifted (moved) until it is fully visible. By default, the Popup fits horizontally when there is a collision.

C#
[Parameter]
public PopupCollision HorizontalCollision { get; set; }

Specifies the horizontal offset value, in pixels, to be added to the popup position, creating a blank space between the popup and the anchor.

C#
[Parameter]
public double HorizontalOffset { get; set; }

Fires when the Popup is closed, for example due to an outside click or a programmatic Hide() call.

C#
[Parameter]
public EventCallback OnHide { get; set; }

In combination with HorizontalAlign specifies which point of the popup element to attach to the anchor's origin point. The available Y options are: Bottom Center Top By default, the attached point is the top-left corner of the popup element.

C#
[Parameter]
public PopupVerticalAlign VerticalAlign { get; set; }

Specifies the behavior of the Popup when it does not fit in the viewport. Valid values are: Flip - the popup will flip if there is sufficient available space on the opposite side. Fit - the popup will be shifted (moved) until it is fully visible. By default, the Popup flips vertically when there is a collision.

C#
[Parameter]
public PopupCollision VerticalCollision { get; set; }

Specifies the vertical offset value, in pixels, to be added to the popup position, creating a blank space between the popup and the anchor.

C#
[Parameter]
public double VerticalOffset { get; set; }

The width of the popup.

C#
[Parameter]
public string Width { get; set; }

Methods

C#
protected override void BuildRenderTree(RenderTreeBuilder __builder)
Parameters:__builderRenderTreeBuilder

Overrides: ComponentBase.BuildRenderTree(RenderTreeBuilder)

Closes the popup.

C#
public void Hide()

Refreshes the popup element and its position.

C#
public void Refresh()

Opens the popup.

C#
public void Show()