Starting Inline Editing on pressing the Enter

h.nijkamp17

I was happy to find this example about triggering inline editing when enter (key 13) is beeing pressed. https://datatables.net/reference/event/key

Obviously I want Inline editing to be started on pressing the enter key on the keyboard.

Unfortunately (in my case) the enter key will trigger the Editor.prototype.submit event causing the inline state te close immediatly after starting. I checked all this debugging in javascript step by step. So I know the inline editing starts correctly.

Is there anyway of preventing this? I have tried originalEvent.preventDefault() which works on any other key then the enter??

Here is my code:

      table

            .on('key', function (e, datatable, key, cell, originalEvent) {
                    switch(key) {
                        case 13:
                            //ENTER KEY DOES NOT WORK !?
                            var response = editor
                                .one('close', function () {
                                    table.keys.enable();
                                }).inline( cell.node(), { submit: 'allIfChanged' } );
                            table.keys.disable();

                            originalEvent.preventDefault();

                            break;
                        case 78:
                            //'N' KEY DOES WORK !!!
                            var response = editor
                                .one('close', function () {
                                    table.keys.enable();
                                }).inline( cell.node(), { submit: 'allIfChanged' } );
                            table.keys.disable();

                            originalEvent.preventDefault();


                            break;
                        default:
                            //console.log('Key press: ' + key + ' for cell ' + cell.data());
                    });

allan

Are you able to give me a link to the page showing the issue please? This example shows how Editor and KeyTable can be used together for spreadsheet like editing.

Allan

h.nijkamp17

Hi Allen,

Thanks a lot for pointing out this example. Turns out one specific line of code in the example is crucial the wanted behaviour.

Thanks again!

       keys: {
                    columns: ':not(:first-child)',
                    editor:  editor   //THIS LINE FIXED THE PROBLEM
                },

h.nijkamp17

Hi Allen,

One more question on this topic. In the example you gave, the keytable is being disabled when the editor form is open. But is there a way to diabled it on inline editing aswell? So the user can use the keyboards arrow keys to move te cursor while inline editing a field. Now the selected field will blur and move to another field.

Harry

allan

Use the keys.disable() method. You can listen for open to know when the Editor form is opened and what type it is displaying.

Allan