You can add custom icons with tooltip text to display in a column depending on the column value and you can also specify localized tooltip text. This can be done by adding the custom icons as image web resources in the Dynamics 365 instance. Then you would use a JavaScript web resource to add JavaScript code for a column to display the icons depending on the column value.

In this blog we'll describe considerations for adding custom icons with tooltips for a column:

1. Custom icons with tooltips is supported only for the read-only grids; this feature isn't supported for the editable grids.

2. Two new attributes, imageproviderwebresource and imageproviderfunctionname, are added to the layoutxml of savedquery that lets you specify the name of a web resource and a JavaScript function name to display custom icons and tooltip text for a column. The JavaScript code is executed when the page loads.

3. You can also use the new Web Resource and Function Name fields in the Column Properties page while modifying the property of an attribute (column) in a view definition in the Dynamics 365 web client to specify the web resource name and JavaScript function name.

4. The JavaScript function for displaying custom icons and tooltip text expects the following two arguments: the entire row object specified in layoutxml and the calling user's Locale ID (LCID). The LCID parameter enables you to specify tooltip text for the icon in multiple languages. For a list of locale ID (LCID) values that you can use in your code, see Locale IDs Assigned by Microsoft.

5. For adding custom icons for an option set type of attribute, make sure you use the integer value of the options instead of label to avoid breaking the code due to changes in the localized label string. Also, in the JavaScript function, specify just the name of an image web resource that you want to use as an icon for a value in the attribute. The image should be of 16x16 pixels size; larger images will be automatically scaled down to 16x16 pixels size.

The following sample code demonstrates how you can programmatically specify a web resource and a JavaScript function name for adding custom icons and tooltip for the opportunityratingcode column in layoutxml:

System.String layoutXml =

@"

preview='1' icon='1'>

imageproviderfunctionname='displayIconTooltip' />

width='150' disableSorting='1' />

";

And that's how you go about adding custom icons with tooltips for a column in Dynamics 365! To get other helpful tips and tricks delivered right to your inbox, subscribe to our blog.

Happy Dynamics 365'ing!