DialogDisplayOptions(ElementReference, HorizontalAlignment, VerticalAlignment) Constructor

Initializes a new instance of the DialogDisplayOptions class with the specified dialog target reference element, and horizontal and vertical alignment.

Namespace: DevExpress.Blazor

Assembly: DevExpress.Blazor.v24.2.dll

NuGet Package: DevExpress.Blazor

Declaration

public DialogDisplayOptions(
    ElementReference targetReference,
    [DefaultValue(HorizontalAlignment.Center)] HorizontalAlignment horizontalAlignment = HorizontalAlignment.Center,
    [DefaultValue(VerticalAlignment.Center)] VerticalAlignment verticalAlignment = VerticalAlignment.Center
)

Parameters

Name	Type	Description
targetReference	ElementReference	The target element reference.

Optional Parameters

Name	Type	Default	Description
horizontalAlignment	HorizontalAlignment	Center	The horizontal alignment.
verticalAlignment	VerticalAlignment	Center	The vertical alignment.

Remarks

In the following code snippet, the DxGrid.ShowColumnChooser(DialogDisplayOptions) method displays the grid’s Column Chooser.

<DxButton Text="Show Column Chooser" Click="@OnClick" />
<div @ref=@divRef style="height: 10px; align-self: stretch;" />

<DxGrid @ref="@Grid" Data="@Data" >
    <Columns>
        <DxGridDataColumn FieldName="CompanyName" />
        <DxGridDataColumn FieldName="ContactName" />
        <DxGridDataColumn FieldName="ContactTitle"  />
        <DxGridDataColumn FieldName="City" />
        <DxGridDataColumn FieldName="Country" />
        <DxGridDataColumn FieldName="Phone" Visible="false" />
    </Columns>
</DxGrid>

@code {
    DxGrid Grid { get; set; }
    ElementReference divRef;
    IEnumerable<Supplier> Data { get; set; }
    protected override async Task OnInitializedAsync() {
        Data = await NwindDataService.GetSuppliersAsync();
    }
    void OnClick() {
        Grid.ShowColumnChooser(new DialogDisplayOptions(divRef, HorizontalAlignment.Right, VerticalAlignment.Top));
    }
}

---