question

TanzimShaikh-9259 avatar image
0 Votes"
TanzimShaikh-9259 asked TanzimShaikh-9259 answered

SharePoint 2019 does not generate PDF thumbnails using jQuery or Javascript code

Hello,
I was referring to the article "SharePoint 2013 get thumbnail from PDF" but I couldn't comment on it further hence started a new thread. My environment is SharePoint 2019 on-premises and I am using Scandel's code in github to produce PDF thumbnail.

Problem: It can only generates the PDF thumbnail if I add it manually one by one like this <img data-pdf-thumbnail-file="https://fakesharepoint.com/sites/whatever/DocumentLibrary/samplePDF.pdf" data-pdf-thumbnail-width="100" data-pdf-thumbnail-height="150" />. However I want to get it in to the loop so that I may generate all the PDF thumbnails on the SharePoint page. I am using ASPX page of SharePoint.


office-sharepoint-server-development
5 |1600 characters needed characters left characters exceeded

Up to 10 attachments (including images) can be used with a maximum of 3.0 MiB each and 30.0 MiB total.

MichaelHan-MSFT avatar image
1 Vote"
MichaelHan-MSFT answered MichaelHan-MSFT edited

Hi @TanzimShaikh-9259,

You could use sharepoint jsom to get all files, then loop through the files and add the file url to the img element, for example:

 var clientContext = new SP.ClientContext();
 //get the library
 var library = clientContext.get_web().getFolderByServerRelativeUrl('/sites/test/DocumentLibrary');
 //get all files in the library
 var files = library.get_files();
 clientContext.load(files);
 clientContext.executeQueryAsync(onSuccess,onFailed);
 var images=""
 function onSuccess(){
     files.get_data().forEach(file=>{
         var fileName=file.get_name();
         //get pdf files only
         if(/\.pdf$/.test(fileName)){
         var fileUrl=file.get_serverRelativeUrl();
         console.log(fileUrl)
         images+= "<img data-pdf-thumbnail-file='" + fileUrl + "' data-pdf-thumbnail-width='100' data-pdf-thumbnail-height='150' />"
         }
     })
     console.log(images);
     $('#test').html(images);
     createPDFThumbnails();
 }
    
 function onFailed(sender, args) {
     console.log('Failed' + args.get_message() + '\n' + args.get_stackTrace());
 }



If an Answer is helpful, please click "Accept Answer" and upvote it.
Note: Please follow the steps in our documentation to enable e-mail notifications if you want to receive the related email notification for this thread.





5 |1600 characters needed characters left characters exceeded

Up to 10 attachments (including images) can be used with a maximum of 3.0 MiB each and 30.0 MiB total.

TanzimShaikh-9259 avatar image
1 Vote"
TanzimShaikh-9259 answered MichaelHan-MSFT edited

Hi Michael,
We are able to display everything in console without any issue but the real problem is to write to the HTML or write in the jQuery for HTML. It does not display in the SharePoint. We tried innerHTML, html(), document.write and all other methods but it does not display the image. However when we write in HTML as mentioned in my question before then the image appears.

Best regards

· 2
5 |1600 characters needed characters left characters exceeded

Up to 10 attachments (including images) can be used with a maximum of 3.0 MiB each and 30.0 MiB total.

@TanzimShaikh-9259,

You could use jquery method .html(htmlString) to set the HTML contents of the element, for example: $('#test').html(images)

0 Votes 0 ·

Update:
You need to call the function createPDFThumbnails() after you writing images to the HTML. Have update in my original answer

122849-image.png


0 Votes 0 ·
image.png (10.9 KiB)
TanzimShaikh-9259 avatar image
0 Votes"
TanzimShaikh-9259 answered

Hi Michael,
It worked.

Thank you so much.

Best regards

5 |1600 characters needed characters left characters exceeded

Up to 10 attachments (including images) can be used with a maximum of 3.0 MiB each and 30.0 MiB total.

TanzimShaikh-9259 avatar image
0 Votes"
TanzimShaikh-9259 answered

Thank you Michael, I will try and get back to you on this.

5 |1600 characters needed characters left characters exceeded

Up to 10 attachments (including images) can be used with a maximum of 3.0 MiB each and 30.0 MiB total.