Using dijit/TooltipDialog with Table of Contents (TOC) Widget

[DarrinBaldinelli]

I'm trying to use the dijit/TooltipDialog (http://dojotoolkit.org/reference-guide/1.9/dijit/TooltipDialog.html) to display a message when the user hovers over a certain element in our Table of Contents Widget (http://www.arcgis.com/home/item.html?id=9b6280a6bfb0430f8d1ebc969276b109).

The problem is, the dynamically created elements inside the TOC don't have accessible IDs that I can use to know when the user hovers his/her mouse over a certain one. I'll give you an example. One of the labels in the TOC is named "Zoning", and I would like for the dijit/TooltipDialog to appear when the user hovers over the word "Zoning". Here's what the "Legend" looks like in the HTML after it's been dynamically generated:

<span class="agsjsTOCRootLayerLabel" data-dojo-attach-point="labelNode">Zoning</span>

This is the code I tried implementing:

    require([
        "dijit/TooltipDialog",
        "dijit/popup",
        "dojo/on",
        "dojo/dom",
        "dojo/domReady!"
            ], function (TooltipDialog, popup, on, dom) {
                var myTooltipDialog = new TooltipDialog({
                    id: 'myTooltipDialog',
                    style: "width: 300px;",
                    content: "<p>Disclaimer:",
                    onMouseLeave: function () {
                        popup.close(myTooltipDialog);
                    }
                });

                on(dom.byId('labelNode'), 'mouseover', function () {
                    popup.open({
                        popup: myTooltipDialog,
                        around: dom.byId('labelNode')
                    });
                });
            });

I tried using the "labelNode" attribute, but since it's not an ID, it does not work and the popup doesn't generate. Can anyone point me in the right direction here? Help is much appreciated. Thanks in advance!

By the way, this is all taking place inside Tax Parcel Viewer 10.2.

[JonathanUihlein]

From this page http://dojotoolkit.org/reference-guide/1.9/quickstart/writingWidgets.html :

"data-dojo-attach-point and data-dojo-attach-event are documented in detail on the dijit._TemplatedMixin  page, but the important thing to note is that data-dojo-attach-event  sets up a listener for events on the DOM nodes, and  data-dojo-attach-point sets up a pointer to the DOM nodes."

http://dojotoolkit.org/reference-guide/1.9/dijit/_TemplatedMixin.html#dijit-templatedmixin

You can always edit the TOC widget to generate ids on particular elements if you desire.

However, you may not need IDs since you have a reference to the widget and subsequently, its children. (Also note that you have a reference to that span internally using the provided data-dojo-attach-point")