Multiple editors in handsontable

问题:

I'm wondering how its possible to use multiple editors in handsontable.js library.

I'm using the columns option to specify each column attributes. Some of them show a list with the possible options for the cell:

{
    data: 3,
    type: 'autocomplete',
    source: function (query, process) {
        response = JSON.parse($('#options').val());
        process(response);
    },
    strict: false,
    allowInvalid: true,
},

In this case, it will generate the list of options in the source option.

Now, I would like to add another editor as per this other issue but I noticed that if I add it in the columns declaration then I lose the source option that generates the autocomplete list:

{
    //START
    data: 3,
    type: 'autocomplete',
    source: function (query, process) {
        response = JSON.parse($('#start_array').val());
        process(response);
    },
    strict: false,
    allowInvalid: true,
    editor: LoggingEditor //added here
}

Any solution to this?

Reproduction of the issue

回答1:

Handsontable is using cascading configuration, which is way to provide configuration options for whole table, its columns or particular cells.

In your case specifying the type attribute (you mentioned it here) trumps the top-level editor: LoggingEditor property. To use a custom editor you have to either not specify a type (because the default is text) or add the editor property to all column definitions. I've edited your example to utilize both methods in this fiddle (note that the autocomplete field do not work, but you should add another custom editor and not use the text one).