Create a Custom Save Button

3 minutes to read Download PDF Edit

1 Introduction

Mendix uses visual models called microflows to define the logic of your application. A microflow is a visual way of expressing what traditionally would be written in code. This how-to explains how you can create a custom save button on a detail page by utilizing microflows.

This how-to will teach you how to do the following:

  • Create a custom Save button

2 Prerequisites

Before starting with this how-to, make sure you have completed the following prerequisites:

3 Replacing the Default Save Button with a Custom Save Button

To replace the default Save button with a custom one, follow these steps:

  1. Open the Customer detail page, which should look like this:

  2. Right-click the Save button and remove it by selecting Delete.

  3. Right click the Cancel button and select Add button left > Microflow:

  4. Double-click the new Microflow button to open its properties:

  5. Change the Caption to Save.

  6. Change the image to an image of your choice.

  7. In the Events section, click Select… to add a new microflow with the name Customer_Save.

  8. Click OK to save the new microflow button.

4 Re-creating the Default Save Behavior

  1. Right-click the new Microflow button and select Go to microflow to open the new microflow:

    The Microflow should look like this:

  2. Open the Toolbox from the bottom-right corner of the Modeler: You can also open it from the View menu:

  3. Drag a Commit object(s) action from the Toolbox to the line between the green start and red end events, which will insert a commit action activity.

  4. Double-click the new activity to open its properties:

  5. In the Input section, select Customer for Variable and click OK. The microflow should now look like this:

  6. Drag a Close page action from the Toolbox to the line between the green start and red end events, which will insert a close page action activity. You have now re-created the default save behavior, and the m should look like this:

5 Extending the Microflow with Your Own Functionality

  1. Drag a Show message action from the Toolbox to the line between the start and end events, which will insert a show message action activity.
  2. Double-click the new activity to open its properties:

  3. Select the Type of message.

  4. Enter a message as a Template value.

  5. Click OK to save the properties. The microflow should now look like this: