Button Not Working in Android Browser

10 posts, 1 answers
  1. Ethan
    Ethan avatar
    6 posts
    Member since:
    Sep 2012

    Posted 27 Dec 2012 Link to this post

    I have found that the button on my login page does not work at all in the stock android browser. I have created a jsfiddle with the relevant section of my page, which you can try at the following link:
    http://jsfiddle.net/efinkel/HSEFs/2/

    It seems like the button does not catch the touch/click event in that browser. However, the page works as expected with the mobile versions of Chrome and Firefox. The phone I tested this with is a Samsung Galaxy S3 running Android 4.04.
  2. Petyo
    Admin
    Petyo avatar
    2439 posts

    Posted 28 Dec 2012 Link to this post

    Hello Ethan,

    I tried to reproduce the problem you describe on this demo page on Android 4.0.4 and Android 4.2.0, to no avail. Can you try testing it on your device, and see if it works correctly for you? It might be the custom styles that interfere with the button click area. 

    All the best,
    Petyo
    the Telerik team
    Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
  3. Kendo UI is VS 2017 Ready
  4. Ethan
    Ethan avatar
    6 posts
    Member since:
    Sep 2012

    Posted 28 Dec 2012 Link to this post

    Hi Petyo,

    Thanks for the response. I tried another phone (Droid Razr Maxx, Android 4.0.4), and it seems to be having the same problem. Again, this problem only occurs on the stock Android Browser. However, the demo page that you linked seems to work fine, so I did a little more testing on jsfiddle. Apparently, I ran into a weird corner case. The problem only occurs on that browser when the button is after a ListView and is floated left or right. Wrapping the button in a div and floating the div fixed the problem. Also, it worked fine when I placed the button (floated) before the ListView or removed the ListView entirely.

    This works fine:
    http://jsfiddle.net/efinkel/HSEFs/26/

    This is broken in the stock browser:
    http://jsfiddle.net/efinkel/HSEFs/27/

    I will use the solution above in my own code, but I thought you might like to look into it further.

    Thanks,
    Ethan
  5. Petyo
    Admin
    Petyo avatar
    2439 posts

    Posted 29 Dec 2012 Link to this post

    Hello Ethan,

    Thank you for sharing your findings - it is quite a non-obvious glitch. We will investigate further, perhaps it might be fixable. 

    Regards,
    Petyo
    the Telerik team
    Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
  6. Answer
    Dimo
    Admin
    Dimo avatar
    8332 posts

    Posted 03 Jan 2013 Link to this post

    Hi Ethan,

    We found the cause of the problem - it is triggered by the following CSS rule

    .km-on-android.km-4 {
      -webkit-transition: -webkit-transform 0.0001ms;
    }

    Its purpose is to enable 3D acceleration in Samsung Galaxy S3 with Android 4.0. You can override it with:

    .km-root .km-on-android.km-4
    {
      -webkit-transition: none;
    }

    However, please note that this will harm performance in Samsung Galaxy S3. It is possible that they have fixed the issue on their side in Android 4.1. This update is official now for this device, so you can test the workaround with it.

    Regards,
    Dimo
    the Telerik team
    Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
  7. Alan
    Alan avatar
    2 posts
    Member since:
    May 2008

    Posted 16 Jan 2013 Link to this post

    I am having a similar issue. My buttons will work, but only if I can tap at the very bottom. The buttons don't even show a highlight when I tap, but the events fire. If the button does highlight, then I know I tapped too high and the events do not fire.

    I am using a Galaxy S3, and I have tried all of the workarounds in this post, but nothing seems to work.

    Any ideas?
  8. Dimo
    Admin
    Dimo avatar
    8332 posts

    Posted 17 Jan 2013 Link to this post

    Hi Alan,

    I am not sure this is the same problem as the one discussed previously, but based on the provided information, I can't offer you any alternative solutions. Can you provide a jsFiddle / jsBin demo which reproduces the described behavior?

    All the best,
    Dimo
    the Telerik team
    Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
  9. Alan
    Alan avatar
    2 posts
    Member since:
    May 2008

    Posted 17 Jan 2013 Link to this post

    It would be easier for me to post my project in a support ticket if that works for you guys.
  10. Anthony
    Anthony avatar
    122 posts
    Member since:
    Jun 2013

    Posted 29 May 2014 Link to this post

      I have the same problem, I'll try to separate out my logic and post it but what was the answer to Alan's problem?

    This is on the Android emulator, it's also on my Motorola Moto G

    The problem is I have a button, clicking it causes it to flash blue but not run the onclick method, if I click slightly to the top left of the button it fires the onclick
  11. Anthony
    Anthony avatar
    122 posts
    Member since:
    Jun 2013

    Posted 29 May 2014 in reply to Anthony Link to this post

    Sorry, I can't delete or edit the last post.

    Ignore that, I forgot you can't use the normal Kendo button on mobile. I'm using a KendoMobileButton now and it works
Back to Top
Kendo UI is VS 2017 Ready