AnsweredAssumed Answered

Add tooltip to sourcesMenu item (Search widget)

Question asked by cleotokos on Jul 14, 2016
Latest reply on Jul 21, 2016 by cleotokos

The search widget has a dropdown for the user to pick a source to search from. Once the source has been picked, the searchInput textbox is activated - in Internet Explorer, this removes any placeholder text. I'm finding users aren't sure which fields in a particular source are searchable, so in the placeholder text I've added descriptions (ie. "Type tenant name, lot ID"). This works great for Chrome but most of our users use IE. If I could add a title when the user hovers on each source in the dropdown menu, that would be great - but I'm having trouble. The search widget puts all my sources into an unordered list, the html output looks like this:


<div data-dojo-attach-point="sourcesNode" class="searchMenu sourcesMenu">

     <ul role="menu">

          <li data-index="0" role="menuitem" class="active" tabindex="0">Address</li>

          <li data-index="1" role="menuitem" class="" tabindex="0">Agreement</li>

          <li data-index="2" role="menuitem" class="" tabindex="0">Assets</li>

          <li data-index="3" role="menuitem" class="" tabindex="0">Lots</li>

          <li data-index="4" role="menuitem" class="" tabindex="0">Marine Reaches</li>

          <li data-index="5" role="menuitem" class="" tabindex="0">Marine Terminals</li>

          <li data-index="6" role="menuitem" class="" tabindex="0">Risk Rating</li>




I would think I could use some jquery, such as this, to access each <li> element and add a title:


$( "ul li:nth-child(0)" ).attr('title', 'Type an address or intersection');
$( "ul li:nth-child(1)" ).attr('title', 'Type a tenant name or lot ID');



This works for a simple html page (jsfiddle) but it's not working in my map. Something must be interacting with it but I'm not sure what...any ideas?