My requirement is i have to display files from document library with images using javascript object model or spservices. pls let me now is there a way.

3 Answers 3


SharePoint has already lots of icons available in the DOCICON.xml file (14-Hive at C:/Program Files/Common Files/Microsoft Shared/web server extensions/14/TEMPLATE/XML)

Simplest way could be to load based on file extension "/_layouts/images/icXXX.gif (where icXXX, would be icdoc.gif, idpdf.gif, etc.)

  • Glad it helped, please mark always appropriate answers if it helped, to allow others to benefit from. Thank you, C:\>Marius Commented Sep 29, 2013 at 11:43
  • Thanks for that tip Marius. for pdf sharepoint using icpdf.png not gif, I wondered why Commented Jan 10, 2014 at 7:56
  • Thanks, it worked well, But how to dynamically update doc icon of specific item based on checkout, check in actions. Thanks in advance.
    – raju
    Commented Oct 3, 2018 at 16:27
  • The overlay will do that for you in standard situations. when you use your icons, that's a bit more tricky, don't have a solution yet. Sorry Commented Oct 18, 2018 at 14:46

You can use the script below :

<script type="text/javascript">
    function getFileTypeIcon(fName, size) {
    var dfd = $.Deferred();
    url: _spPageContextInfo.webAbsoluteUrl + "/_api/web/maptoicon(filename='" + fName + "', progid='', size=" + size + ")",
    method: "GET",
    headers: { "Accept": "application/json; odata=verbose" },
    success: function (data) {
        dfd.resolve(_spPageContextInfo.webAbsoluteUrl + "/_layouts/15/images/" + data.d.MapToIcon);
    error: function (errMsg) {
        if (errMsg.responseText) {
    return dfd.promise(); 
$(document).ready(function() {
    // size = 0 for small and 1 for large
    getFileTypeIcon('https://someurl/someName.pdf', 1).then(function (result) {
        // Write the complete url to file icon

If the list item is a document then you can use the MapToIcon method of the SPUtility class

if (Item.File != null) 
    SPUtility.MapToIcon(Web, Path.GetExtension(Item.File.Name), string.Empty, IconSize.Size16); 

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Not the answer you're looking for? Browse other questions tagged or ask your own question.