cordova,jquery-mobile , jquery mobile backbutton to quit App for specific Page


jquery mobile backbutton to quit App for specific Page

Question:

Tag: cordova,jquery-mobile

I had a look around and can't seem bind the backbutton to a specific page for Android phone in Phonegap/JQM.

I am trying to only allow the backbutton to trigger navigation.notification.confirm to prompt the logout at 1 specific page. But it either doesnt prompt it or prompt it every single page.

This below doesn't trigger

$(document).on( 'pageinit','homepage',function onLoad(){
                document.addEventListener('deviceready', deviceReady, false);
            }
        function deviceReady() {
            document.addEventListener('backbutton', backButtonCallback, false);
        }

        function backButtonCallback() {
            navigator.notification.confirm('Do you want to exit the app? If not, use the top left button to go to Previous Page',confirmCallback);
            }
        function confirmCallback(buttonIndex) {
            if(buttonIndex == 1) {
            navigator.app.exitApp();
            return true;
            }
        else {
            return false;
            }
        })

This doesn't trigger either

function onLoad(){
                document.addEventListener('deviceready', deviceReady, false);
            }
        function deviceReady() {
            document.addEventListener('backbutton','#homepage' backButtonCallback, false);
        }

        function backButtonCallback() {
            navigator.notification.confirm('Do you want to exit the app? If not, use the top left button to go to Previous Page',confirmCallback);
            }
        function confirmCallback(buttonIndex) {
            if(buttonIndex == 1) {
            navigator.app.exitApp();
            return true;
            }
        else {
            return false;
            }
        }

Answer:

If you are using Jquery Mobile 1.4.5 getActivePage() can be handy. $.mobile.activePage was deprecated in JQM 1.4.0 (see http://blog.jquerymobile.com/ Changes since 1.4.0 beta #deprecation).

//handle Back button
function onDeviceReady() {
    // Register the event listener
    document.addEventListener("backbutton", onBackKeyDown, false);
    console.log('Device ready - register onBackKeyDown()');                
}

document.addEventListener("deviceready", onDeviceReady, false);

function onBackKeyDown() {
    var active_page = $( ":mobile-pagecontainer" ).pagecontainer( "getActivePage" );
    var id =active_page.page().attr('id');
    if (id==='homepage') {
        if (confirm('Do you want to exit the app? If not, use the top left button to go to Previous Page?')==true){
            navigator.app.exitApp();
        }
    }
    else{
    navigator.app.backHistory();
    }
}
//**

This code will exit app only if activePage id is homepage.

Tell me if code works for you.


Related:


How to add new elements to the page via function calls, and attach event handlers to them, without specifying them inside the function?


jquery,jquery-ui,jquery-mobile
So I have an app. It's written on jQuery(UI & Mobile). I have this page structure: Main Page: <!-- Main Page --> <div data-role="page" id="home"> <header data-role="header" data-theme="a"> <h1>Running Tracker</h1> </header> <div data-role="navbar"> <ul> <li> <a href="#add" data-transition="fade" data-icon="plus">Add Run</a> </li> </ul> </div> <div data-role="content"> <h3>Welcome to the RunningTracker App</h3>...

No plugins are working in Cordova


javascript,cordova
I can successfully install all plugins but none of them seems to work. I have also the cordova.js included: <script type="text/javascript" src="cordova.js"></script> <script src="js/jquery.js"></script> <script src="js/tocca.js"></script> <script type="text/javascript" src="js/index.js"></script> Then when I use simple $('.curpos').html(device.cordova); in index.js, it does not work. This is output from cordova plugin command: com.admob.pro 2.6.2...

jQuery mobile radio button changed event always fires even if already checked


jquery,jquery-mobile,event-handling,radio-button,onchange
I'm using a radio button group containing two radio buttons to dynamically change the content of my page depending on which radio button is checked. The content should be updated, when the selected radio button changes. Therefor i added an event handler to the radio buttons. html: <fieldset data-role="controlgroup" data-type="horizontal"...

Add a background behind loader to hide loading screen


javascript,jquery,jquery-ui,jquery-mobile
How can one add a bgcolor behind the loader before a page is created just to hide the white screen before the page is loaded. this is my code. setTimeout(function(){ $.mobile.loading('show', { text: 'Chargement en cours...', textVisible: true, theme: 'a', html: "<span class='ui-bar ui-overlay-c ui-corner-all' ><img width='50px' height='50px' src='http://www.shougun.it/images/loading.gif' /><br><h2>Chargement...

Updating a DIV inside a Collapsible in JQuery Mobile only when the Collapsible is opened (eg. load on demand)


html,jquery-mobile,external,jquery-mobile-collapsible
I'm trying to execute a call to an external program to create content in a DIV inside a collapsible in JQuery Mobile, to have some code run when a div in a JQM collapsible appears when the collapsible is opened. I'm trying to use the jquery.appear plugin (https://github.com/morr/jquery.appear) as follows:...

Cordova- embed a external website into cordova app


cordova,browser,web-applications,website
I have a website. it run good in server I'm building a cordova app to embed this website and I want to open this website into this cordova app. I use window.open(..., "_blank").. window.open(..., "_selt") modify config.xml <access origin.... but when I run app in my device, website auto open...

Jquery mobile Deeplinking (sort of)


jquery,jquery-mobile
I am using multi-page jquery mobile and need to create a link from one "page" to content on another "page". Am I able to do it straight through <a> or do I need to add additional code? Code : <body> <div style="min-height: 880px;" class="ui-page ui-body-c" data-role="page" id="Welcome" tabindex="0" data-url="Welcome"> <!---...

Cordova compiling fails with admob - missing com.google.android.gms:play-services-ads:+


android,cordova,admob
After a problem integrating admob into my cordova application, I've decided to follow the example layed out here: https://github.com/floatinghotpot/cordova-admob-pro As I work with a windows 7, I've made the required changes, but it looks something like this: C:\> cordova create test1 com.rjfun.test1 Test1 Creating a new cordova project. C:\>cd test1...

Using jQuery to Popup iFrame from URL


javascript,jquery,html,jquery-mobile,iframe
I have inherited some code and I am trying to add an enhancement that will open a popup style iframe with the URL. The way the code is laid out is there are different tab-panes within the html window and in the "content" tab it displays information in the #post-body...

jQuery Mobile Slider for dollar amounts


jquery-mobile,slider,jquery-ui-slider,jquery-slider
I am wondering if anyone knows how to modify the jQuery Mobile Slider to show dollar amounts? Or at the very least so show 2 decimal points at all times. i.e. if a user selects 10 I want it to show 10.00 instead of 10. With my current HTML below,...

Ionic - 'platform add android' Comand failed with exit code ENOENT


java,android,cordova,environment-variables,ionic
Please help me get my Windows 8/Ionic/Cordova/Android environment setup correctly. I'm trying to use the command 'add platform android' but am unable to get it to work. I have seen similar posts to this but none quite the same. I've tried un-installing Cordova and Ionic and reinstalling them as recommended...

jquery mobile all the data attribute references does not work


jquery,html,css,cordova,jquery-mobile
In my header i included <link rel="stylesheet" type="text/css" href="css/jquery.mobile-1.4.5.css"> <script type="text/javascript" src="js/jquery-1.11.2.js"></script> <script type="text/javascript" src="js/jquery.mobile-1.4.5.js"></script> and whenever I use for example data-role="page" the expected effect does not acquire. why would that happen? edit: https://jsfiddle.net/f0eurafv/1/ notice the text input in the login form...

Unable to display SQLite data as listview using phonegap


javascript,html,sqlite,cordova
The function get_list() here is able to execute the query but not able to display the rows. function get_list() { db = window.openDatabase("timeDB", "1.0", "time", 200000); db.transaction(populateDB, transaction_error, populateDB_success); function populateDB(tx) { tx.executeSql("SELECT (date) FROM time", [], function (tx, res) { var len = result.rows.length; if (len > 0) {...

Losing line break when displaying text


javascript,jquery,html,jquery-mobile
I can see the line breaks "↵" for a string in Chrome Developer Tools <br>↵↵<br>Event Status: confirmed↵<br>Event Description: Hog Day (Night )and Hog Day (Day)↵↵Friday... If i double click this and paste to Notepad, the line breaks are preserved. When i save the string to an object like so, var...

How to request new banner ad in AdMob Pro?


angularjs,cordova,admob,ionic,cordova-plugins
I have an Angular Ionic mobile app. I recently switched from the old AdMob cordova plugin (https://github.com/floatinghotpot/cordova-plugin-admob) to the AdMob Pro plugin (https://github.com/floatinghotpot/cordova-admob-pro). I have most everything working, but I can't figure out how to request a new ad. The old plugin had a function requestAd that would get a...

Triggering function on an particular count in a for loop


javascript,jquery,cordova
i am running an sql query in an loop . the query should run only if the loop count is equal to 500 . for E,g $.ajax({ response:function(e){ // Here e.length will be unknown for(var i in e){ if(q1cnt <= 500){ // do some appending var k = k +...

Programmatically enable GPS of device when application opens in cordova


angularjs,cordova,ionic,cordova-plugins
I have been working on cordova ionic app with angularJS frontend. Here when this app is getting launch the device should check for the status of the GPS whether it is on or not and if it is not on then make it on automatically. I didn't found any cordova...

__createApplicationIconFromImage_block_invoke: Error: unable to create icon mask image from image named “AppIconMask.png” at scale 2.0


ios,objective-c,cordova,phonegap-plugins
I am getting "___createApplicationIconFromImage_block_invoke: Error: unable to create icon mask image from image named "AppIconMask.png" at scale 2.0" error while opening a PDF Viewer using iOS Cordova phone-gap based application Unknown activity items supplied: ( "QLPrintPageRenderer: 0x187bc720>", "UIPrintInfo: 0x1c0b51f0>" ) //While executing present View : [self.documentInteractionController presentPreviewAnimated:NO]; Can anyone please...

html query string with blackberry


javascript,html5,cordova
My hybrid mobile app needs to work on blackberry devices as well. I noticed that a simple html query string such as http://example.com/over/there?name=ferret Works also this way using the anchor tag (even if it is not standard) http://example.com/over/there#name=ferret using Android and iOS. I don't have a blackberry to try but...

Cordova verify app is asleep when not active


cordova,ionic-framework
I'm having test users say that my app is taking too much battery life on their android devices. I'm testing on a tablet (nexus 7) and in the Settings > App info > Permissions I see prevent tablet from sleeping. So does this mean that my app is keeping the...

fabric.js resize canvas to fit screen


javascript,android,cordova,canvas,fabricjs
I'm currently developping an application on mobile device (android and iPhone) with ionic and cordova. I would like to edit a picture. I use fabric.js library to do that. Fabric.js converts an image and other items into canvas. Then I add some image on the canvas (stickers) and export it...

error “The connection to the server was unsuccessful. (file:///android_asset/www/index.html)” in codovar and jqury


android,jquery,cordova,jquery-mobile
I created an app for android using cordova and jquery mobile. It works well when I test run the code using google chrome, but when I try to run it on android emulator using android studio in cmd (locate>cordova emulate android) it doesn't working. When i try to run it...

Content-Security-Policy breaking console.log output


javascript,cordova,console.log,content-security-policy
Developing an app on version 5 of cordova (using the phonegap framework). The latest updates request you use a Content-Security-Policy meta tag as per their documentation: https://github.com/apache/cordova-plugin-whitelist Here's my tag for the app: <meta http-equiv="Content-Security-Policy" content="default-src *; style-src 'self' 'unsafe-inline'; script-src 'self' 'unsafe-inline' 'unsafe-eval' *.example.com"> When I include this everything...

Cordova Keychain Plugin and SSKeychain Plugin do not work together


ios,cordova,cordova-plugins,keychain
We are having a tough time trying to shared info between two apps with keychain service. We have two apps: 1.- CoreApp, which is native and use this plugin SSKEYCHAIN to set values: + (BOOL)setPassword:(NSString *)password forService:(NSString *)serviceName account:(NSString *)account; Where are setting for paramenter the following values: password =...

Unexpected data representation


javascript,jquery,jquery-ui,jquery-mobile,local-storage
So I have an app, that allows you to add data, and then it displays all the data(still wip). So I made a Create and Read functionality so far using localStorage and jQueryMobile and jQueryUI. But for some reason when I switch between pages(main page/add data page), I see cloned...

Image Map Area Highlight and Zooming with iScroll 4


javascript,cordova,iscroll,imagemapster
In my Cordova project, I have a slider with multiple zoomable images (by iScroll) and I would like to use map to highlight some area always. But I have tried many libraries like imagemapster.js, maphilight.js but these libraries prevent images' zooming feature. Is there any library that I can use...

Use different library instead of jQuery Mobile for