Registering Push IOS Notification with Telerik Appbuilder

Question

I have registered my Telerik Appbuilder (cordova) app for Push Notifications. Everything works fine, except for the fact that when the user is inside the application, he does not receive the push notification.

It works fine as long as he is on the 1 page that registers his push ie:

var registerPush = function (user, callback) {
    $(".modal-loader").show();
    document.addEventListener("deviceready", function () {
        var el = new Everlive('m4yh8cw6ei7xxwio');

        var pushSettings = {
            iOS: {
                badge: true,
                sound: true,
                alert: true,
                clearBadge: true
            },
            notificationCallbackIOS: function (e) {             
                navigator.notification.alert(e.alert, function () { }, "Alert", "Ok");
            },
            customParameters: {
                login: user
            }

        };

        el.push.register(
            pushSettings,
            function () {
                $(".modal-loader").hide();
                callback();
            }
            ,
            function errorCallback(error) {
                // This callback will be called any errors occurred during the device
                // registration process
                console.log("error registering push");
                console.log(data);
            }
        );
    }, false);
}

If the user is on the page that actually registers this function, then he will be alerted via the navigationCallbackIOS. but as soon as we browse to a different page via:

 location.href= nextpage.html

then the navigationCallbackIOS no longer works. What is the logic I need to implement here to have a global callback that works on every page?

jcesarmobile · Accepted Answer · 2016-03-17T12:17:25.570

1

If you change the page like this location.href= nextpage.html, then it's a different page, the webview is reloaded and all the code you executed on the index.html won't exist anymore.

You have two options.

Switch to SPA, where you only have the index.html and you load just the contents of the nextpage.html, but don't navigate to it using the location.href
Execute all the code on every .html file. If you have a pushHandler.js (example) where you init the push and register the listeners, link it on any .html so it is executed again when you change the page.

edited Mar 17 '16 at 12:17

answered Mar 17 '16 at 12:08

jcesarmobile

51,328
11
132
176

The problem with 2# is that it takes a while to register the push, so if a push is sent in the couple of seconds that it takes to register, then they miss it. I was hoping there was a way to register the event on every page without having to update the entire push settings with the server – Michael Mar 18 '16 at 00:54
Maybe you can ask the plugin author to provide a way of creating the PushNotification object without the need of calling init again, as the registration is already done on the first page, you only need to set the listeners on the other pages – jcesarmobile Mar 18 '16 at 08:18
that's right, that's what I need :) Just a listener. I'll try find the developer – Michael Mar 18 '16 at 10:47

Denys Vitali · Answer 2 · 2016-03-30T20:51:02.380

An AJAX request instead of a location.href change would be really better for three motivations: 1. Speed 2. No reload (don't need to reload every single resource everytime) 3. Global scope - in your case the push notification registration, don't need to be re-run every page change.

To do so you could create a DOM element and then load into it the content of the other pages.. Take a look here for some proof of concept. It's basically all around managing an XMLHttpRequest and putting the result into a DOM element.

Registering Push IOS Notification with Telerik Appbuilder

2 Answers2