ASP.NET and MVC Editors - Floating Action Button (v18.2)

ASP.NET Team Blog
08 November 2018

It's not every day that I'm impressed by a button control but the new DevExpress ASP.NET Floating Action Button has me intrigued.

The new button control hovers over another control to provide a quick way to access common actions. It can be used to replace context menus, toolbars, etc. This is especially helpful for mobile/touch devices.

DevExpress ASP.NET Floating Action Button

It was inspired by Material Design that is used in popular apps like Google Calendar.

Stand-alone control

Take a look at how the Floating Action Button can be used in the ASP.NET Data Grid control:

DevExpress ASP.NET Floating Action Button with DevExpress ASP.NET GridView


Add the Floating Action Button to any page of your ASP.NET application and assign it to a container. Below, we set the button's ContainerElementID to the DIV element that contains the ASPxGridView:

<div id="someContainer">
    <dx:ASPxGridView ID="GridView" runat="server">
<dx:ASPxFloatingActionButton ID="FloatingActionButton" runat="server" ContainerElementID="someContainer">
        <dx:FABAction ActionName="NewRow" />

Context Specific

You can define the context of which actions are displayed when the button is clicked.

So, after declaring the control, be sure to set the custom actions for when an end-user clicks the Floating Action Button.


While it's available as a stand-alone control, we decided that this functionality was especially useful for the ASP.NET Scheduler control. Therefore, we integrated the new Floating Action Button into the Scheduler control directly.

DevExpress ASP.NET Floating Action Button

You can create, edit, and delete appointments using predefined actions. You can also assign any custom context and specify any custom actions too.

What are your thoughts on the new DevExpress ASP.NET Floating Action Button? Drop me a line below, thanks!

Free DevExpress Products - Get Your Copy Today

The following free DevExpress product offers remain available. Should you have any questions about the free offers below, please submit a ticket via the DevExpress Support Center at your convenience. We'll be happy to follow-up.
No Comments

Please login or register to post comments.