Input in Android: Issues with newest version of KendoUI Mobile styles.

7 posts, 1 answers
  1. RodEsp
    RodEsp avatar
    31 posts
    Member since:
    Sep 2012

    Posted 27 Jul 2012 Link to this post

    I think I just encountered a strange bug. I am running on both the Android 4.0.3 Emulator and an Android 4.0.3 Device (Samsung Galaxy S II).

    If I initialize my application like so:
    app = new kendo.mobile.Application($(document.body));
    <input> html elements seem to not function. As in I can not edit text in text boxes and buttons don't fire any bound click events.

    However, If I initialize the application in the following manner:
    app = new kendo.mobile.Application($(document.body), {platform: "android"});
    then I have no problems at all. Obviously, I would like to use the first initialization for cross-platform styling. 

    This does not happen if I use the 2012.1.515 version of Kendo's styles, <inputs> will work either way with them.
    I would also like to use the newer styles since I think they look better on the android platform.

    I have already looked at this documentation: http://docs.kendoui.com/getting-started/mobile/forms
    But using the css at the bottom has had no effect.
  2. Kamen Bundev
    Admin
    Kamen Bundev avatar
    1532 posts

    Posted 01 Aug 2012 Link to this post

    Hello Rodrigo,

    I've tried to create an app and it did work in both cases in the browser. Can you send a sample page where I can check what is going on? Also please specify if you're running it in the browser, in PhoneGap and if yes - which version of PhoneGap.

    Regards,
    Kamen Bundev
    the Telerik team
    Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
  3. RodEsp
    RodEsp avatar
    31 posts
    Member since:
    Sep 2012

    Posted 01 Aug 2012 Link to this post

    Hi Kamen,

    As I specified, I'm running it in the Android Emulator and a Samsung Galaxy S II (SGH-T989), both using Android 4.0.3.
    I am using Phonegap 1.9.0 and I'm building my app using Phonegap Build.

    It does work fine in a browser, but not as an app/webview on the phone/emulator.
    I know there was a bug in Phonegap where inputs didn't function properly but that was fixed and it was only broken in Android 4.1 not 4.0.3.
    source: https://issues.apache.org/jira/browse/CB-1017

    What I'm wondering is, why does it work just fine with the Q1 kendoui styles (kendo.mobile.all.min.css) but is broken with the Q2 versions of the styles?
  4. Kamen Bundev
    Admin
    Kamen Bundev avatar
    1532 posts

    Posted 02 Aug 2012 Link to this post

    Hello Rodrigo,

    There is a specific CSS style set on the inputs in all Android 4.x browsers to avoid the double inputs issue that can be seen in all Androids. My guess is that the same PhoneGap bug that you posted is triggered by this CSS style in other 4.x environments - there were reports that upgrading to 2.0 fixes the issue. However if you insist to stay on 1.9, you should be able reverse it with this rule, just make it sure it is added after the Kendo Mobile CSS file /or you can use !important instead/:
    .km-android4 input
    {
        -webkit-user-modify: read-write;
    }


    Let me know if one of the two possible workarounds helps.

    Greetings,
    Kamen Bundev
    the Telerik team
    Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
  5. RodEsp
    RodEsp avatar
    31 posts
    Member since:
    Sep 2012

    Posted 02 Aug 2012 Link to this post

    Thanks for the prompt reply Kamen,

    Upgrading to Cordova 2.0 does fix the issue, but applying that css rule does not.
    I suppose I will just have to wait until PhoneGap Build supports Cordova 2.0.

    Is there a plan to fix the double inputs bug without a css "hack" later on?

    Thanks for all the work you do and all the questions you've answered!
  6. Answer
    Kamen Bundev
    Admin
    Kamen Bundev avatar
    1532 posts

    Posted 03 Aug 2012 Link to this post

    Hi Rodrigo,

    Unfortunately no - this is an Android native browser bug and nothing else fixes it cleanly - there are two methods with almost equal bad effects.

    Our Icenium beta 2 will support PhoneGap 1.7 and 2.0, you can give that a try. I'm using it for testing iOS and Android apps.

    All the best,
    Kamen Bundev
    the Telerik team
    Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
  7. RodEsp
    RodEsp avatar
    31 posts
    Member since:
    Sep 2012

    Posted 03 Aug 2012 Link to this post

    Hi Kamen,

    That's great to hear. I've been following Icenium's development for the past 2 months and I'm extremely excited to see it coming along so well.

    Thanks again for the help.
Back to Top