Add an option to make the dropdown-menu unique on a page with multiple dataTables

[klingo]

When we have multiple DataTables on the same page; each dataTable can have it's own dropdown-menu open at the same time.
We woud like to avoid this and make sure there is only ever one dropdown-menu open across all dataTables.

A workaround I have found for this is to "misuse" the headerRenderer function to count the number of div.dropdown-menu elements present on the page. If there is >1, then I compare the dataTable-Id with the Id of the dropdown (since it starts with that) and then remove the not-matching div.dropdown-menu.

headerRenderer: () => {
    if ($('div.dropdown-menu').length > 1) {
        $('div.dropdown-menu').each((k, v) => {
            if (!v.id.startsWith(tableId)) $(v).remove();
        });
    }
    return 'header label';
}

Maybe this behaviour could be added as a configuration option?

[torrobinson]

Good idea! I've never tested with more than 1 on a page, but this certainly sounds doable