0

I have managed to create a login/signup screen, which works perfectly when served by PhoneGap and viewed in a browser.

However when tested on an iPhone using the PhoneGap App, the "click" function no longer works.

var myApp = new Framework7();
var $$ = Dom7;

// Handle Cordova Device Ready Event
$$(document).on('deviceready', function() {

    //wait for signup page to be fully loaded
    myApp.onPageInit('signup', function (page) {

        //event listener for signup button
        var signupButton = document.getElementById("signup");

        if(signupButton) {
            signupButton.addEventListener("click", signup, false);
        }

        //on click of signup button
        function signup() {

           login code here
        }
    });
});

I am using this "addEventListener" method instead of:

$("#signup").on("touchend", function (){signup()});
$("#signup").on("click", function (){signup()});

After they also did not work on mobile, and stumbling across this question in an attempt to find a solution:

cordova/phonegap onclick doesn't work

Do these methods / handlers behave differently in a browser vs on the PhoneGap app?

PhilS
  • 245
  • 7
  • 16

3 Answers3

2

I had the same issue on iOS and had to add e.preventDefault() to resolve the issue. 

$('#signup').on('click', function (e) {
    e.preventDefault();
    signup();
});
Elim Garak
  • 1,728
  • 1
  • 16
  • 21
  • Just tried this, same result, button does nothing, and no "login failed" popup as there is in a browser! – PhilS Aug 18 '17 at 13:21
  • 1
    This worked, the problem now is iOS ATS not allowing the Ajax post to a local host (no SSL), but that is a different problem! – PhilS Aug 18 '17 at 20:57
2

Try setting you element #signup to have a css rule of cursor:pointer, then try $('#signup').on('click', function(){});

lscmaro
  • 995
  • 8
  • 22
0

Ok for me the issue was having the button events defined as a result of "window.onload" or "document.addEventListener('deviceready'", I tried both, when I placed the handler definition in my html file it worked, so looks like a bug.

So this now works,

$("#clr").on("click", function () {
   $("#mylabel").html("");
});

I used the hello app when I created my project and it uses the "app" class.

Marian Smith
  • 21
  • 2