Adding Document Icons in SharePoint Dataview

When viewing documents list from a document library in Sharepoint the default view page the list displays a document icon which gives a visual cue to the user about the type of document. This feature is not available when using a dataview control within a Sharepoint page. By default, the dataview gives only the file path and file name as shown below.

We can display the document icon name by including the special document icon column to the dataview XSLT as below

            <xsl:value-of select=”@DocIcon”>
</xsl:value-of>

This will just add the document icon name as shown below

The document icons are stored in the _layouts/images folder. We need to use the special ddwrt:MapToIcon function and the DocIcon column to map the exact icon path. The syntax for ddwrt:MapToIcon function is

MapToIcon(string szProgID, string szExt)

So to  display an image that shows to the document icon  we need use the below HTML

<a href={@DocIcon}” src=”/_layouts/images/{ddwrt:MapToIcon(string(@HTML_x005F_x0020_File_x005F_x0020_Type),string(@DocIcon))}” _fcksavedurl=”/_layouts/images/{ddwrt:MapToIcon(string(@HTML_x005F_x0020_File_x005F_x0020_Type),string(@DocIcon))}” />