ASPxClientDropDownEdit.DropDownCommandButtonClick Event

Allows you to handle a click on ‘Ok’ and ‘Cancel’ buttons in the drop-down window.

Declaration

DropDownCommandButtonClick: ASPxClientEvent<ASPxClientDropDownCommandEventHandler<ASPxClientDropDownEdit>>

Event Data

The DropDownCommandButtonClick event's data class is ASPxClientDropDownCommandEventArgs. The following properties provide information specific to this event:

Property	Description
cancel	Specifies whether to cancel the related action (for example, row edit, export). Inherited from ASPxClientCancelEventArgs.
commandName	Gets the name of the processed command in the ASPxClientDropDownEdit.DropDownCommandButtonClick event.

Remarks

The DropDownCommandButtonClick event fires after the drop-down window’s ‘Ok’ or ‘Cancel’ buttons have been clicked.

The following example illustrates how to use the DropDownCommandButtonClick event.

Web Forms:

ASPX

<dx:ASPxDropDownEdit ClientInstanceName="ddeExtraServices" ID="ddeExtraServices" runat="server" AutoPostBack="false">
    <DropDownApplyButton Visibility="Always"></DropDownApplyButton>
    <DropDownCloseButton Visibility="Always"></DropDownCloseButton>
    <ClientSideEvents TextChanged="synchronizeListBoxValues" DropDown="OnDropDown" DropDownCommandButtonClick="OnDropDownCommandButtonClick" />
</dx:ASPxDropDownEdit>

JS

function OnDropDownCommandButtonClick(s, e){
  if (e.commandName == 'Apply')
    ddeExtraServices.HideDropDown();
  if (e.commandName == 'Close'){
    ddeExtraServices.SetText(tempText);
    ddeExtraServices.HideDropDown();
  }
}

MVC:

Razor

...
group.Items.Add(i => {
    i.Caption="Extra Services";
    i.HelpText="Additional fee charged";
    i.NestedExtension().DropDownEdit(s => {
        s.Name = "ddeExtraServices";
        s.Properties.DropDownApplyButton.Visibility = DropDownElementVisibility.Always;
        s.Properties.DropDownCloseButton.Visibility = DropDownElementVisibility.Always;
        ...
        s.Properties.ClientSideEvents.DropDownCommandButtonClick = "onDropDownCommandButtonClick";
    });
});

JS

function onDropDownCommandButtonClick(s, e) {
    if (e.commandName == "Apply")
        s.HideDropDown();
    if (e.commandName == "Close") {
        s.SetText(tempText);
        s.HideDropDown();
    }
}

Online Demos

• Modal DropDowns (Web Forms)
• Modal DropDowns (MVC)