Form In ListView Issues

12 posts, 0 answers
  1. Jay
    Jay avatar
    23 posts
    Member since:
    Jul 2013

    Posted 12 Oct 2013 Link to this post

    I'm using Kendo UI, PhoneGap 3, and iOS 7.  I have a Form within a ListView (following example code). I noticed the following behavior/issues:
    1.  When an input field is focused (and using emulated scrolling), the cursor doesn't move along with the input field.
    2. When a field is focused (but now using native scrolling), the cursor does move along BUT overlay the header. The scrollbars are slightly different looking but work fine and don't overlay the header
    3. When you touch a form field (or possibly some other area) and attempt to scroll the listview, sometimes the whole application scrolls and bounces
    4.  When you touch a form field at the lower portion of the form, the virtual keyboard obscures the form field instead of pushing it up and keeping it within view
    5. Continuing from #4, when you go to another view, the virtual keyboard is not dismissed. This is not a problem if the form field is in focus.
    I'm wondering if I'm doing something wrong or if these are indeed issues. If the latter, I would like to know if there are workaround and/or when fixes will be release.

     I've attached the .html file for reference.

    Thanks!


  2. Kiril Nikolov
    Admin
    Kiril Nikolov avatar
    2566 posts

    Posted 15 Oct 2013 Link to this post

    Hi Jay,

    Since Q3 2013, we introduced the native scrolling option that usually helps in setups like yours. I would suggest you to take a look at the following article, explaining how it works and how to implement it in your project:

    http://docs.kendoui.com/getting-started/mobile/native-scrolling

    Regards,
    Kiril Nikolov
    Telerik
    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. Jay
    Jay avatar
    23 posts
    Member since:
    Jul 2013

    Posted 17 Oct 2013 Link to this post

    Thanks, Kiril. I followed your recommendation and observed differences between view data-use-native-scrolling="true" and app useNativeScrolling: true. So I suppose they're not the same?

    Using app useNativeScrolling: true resolved most of the issues. I noticed that the scrolling hints overlay the header and footer (which is mentioned in the doc). However, I also noticed that the header scrolls off the screen when the virtual keyboard is used to tab through the form fields. Is this expected behavior? Is there a workaround?
  5. Kiril Nikolov
    Admin
    Kiril Nikolov avatar
    2566 posts

    Posted 18 Oct 2013 Link to this post

    Hello Jay,

    This is a bug in the iOS7, unfortunately at the moment we have not managed to find a suitable workaround for this behavior.
    Regards,
    Kiril Nikolov
    Telerik
    Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
  6. Jay
    Jay avatar
    23 posts
    Member since:
    Jul 2013

    Posted 26 Nov 2013 Link to this post

    Hi Kiril,

    I downloaded and updated to the Q3 release and now the ListView has lost its kinetic scrolling. Is this intended behavior? Is there a way to enable for app where useNativeScrolling: true? Thanks.
  7. Alexander Valchev
    Admin
    Alexander Valchev avatar
    2877 posts

    Posted 28 Nov 2013 Link to this post

    Hello Jay,

    The behavior is not intended to occur. We were able to reproduce it in a sample page and can confirm that this is a bug. We will log it for further investigation. As a small sign of our apprechiation for bringing this to our attention I updated your Telerik points.

    Regards,
    Alexander Valchev
    Telerik
    Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
  8. Jay
    Jay avatar
    23 posts
    Member since:
    Jul 2013

    Posted 30 Nov 2013 Link to this post

    Thank you, Alex. I look forward to the fix/update. 
  9. Tony
    Tony avatar
    3 posts
    Member since:
    May 2012

    Posted 07 Dec 2013 Link to this post

    I've also noticed issues with forms in listViews on the Android 4.0.3 native browser. One only needs to view the form overview page in the examples directory included in the KendoUI Mobile commercial distribution (/examples/mobile/forms/index.html). I'm using the latest internal build (2013.3.1127). Viewing the page using the Android 4.0.3 native browser:

    • When touching on a form element on the lower half of the page, the virtual keyboard covers the form element. This is not remedied by using {useNativeScrolling: true}. In fact, activating native scrolling seems to make scrolling very "jerky" and not smooth at all. 
    • None of the HTML5 form elements (which is the purpose of that form demo page) such as slider, number input, date input, and time input function at all.
    Are these bugs? As I said, these issues can be seen in your own example code so it can't be something I'm doing wrong.

    thanks,
    Tony
     
  10. Tony
    Tony avatar
    3 posts
    Member since:
    May 2012

    Posted 07 Dec 2013 Link to this post

    Just to clarify on my last post -- when I say that the slider, date, time, and number inputs function "at all", that is actually only true of the slider (which is completely absent), the other form fields do function, but just behave as regular text input fields.

    -Tony
  11. Kiril Nikolov
    Admin
    Kiril Nikolov avatar
    2566 posts

    Posted 10 Dec 2013 Link to this post

    Hi Tony,

    Thank you very much for detailed information provided.

    The date and time inputs do not work on Android 4.0.3, because they are not implemented inside the native browser - only some of the Samsung phones support it, but this is because of a implementation that they did for their phones. The slider is a widget part of the web suit and you are deploying it using Kendo UI Mobile, so maybe this is the reason why it is not working?

    As for the native scrolling and keyboard overlay- these are issues buried deep inside Android 4.0.3 and non-existent in the latest versions. In general this version of Android does not perform as expected and ships with a lot of problems, that are hard to override and repair. Please note that this is an issue with a high priority that we are currently working on and if we manage to resolve it, a fix will be published.

    I would like to thank you in advance for your patience and understanding.

    Regards,
    Kiril Nikolov
    Telerik
    Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
  12. Tony
    Tony avatar
    3 posts
    Member since:
    May 2012

    Posted 17 Feb 2014 in reply to Kiril Nikolov Link to this post

    I understand now that the demo took advantage of new HTML5 form elements which are only available in certain browsers. It would've been nice of KendoUI Mobile took these incompatibilities into account and provided polyfills as fallbacks to modern-but-non-compliant browsers (like Android). Shouldn't that be one of the main objectives of a mobile framework? In any case, it was disappointing because the client I had required coverage in Android browser so I had to convert it over to jQuery Mobile.
  13. Kiril Nikolov
    Admin
    Kiril Nikolov avatar
    2566 posts

    Posted 18 Feb 2014 Link to this post

    Hello Tony,

    We do offer Date and Time picker controls, that can be used in a mobile application as well.:

    DatePicker

    DateTimePicker

    yes they are part of the Web suite, but you can include them in your project and use them on old browsers.

    Regards,
    Kiril Nikolov
    Telerik
    Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
Back to Top
Kendo UI is VS 2017 Ready