How to remove Bing map (and all child controls) from tab order

Question

Does the Bing maps control (Microsoft.Maps.Map) offer an API for removing itself (and its child controls) from the tab order?

Alternatively, is there an appropriate callback (post rendering) I can use to set the tabIndex recursively on all elements once the map has rendered itself?

NB: I've seen there are options at construction time for specifying whether to render the map type selector/locate me button/zoom buttons. But lets assume we want to render those controls just remove them from the tab order.

score 0 · Accepted Answer · answered Jul 20 '18 at 01:18

I managed to achieve it using a MutationObserver:

var mapElem = document.getElementById("map");

let deferredClearTabIndexEvent: number | undefined;

if (mapElem !== null) {
    var config = { attributes: true, childList: true, subtree: true };
    var callback = () => {
        if (deferredClearTabIndexEvent === undefined) {
            deferredClearTabIndexEvent = window.setTimeout(() => {
                var elements = mapElem!.querySelectorAll("a, button, input, select, textarea, [tabindex]")
                for (var i=0; i<elements.length; i++) {
                    elements[i].setAttribute("tabIndex", "-1");
                }

                deferredClearTabIndexEvent = undefined;
            }, 0);
        }
    };

    var observer = new MutationObserver(callback);
    observer.observe(mapElem, config);
}

How to remove Bing map (and all child controls) from tab order

1 Answers1