ASPxMenu.HorizontalAlign Property

Gets or sets the horizontal alignment of menu items.

Namespace: DevExpress.Web

Assembly: DevExpress.Web.v23.2.dll

NuGet Package: DevExpress.Web

Declaration

C#

[DefaultValue(HorizontalAlign.NotSet)]
public HorizontalAlign HorizontalAlign { get; set; }

VB.NET

<DefaultValue(HorizontalAlign.NotSet)>
Public Property HorizontalAlign As HorizontalAlign

Property Value

Type	Default	Description
HorizontalAlign	NotSet	One of the HorizontalAlign enumeration values.

Remarks

If a menu control’s Width property is defined and the ASPxMenu.ItemAutoWidth property is set to false, the HorizontalAlign property can be used to specify the horizontal alignment of menu items.

Example

This example demonstrates the use of the client SetPopupElementID(popupElementId) method. This method allows you to programmatically specify the element whose specific mouse action (defined via the PopupAction property) invokes a popup window or popup menu. In this example, the grid’s last column displays image elements, which being hovered, invoke a popup menu, allowing you to manipulate the corresponding grid row (select, unselect or edit the row). The popup menu is associated with the required image element using the menu’s SetPopupElementID(popupElementId) method.

var currentRowKey = 0;
function OnMouseOver(element, keyValue) {
    currentRowKey = keyValue;
    element.id = "popupElement" + keyValue;
    ClientPopupMenu.SetPopupElementID(element.id);
    ClientPopupMenu.Show();
}
function EditCurrentRow() {
    ClientGridView.StartEditRowByKey(currentRowKey);
}
function SelectCurrentRow() {
    ClientGridView.SelectRowsByKey(currentRowKey, true);
}
function UnselectCurrentRow() {
    ClientGridView.SelectRowsByKey(currentRowKey, false);
}

<dx:ASPxPopupMenu ID = "ASPxPopupMenu" runat = "server" ClientInstanceName = "ClientPopupMenu"
                    PopupAction = "LeftMouseClick" CloseAction = "MouseOut" 
                    PopupHorizontalAlign = "OutsideRight" PopupVerticalAlign = "TopSides">
    <Items>
        <dx:MenuItem Text="Edit" Name="editMenuItem"/>
        <dx:MenuItem Text="Select" Name="selectMenuItem"/>
        <dx:MenuItem Text="Unselect" Name="unselectMenuItem"/>
    </Items>
    <ClientSideEvents ItemClick="function(s, e) { 
        if(e.item.name == 'editMenuItem') 
            EditCurrentRow();
        else if (e.item.name == 'selectMenuItem')
            SelectCurrentRow();
        else if (e.item.name == 'unselectMenuItem')
            UnselectCurrentRow();
        }"  />
</dx:ASPxPopupMenu>

<dx:ASPxGridView ID="ASPxGridView" ClientInstanceName="ClientGridView" runat="server" 
                    DataSourceID="AccessDataSource" KeyFieldName="CustomerID" Width="50%" >
    <Columns>
        <dx:GridViewDataColumn FieldName="ContactName" />
        <dx:GridViewDataColumn FieldName="CompanyName" />
        <dx:GridViewDataColumn FieldName="City" />
        <dx:GridViewDataColumn FieldName="Region" />
        <dx:GridViewDataColumn FieldName="Country" />
        <dx:GridViewDataColumn Caption="" CellStyle-HorizontalAlign = "Center">
            <DataItemTemplate>
                    <img src = "img/arrow.png" style="cursor:pointer;" alt = "" 
                            onmouseover = "OnMouseOver(this, '<%# Container.KeyValue %>')"/>
            </DataItemTemplate>
        </dx:GridViewDataColumn>
    </Columns>
    <SettingsPager Mode="ShowPager" PageSize = "10"/>
    <SettingsBehavior AllowMultiSelection="true" />
</dx:ASPxGridView>