Android backbutton not working framework7 v3

1

Plz help this Issue

I write below code my app.js but not work properly

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

function onBackKeyDown() {
    // Handle the back button
}
2

And what you expect this code to do? From what i see it doesn’t do anything

3 
"use strict"; 
// Dom7
var $$ = Dom7;

// Init App
var app = new Framework7({
  root: '#app',
  theme: 'md',
  routes: routes,
  view : {
	pushState: false
  }
});

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

document.addEventListener("backbutton", onBackKeyDown, false);
		
function onBackKeyDown() {
	// Handle the back button
	if(mainView.activePage.name == 'index'){
		exitApp();
		e.preventDefault();
	} else {
		myApp.closeModal()
		mainView.router.back();
		return false;
	}
}
1 Like
4

You probably will see errors in console. But for example, i can’t see reference to what is mainView and myApp you are referring in back button handler

5

mainView.activePage.name ? (This is for v1)

mainView.router.currentPageEl - HTMLElement of current page

6

Thank u… but i dont understand this issue…
Plz… if possible you write the correct code

7

something like this

"use strict"; 
// Dom7
var $$ = Dom7;

// Init App
var app = new Framework7({
  root: '#app',
  theme: 'md',
  routes: routes,
  view : {
	  pushState: false
  }
});

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);
1 Like
8

in my projects i use this code for Android backbutton

function onDeviceReady() {
  document.addEventListener("backbutton", onBackKeyDown, false)
}

function onBackKeyDown() {
  if (app.popup.get('.popup') == undefined && app.dialog.get() == undefined) {
    app.router.back()
  } else {
    if (app.popup.get('.popup') != undefined)
      app.popup.get('.popup').close()
    
    if (app.dialog.get() != undefined)
      app.dialog.close()
  }
  return false
}

document.addEventListener('deviceready', onDeviceReady, false)

if a popup or a dialog have been opened, its will close when backbutton click, im not trigger the exit app event

9

try this:

function onBackKeyDown ($Event = window.event) {
  $Event.preventDefault();
  $Event.stopPropagation();
  //code here
}
10

app.views.main.router.back() => app.views.current.router.back() for multi views

11

app.router.back() (it’s error) => app.views.current.router.back();

12

It is not works on iOS <=9

13

I have mixed up with another topic.

14

For using back button listener you can use Cordova plugin https://cordova.apache.org/docs/en/4.0.0/cordova/events/events.backbutton.html & add it to onload attribute on body tag

15

You can modify the cordova-app.js in handleAndroidBackButton created automatically:

 ...
  /*
  This method prevents back button tap to exit from app on android.
  And allows to exit app on backbutton double tap
  */
  handleAndroidBackButton: function () {
    var f7 = cordovaApp.f7;
    if (f7.device.electron) return;
    cordovaApp.backButtonTimestamp = new Date().getTime();
    document.addEventListener('backbutton', function (e) {
      if (f7.popup.get('.popup') == undefined && f7.dialog.get() == undefined) {
        f7.views.current.router.back();
      } else {
        if (f7.popup.get('.popup') != undefined){
          f7.popup.get('.popup').close();
        }
        if (f7.dialog.get() != undefined){
          f7.dialog.close();
        }
      }
      if (new Date().getTime() - cordovaApp.backButtonTimestamp < 250) {
        cordovaApp.backButtonTimestamp = new Date().getTime();
        if (window.navigator.app && window.navigator.app.exitApp) {
          window.navigator.app.exitApp();
        }
        return true;
      }
      cordovaApp.backButtonTimestamp = new Date().getTime();
      e.preventDefault();
      return false;
    }, false);
  }, 
...