HOWTO: Add a hover popup to Dashlet Listviews

sugarcrmdevelopers —  December 21, 2010 — 6 Comments

All of the ListView widgets in Sugar are metadata driven, meaning that you can change the fields shown in them as well as the order and layout of the fields through the metadata files. But you can also customize the actual HTML using is displaying a field in the listview, which we’ll look at in this post.

I recently saw this forums post, which was asking how to show to additional details hover over that we show on the calendar entries on the Tasks Dashlet listview as well. To do this, we simply need to make a small alteration to the dashlet definitions for this module, which we can make in an upgrade-safe way in the custom/modules/Tasks/metadata/dashletviewdefs.php file as shown below:


$dashletData['TasksDashlet'] = $dashletData['MyTasksDashlet'];
$dashletData[&#039;TasksDashlet&#039;][&#039;columns&#039;][&#039;name&#039;][&#039;customCode&#039;] = &#039;<a id='adspan_{$ID}' href='index.php?module=Tasks&amp;action=DetailView&amp;record={$ID}'>{$NAME}</a>';

What we’ve done is simply include the previous dashlet definitions ( as defined in the modules/Tasks/Dashlets/MyTasksDashlet/ file ), then made a small change to make sure they are in the array key expected ( the DashletGeneric::loadCustomMetadata() method expects to look in the <modulename>Dashlet key for definitions ). Now we added the change needed to the name field by adding the ‘custom_code’ attribute, providing the HTML needed to display the field the way we want to. The final result will look something like the below image if you hover your mouse over the name in the listview.

6 responses to HOWTO: Add a hover popup to Dashlet Listviews


    Awesome ! Thanks for these how-to’s they are really helpfull !


    It is missing the onmouseover and onmouseout :


      Another try with encoded html :
      '<a id="adspan_{$ID}" href="index.php?module=Tasks&action=DetailView&record={$ID}" onmouseover="return SUGAR.util.getAdditionalDetails(\'Tasks\',\'{$ID}\',\'adspan_{$ID}\');" onmouseout="return SUGAR.util.closeStaticAdditionalDetails()">{$NAME}</a>'

Trackbacks and Pingbacks:

  1. Url Open in new Window in sugar crm - July 18, 2012

    […] […]

Leave a Reply

Fill in your details below or click an icon to log in: Logo

You are commenting using your account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s