We use cookies to give you the best experience on our website. If you continue to browse, then you agree to our privacy policy and cookie policy. (Last updated on: June 24, 2019).
Unfortunately, activation email could not send to your email. Please try again.
Syncfusion Feedback

Configure behavior for inputs in edit inline mode

Thread ID:

Created:

Updated:

Platform:

Replies:

148435 Oct 18,2019 09:08 PM UTC Oct 21,2019 11:51 AM UTC ASP.NET Core - EJ 2 1
loading
Tags: DataGrid
Carlos Porras
Asked On October 18, 2019 09:08 PM UTC

What should I do to modify the inputs behavior so when I hit enter or tab it should move to the next input

Seeni Sakthi Kumar Seeni Raj [Syncfusion]
Replied On October 21, 2019 11:51 AM UTC

Hi Carlos, 
 
We could see you would like to focus the next field in the edit form after pressing the enter or tab key. Currently, on tab key press, the next input field will be focused and on enter key press, the edit state will be closed which is the behavior. However, if you wish to focus the next input on enter key press you can achieve it by overriding the default key configs value that is bound in the Grid. 
 
Initially, in the actionComplete event for beginEdit requestType, the default keyConfigs value for enter key is removed and keyUp event is bound to the form element. In the keyUp event for enter key press, the next element is focused. 
 
function actionComplete(args) { 
    if (args.requestType == "beginEdit") { 
      this.keyConfigs.enter = ""; 
      args.form.addEventListener('keyup', function (event) { 
        if (event.keyCode == 13) { 
          var nextSibling = event.target.closest('.e-rowcell').nextSibling; 
          if (nextSibling) nextSibling.querySelector('.e-field').focus(); 
        } 
      }); 
    } 
} 
 
Now since the default keyConfigs for enter key is removed all the operations for the key will be removed. To avoid it you can restore this when the edit state is closed. 
 
else if (args.requestType == "save" || args.requestType == "cancel") { 
      this.keyConfigs.enter = "enter"; 
} 
 
We have prepared a sample for your reference. You can find it below, 
 
 
Regards,  
Seeni Sakthi Kumar S 


CONFIRMATION

This post will be permanently deleted. Are you sure you want to continue?

Sorry, An error occured while processing your request. Please try again later.

Please sign in to access our forum

This page will automatically be redirected to the sign-in page in 10 seconds.

Warning Icon You are using an outdated version of Internet Explorer that may not display all features of this and other websites. Upgrade to Internet Explorer 8 or newer for a better experience.Close Icon

Live Chat Icon For mobile
Live Chat Icon