Issue with keyboard navigation and required field validation on Batch editing

5 posts, 0 answers
  1. Amara
    Amara avatar
    3 posts
    Member since:
    Mar 2018

    Posted 13 May 2018 Link to this post

    Hi all,

    I noticed an issue with Radgrids, when adding new records using Batch Editing (Cell) and having some fields set as required (either through a RequiredFieldValidator or a <asp:CustomValidator ).

    The issue is that the navigation using the TAB key, skipa fields which are not required.

    This issue is visible on the online demo (https://demos.telerik.com/aspnet-ajax/grid/examples/data-editing/batch-editing/defaultcs.aspx), where if you add a new record, you are asked to enter a Product Name, then if you hit the TAB key, it jumps to Unit Price (next required field), hitting the TAB key again makes it jump to the next row.

    However, when editing existing rows, the keyboard navigation behaves "normally", going through each fields (required or not).

    Could someone please have a look and let us know if there is a solution or workaround.

     

    Thank you very much,

    Amara

     

     

     

     

  2. Eyup
    Admin
    Eyup avatar
    3824 posts

    Posted 16 May 2018 Link to this post

    Hi Amara,

    You can check the solution provided in the attached web site sample and try to incorporate it in your original application.
    I hope this will prove helpful.

    Regards,
    Eyup
    Progress Telerik
    Try our brand new, jQuery-free Angular components built from ground-up which deliver the business app essential building blocks - a grid component, data visualization (charts) and form elements.
  3. Amara
    Amara avatar
    3 posts
    Member since:
    Mar 2018

    Posted 17 May 2018 Link to this post

    Hi Eyup,

    Thank you very much for your answer. I tried your sample application and noticed one difference in the batch editing setting. I'm using the Cell as edit type, whereas in your sample, it is set to Row. Unfortunately, switching from row to cell makes the issue still appear.

    Any idea, if there is a way to avoid this?

    Thanks a lot,

    Amara

  4. Marin Bratanov
    Admin
    Marin Bratanov avatar
    4837 posts

    Posted 22 May 2018 Link to this post

    Hi Amara,

    This is the way this feature is implemented at the moment and I can offer the following ideas:

    • use the Row editing mode
    • make all columns required
    • add your request for a change in the functionality in our feedback portal: https://feedback.telerik.com/Project/108/Feedback/List/Feature%20Request. If it becomes popular with the community, our management will consider its implementation.
    • try capturing the tab keydown on your own inputs and use the batch editing manager API to open the next cell (see the API here and the openCellForEdit method) after cancelling the original event. I cannot guarantee this will be easy or even possible, however, because it is not tested and may conflict with built-in logic.

     


    Regards,
    Marin Bratanov
    Progress Telerik
    Try our brand new, jQuery-free Angular components built from ground-up which deliver the business app essential building blocks - a grid component, data visualization (charts) and form elements.
  5. Amara
    Amara avatar
    3 posts
    Member since:
    Mar 2018

    Posted 24 May 2018 Link to this post

    Thanks Marin,

    I will try implementing these solution and will update this thread.

     

    Best,

    Amara

Back to Top