sharepoint 2013 dynamic iframe PDF without OWA in default edit form

Question

I've been requested to prepare a form to fill some field when uploading a pdf on a document library.

Added a text field and marked as mandatory do the tricks pretty well, but I need to display the uploaded pdf as well.

I thought to add an iframe to do this. If I simply add an iframe with static pdf in a script editor webpart this is working, but when I try to do in a dynamic way I started to face several issues. the edit form is giving me the id while iframe needs the path.

I'm pretty new in javascript, and searching around I assembled from other sources the following code that does the trick and displays the pdf, but it is hiding the fields. (I think because it is loading another page). Is there a way to accomplish what I need without installing office web apps?

If not I'm going to build a custom webapp. Thank you in advance.

<script language="javascript" type="text/javascript">
JSRequest.EnsureSetup(); 
var q = JSRequest.QueryString["ID"];

var requestUri = _spPageContextInfo.webAbsoluteUrl +
             "/_api/web/lists/getByTitle('Documents')/items?$select=EncodedAbsUrl&$filter=Id eq " + q;


var requestHeaders = {
    "accept": "application/json;odata=verbose"
}

$.ajax({
    url: requestUri,
    type: 'GET',
    dataType: 'json',
    headers: requestHeaders,
    success: function (data) 
    {        
       $.each(data.d.results, function(i,result) {
            var path = result.EncodedAbsUrl;
            var extension = path.toLowerCase().slice(-3);
            if (extension == "pdf"){
            document.write('<iframe frameBorder="0" width="530" height="700" src="' + path + '" /></iframe>');
            }
         });

    },
    error: function ajaxError(response) {
        alert(response.status + ' ' + response.statusText);
    }
});

</script>

Answer 1

At the end I wrote a simple web part that generates an iframe to have pdf displayed.

Prerequisites to have it working:

• A query string passing Item ID and url with list name included (the default edit form do this by default);
• The sharepoint server must be set up to publish pdf in iframe. A guide to do this can be found pretty easily;

• A PDF reader must be installed on client machine.

  using System;
  using System.Web;
  using System.Web.UI;
  using System.ComponentModel;
  using System.Web.UI.WebControls.WebParts;
  using System.Web.Http;
  using Microsoft.SharePoint;
  
  namespace PDF_Viewer.VisualWebPart1
  {
      public partial class VisualWebPart1UserControl : UserControl
      {
          protected void Page_Load(object sender, EventArgs e)
          {
              if ( Page.Request.QueryString["ID"] != null)
              {
                  string docid = Page.Request.QueryString["ID"];            
                  int listItemID = Int32.Parse(docid);
                  using (SPSite site = SPContext.Current.Site)
                  {
                      using (SPWeb web = SPContext.Current.Web)
                      {
                          string listUrl =   HttpContext.Current.Request.Url.AbsoluteUri; 
                          if (web.GetListFromWebPartPageUrl(listUrl) != null ) 
                          { 
                              SPList lista = web.GetListFromWebPartPageUrl(listUrl);
                              SPListItem targetListItem = lista.GetItemById(listItemID);
                              if (targetListItem.File != null) 
                              { 
                                  string nome =    targetListItem.File.Name.ToString();
                                  if (targetListItem.File.Name.EndsWith("pdf"))
                                  {
                                      string csName = "efram";
                                      Type csType = this.GetType();
                                      ClientScriptManager cs = Page.ClientScript;
                                      string itemPath =     targetListItem.File.Url.ToString();
                                      string weburl = web.Url.ToString();
                                      string csScript = "<script language=\"javascript\" type=\"text/javascript\"> document.write('<iframe frameBorder=\"0\" width=\"530\" height=\"700\" src=\"" + weburl + "/" + itemPath + "\" /></iframe>');</script>";
                                      cs.RegisterClientScriptBlock(csType, csName, csScript);
                                  }
                              }
                          }
                          else 
                          {
                            //  Page.Response.Write("Invalid List Name");
                          }
                      }
                  }
              }
              else
              {
                //  Page.Response.Write("No ID");
              }
          }
      }
  }