Roeland's answer is correct, but you can also show a progress bar manually with the following code:
var isModal = true;
var pid = mx.ui.showProgress("Here's a message!", isModal); // show progress dialog
mx.ui.hideProgress(pid); // hide it again
See https://developers.mendix.com/docs-and-api/apis/web-client-api/
From https://apidocs.mendix.com/5/client/mx.ui.html
mx.ui.action Execute a Microflow from the UI. This is basically a wrapper around mx.data.action(), setting the default caller to the current form, and giving the option of showing a progress bar while running the Microflow.
mx.ui.action("MyFirstModule.StartEngine", {
context: new mendix.lib.MxContext(),
progress: "modal",
callback: function(result) {
console.log("Engine started: " + result);
}
});
Do you like something like this?
Available via Github, https://github.com/Andries-Smit/Mx-Progress-Bar-Button
And via the Mendix AppStore; https://appstore.home.mendix.com/link/app/2389/Flock-of-Birds/Progress-Bar-Button
A Progress Bar microflow button widget shows a progress messages and a progress bar during the processing of microflows. In the MF the messages and percentage can be updated and are show to the user directly.
You need to add some CSS code
1- download your custom preloader gif and put it close to the custom.css file
2- open custom.css file
3- use class “. mx-progress-indicator ” to modify the preloader
4- then run your code and tell us your feedback
like :