Wondering why Cordova push notifications no longer behave as before? The older notification APIs are outdated and no longer reliable on new versions of Android and iOS. If you’re looking for a native way to show alerts, prompts, or confirmations inside your hybrid app, then you might want to know about Cordova Dialog Plugin.
They provide native-style dialog interfaces through the cordova-plugin-dialogs package, allowing apps to display system-level alerts and input boxes that blend naturally with each platform.
Why Push Notifications Were Outdated?
Older Cordova notification APIs were built to show basic alerts, vibration feedback, or sound cues within apps. Over time, these APIs became difficult to maintain as both Android and iOS introduced stricter background and permission models.
True push notifications, which rely on remote servers to deliver messages even when an app is closed, require modern frameworks and external services such as Firebase Cloud Messaging or OneSignal. The original Cordova notification plugin was never designed for that purpose, which is why it gradually fell out of use.
To keep hybrid app development stable and compatible, the Cordova team maintains the Dialogs plugin as part of its core plugin set for handling local interactions, instead of remote push delivery.
How to Install Cordova Plugin Dialogs?
To start using Cordova Dialog Plugin, you need to install the cordova-plugin-dialogs package in your project. It provides access to native alert, confirm, and prompt dialogs across supported platforms such as Android, iOS, Browser, and Windows.
From your project’s root directory, run:
cordova plugin add cordova-plugin-dialogs
This command downloads the plugin and adds it to your Cordova configuration so it stays included during builds. Once installed, the plugin becomes available through the global navigator.notification object. However, it only loads after the Cordova environment is fully ready. To confirm that the plugin is active, add this short check:
document.addEventListener("deviceready", function () {
console.log(navigator.notification);
});
The deviceready event ensures Cordova’s native components are initialized before you access them. Skipping this step may result in undefined plugin errors during runtime. After installation, you can begin using the available dialog methods to display system-level alerts and prompts within your app.
Using Core Dialog Notifications
Once the plugin is installed and initialized, you can use the navigator.notification object to display native alerts, confirmations, prompts, and sound notifications. Each method behaves slightly differently but follows a simple and consistent pattern that makes it easy to implement in any Cordova project.
1. Alert
Use alerts to display a short message that requires the user’s acknowledgment before proceeding.
navigator.notification.alert(
"Profile updated successfully!",
function () { console.log("Alert closed"); },
"Update Complete",
"OK"
);
This method takes four parameters: the message, a callback function when dismissed, a title, and the button text. It’s perfect for showing success messages or important information that doesn’t require user input.
2. Confirm
A confirmation dialog helps when you need a yes or no response.
navigator.notification.confirm(
"Do you want to save these changes?",
function (buttonIndex) {
if (buttonIndex === 1) console.log("User confirmed");
else console.log("User canceled");
},
"Confirm Action",
["Yes", "No"]
);
The callback receives the index of the button pressed. Cordova uses one-based indexing, so the first button is always 1.
3. Prompt
When you need quick user input, use a prompt dialog.
navigator.notification.prompt(
"Enter your username",
function (result) {
console.log("Name:", result.input1);
console.log("Button index:", result.buttonIndex);
},
"Login Required",
["Submit", "Cancel"],
""
);
The callback provides both the entered text (input1) and the button index, allowing flexible handling of form-style inputs inside dialogs.
4. Beep
You can play a short system sound to catch attention.
navigator.notification.beep(2);
The number represents how many times the device should beep. This is useful for alerts that need audio feedback in addition to visual cues.
5. Dismiss Methods
To close open dialogs programmatically, use:
navigator.notification.dismissPrevious();
navigator.notification.dismissAll();
These methods help manage multiple dialogs or clear leftover popups when changing screens. Note: dismissPrevious and dismissAll are not supported on Browser or Windows (only Android and iOS)
Wrapping Up
Cordova Dialog Plugin runs on Android, iOS, Browser, and Windows. Android supports up to three buttons per dialog, while Windows uses HTML-based versions due to native limits. Testing on actual devices helps confirm consistent behavior across platforms.
Replacing the outdated push notification API with Dialog Notifications gives hybrid apps reliable, native-style alerts and prompts using minimal code. It’s a simple way to modernize user interactions without adding external dependencies.