Back button android not work


#1

Hi!

I use code app.js for build app via build.phonegap.com

// Dom7
var $$ = Dom7;

var app_id = '7';
var api_link = 'https://site.ru/';

// Theme
var theme = 'auto';
if (document.location.search.indexOf('theme=') >= 0) {
  theme = document.location.search.split('theme=')[1].split('&')[0];
}

// Init App
var app = new Framework7({
  id: 'io.framework7.testapp',
  root: '#app',
  theme: theme,
  data: function () {
    return {
      project: {
        id: app_id,
        api_link: api_link,
      },
    };
  },
  methods: {
    helloWorld: function () {
      app.dialog.alert('Hello World!');
    },
  },
  routes: routes,
  vi: {
    placementId: '',
  },
});

// Init/Create main view
var mainView = app.views.create('.view-main', {
  url: '/'
});

// Add statistic
var userToken = localStorage.getItem('usertoken');

// Check device
if (app.device.ios) {
  var device = 1;
} else if (app.device.android) {
  var device = 2;
} else {
  var device = 3;
}

app.request({
  beforeSend: function (xhr) {
    if (userToken) {
      xhr.setRequestHeader('authorization', userToken);
    }
  },
  url: api_link + 'api/app/add_statistic?app_id=' + app_id +'&device='+ device,
  crossDomain: true,
  method: "GET",
  success: function(response) {

    var alertsNotify = JSON.parse(response);

    //console.log(alertsNotify.count);

      var dialogs = app.dialog.create({
        title: alertsNotify.alerts[0].name,
        text: alertsNotify.alerts[0].message,
        buttons: [
          {
            text: 'OK',
            onClick: function(dialog, e) {
              for (i = 1; i <= alertsNotify.count; i++) {
                app.dialog.create({
                  title: alertsNotify.alerts[i].name,
                  text: alertsNotify.alerts[i].message,
                  buttons: [
                    {
                      text: 'OK',
                    }
                  ],
                }).open();
              }
            }
          }
        ],
      }).open();

  },
  error: function (error) {

    console.log('error');

  },
});

var opened = 0;
function exitApp(){
  if (opened > 0) {
    return false;
  } else {
    app.dialog.confirm('Are you sure you want to exit?', 'Exit App', 
      function () {
      navigator.app.exitApp();
      },
      function () {
      opened = 0;  
      return false;
      }
    );
    opened = 1;
  }
}

    
function onBackKeyDown() {
  // Handle the back button
  if(app.views.main.history.length == 1){
    exitApp();
    e.preventDefault();
  } else {
    app.dialog.close();
    app.views.main.router.back();
    return false;
  }
}

document.addEventListener("backbutton", onBackKeyDown, false);

This not work. Help me please


#2

Try to debug. Find error string. Do you include cordova.js?


#3

i used online build phonegap and cordova js auto included in project


#4

Cordova.js need to add to HTML any way


#5

yes, this file added in index.html


#6

Try to use “try catch” block with info error message.


#7

i not get error messages(
Guys, you can share the working examples back button Android?


#8

Help me please. I can not solve the problem the second day


#9

Hi, i have it this way and it works fine;
index.html

...
<script type="text/javascript" src="cordova.js"></script>
...

app.vue

  mounted() {
    this.selectApp ()
    Helper.isUruguay()
    this.$nextTick(function() {
      document.addEventListener("backbutton", this.onBackKeyDown, false);
    })
    // this.getQueryBoxes()
  },
...
 onBackKeyDown() {
...
},

#10

Thank you! But i not used vue.js


#11

its the same. Vue dosnt make the button work.

can you do a simple test?

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

function onDeviceReady() {
  alert('deviceready')
}

function onBackKeyDown() {
  alert('backbutton press')
}

and tell if both alerts shows.


#12

Thank you for your advice!
I have to post code in file app.js? I try to do it now


#13

yes, your main js file.


#14

i edit code app.js

// Dom7
var $$ = Dom7;

var app_id = '7';
var api_link = 'https://site.ru/';

// Theme
var theme = 'auto';
if (document.location.search.indexOf('theme=') >= 0) {
  theme = document.location.search.split('theme=')[1].split('&')[0];
}

// Init App
var app = new Framework7({
  id: 'io.framework7.testapp',
  root: '#app',
  theme: theme,
  data: function () {
    return {
      project: {
        id: app_id,
        api_link: api_link,
      },
    };
  },
  methods: {
    helloWorld: function () {
      app.dialog.alert('Hello World!');
    },
  },
  routes: routes,
  vi: {
    placementId: '',
  },
});

// Init/Create main view
var mainView = app.views.create('.view-main', {
  url: '/'
});

// Add statistic
var userToken = localStorage.getItem('usertoken');

// Check device
if (app.device.ios) {
  var device = 1;
} else if (app.device.android) {
  var device = 2;
} else {
  var device = 3;
}

app.request({
  beforeSend: function (xhr) {
    if (userToken) {
      xhr.setRequestHeader('authorization', userToken);
    }
  },
  url: api_link + 'api/app/add_statistic?app_id=' + app_id +'&device='+ device,
  crossDomain: true,
  method: "GET",
  success: function(response) {

    var alertsNotify = JSON.parse(response);

    //console.log(alertsNotify.count);

      var dialogs = app.dialog.create({
        title: alertsNotify.alerts[0].name,
        text: alertsNotify.alerts[0].message,
        buttons: [
          {
            text: 'OK',
            onClick: function(dialog, e) {
              for (i = 1; i <= alertsNotify.count; i++) {
                app.dialog.create({
                  title: alertsNotify.alerts[i].name,
                  text: alertsNotify.alerts[i].message,
                  buttons: [
                    {
                      text: 'OK',
                    }
                  ],
                }).open();
              }
            }
          }
        ],
      }).open();

  },
  error: function (error) {

    console.log('error');

  },
});
document.addEventListener("deviceready", onDeviceReady, false);
document.addEventListener("backbutton", onBackKeyDown, false);

function onDeviceReady() {
  alert('deviceready')
}

function onBackKeyDown() {
  alert('backbutton press')
}

I not get alert. My app collapses
What could be the problem?


#15

what do you mean? app crash? thas really weird.

can you share your index.html?

if everything its ok you should see the deviceready alert

do you have any errors in the console?


#16

I found a problem in build application via build.phonegap
file cordova.js not included in index.html. I change this.
Thank you, you really helped me! Thank you very much!