Critical problem with RadTouchExtender on mobiles

4 posts, 0 answers
  1. René
    René avatar
    68 posts
    Member since:
    Aug 2011

    Posted 21 Mar Link to this post

    Hello,

    we have serious problem on mobiles. Inputs on page are not focusable on small screens. It is also visible in Chrome Dev tools with iPhoneX profile active.

     

    -Navigate to page https://maxxibs.uat.creasoft.cz/login in Chrome and activate DevTools (F12) with Device iPhoneX

    -When page loads, try to click to login/password inputs. When login is focused (1st one), try to focus password input (2nd one). Sometimes you have to click more times to get to this issue. In mobile it hangs on 1st time.

    -Login stays focused, you are not able to focus password field.

     

    Based on dev tools it is related to touchstart event listener on input. Seems that it activates "onDrag" event based on RadTouchExtender class on rdContent and prevents focus input. When RadTouchExtender class is removed, all works fine.

     

    This is critical problem, because users are not able to login using iPhones and some Androids. How to solve this?

    Best Regards

    René

  2. Peter Milchev
    Admin
    Peter Milchev avatar
    613 posts

    Posted 22 Mar Link to this post

    Hello Raptor,

    The issue seems to be due to the fact that the container of the inputs is wider than one of its parents. 

    Please check if setting the width of the Dock_197_C_ctl00_LoginView1_Login1_pnlLogin element is less than its Dock_197_C parent. 

    Currently, the width of the Dock_197_C element is 375px, while the one of the Dock_197_C_ctl00_LoginView1_Login1_pnlLogin is 380px. Once you make the width of the Dock_197_C_ctl00_LoginView1_Login1_pnlLogin element to be 375px or less, the focusing works as expected.

    Regards,
    Peter Milchev
    Progress Telerik
    Get quickly onboarded and successful with your Telerik and/or Kendo UI products with the Virtual Classroom free technical training, available to all active customers. Learn More.
  3. René
    René avatar
    68 posts
    Member since:
    Aug 2011

    Posted 22 Mar Link to this post

    Hello,

     understand, I'll fix styling for small screen devices to be truly responsive.

    But could you please tell me what exactly is wrong? Different sizing should not prevent me focusing element, or not? Is there something hardcoded in RadTouchExtender?

    Best Regards

    René

     

  4. Vessy
    Admin
    Vessy avatar
    2067 posts

    Posted 27 Mar Link to this post

    Hi René,

    This is a specific of the TouchScroll implementation - if the child element is bigger than the parent it is expected that the parent is scrollable, causing some events to be prevented. I hope this shed some light on the matter.

    Kind regards,
    Vessy
    Progress Telerik
    Get quickly onboarded and successful with your Telerik and/or Kendo UI products with the Virtual Classroom free technical training, available to all active customers. Learn More.
Back to Top