Kendo Keyboard Shortcut for "Update" button

9 posts, 1 answers
  1. Cody
    Cody avatar
    7 posts
    Member since:
    Jun 2014

    Posted 26 Sep 2018 Link to this post

    Hi, not sure if anyone would know this, but when I hit "Add new Record" and I fill out the new record I'd like to hit CTRL+ENTER and it "insert" that record. Anyone have any idea how to do this? I looked on google but couldn't quite figure it out.
  2. Answer
    Stefan
    Admin
    Stefan avatar
    3067 posts

    Posted 28 Sep 2018 Link to this post

    Hello, Cody,

    This can be achieved by attacking using keydown handler on the Grid and programmatically clicking the update button when this combination of keys is preset. The handler can be attached to the onDataBound event:


    dataBound:function(event){
      $('.k-grid').keydown(function(e){
        if(e.ctrlKey === true && e.keyCode === 13){
          $('.k-grid').find('.k-grid-update').click()
        }
      })
    },

    I made an example in jQuery, but the implementation using Grid for ASP.NET Core is the same:
     
    https://dojo.telerik.com/ujUnUfaW

    I hope this is helpful.

    Regards,
    Stefan
    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. Cody
    Cody avatar
    7 posts
    Member since:
    Jun 2014

    Posted 28 Sep 2018 in reply to Stefan Link to this post

    Great I'll give it a try shortly
  4. Cody
    Cody avatar
    7 posts
    Member since:
    Jun 2014

    Posted 28 Sep 2018 in reply to Stefan Link to this post

    Worked like a charm :)
  5. Cody
    Cody avatar
    7 posts
    Member since:
    Jun 2014

    Posted 28 Sep 2018 in reply to Stefan Link to this post

    Worked like a charm :)
  6. Cody
    Cody avatar
    7 posts
    Member since:
    Jun 2014

    Posted 28 Sep 2018 Link to this post

    after further testing it enters 1 row. then when i do it again it enters 2 rows. then when i do it again it enters 3 rows, making it a total of 6 rows instead of 3. I have a Master Table then a detailed table so I made it:

    dataBound:function(event){

    $('.k-detail-cell').keydown(function (e) {
                                    if (e.ctrlKey === true && e.keyCode === 13) {
                                        $('.k-detail-cell').find('.k-grid-update').click()
                                    }
                                })

    }

     

    any thoughts

  7. Stefan
    Admin
    Stefan avatar
    3067 posts

    Posted 01 Oct 2018 Link to this post

    Hello, Cody,

    As the detail Grid has multiple details rows, this handler is probably attached multiple time.

    I can suggest attacking this to the details Grid dataBound event and instead of using the class selector the use the event that contains only the current Grid:

    dataBound:function(event){
      $(event.sender.wrapper).keydown(function(e){
        if(e.ctrlKey === true && e.keyCode === 13){
          $('.k-grid').find('.k-grid-update').click()
        }
      })
    },

    The other option will be to remove the event handler every time before attaching it, to ensure that if there are other handlers they will be removed:

    dataBound:function(event){
      $(event.sender.wrapper).unbind("keydown")
      $(event.sender.wrapper).keydown(function(e){
        if(e.ctrlKey === true && e.keyCode === 13){
          $('.k-grid').find('.k-grid-update').click()
        }
      })
    },

    Please check the first approach initially, as the second is removing the keydown handler and this could affect some functionalities if they depend on it.

    Regards,
    Stefan
    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.
  8. Cody
    Cody avatar
    7 posts
    Member since:
    Jun 2014

    Posted 01 Oct 2018 in reply to Stefan Link to this post

    I’ll give it a try tonight :)
  9. Cody
    Cody avatar
    7 posts
    Member since:
    Jun 2014

    Posted 13 Mar 2019 in reply to Stefan Link to this post

    I just wanted to say I got this to work. I just removed the need to push "ctrl" and it worked fine :) Now I just hit ENTER and it inserts the line for me!
Back to Top