Skip to Content
avatar image
Former Member

SAPui5 - Problem displaying PDF in XML view

Hi everyone,

I built a custom ui5 application and I'm trying to display a PDF in an XML view but I'm getting the following error:

I searched several similar topics here, but none of them were the answer to my problem. I tried several solutions, but got nowhere.

I have the oDate service as media so that I can call the GET_STREAM method. All that works well, the method is called corretly, it reaches the backend and backend returns xstring generated from smartform, but then nothing happens in the view (appart from the pop-up error box) and I get the above mentioned error.

This is the code I have in the controller:

onPressPdf : function(oEvent){
 var sRead = "/pdfSet(Licencachave='" + this.getView().byId("licencachave_id").getTitle() + "')" + "/$value";
  var oPanel = new sap.m.Panel();
  var html = this.getView().byId("idFrame");
  this.getModel().read( sRead, null, null, true, function(oData, oResponse){
    var pdfURL = oResponse.requestUri;            
    html.setContent("<iframe src=" + pdfURL + " width='700' height='700'></iframe>");
    oPanel.addContent(html);
    oPanel.placeAt("content");
        	});
	},

This is the code I have in the view:

<IconTabFilter xmlns="sap.m" 
xmlns:core="sap.ui.core" 
xmlns:mvc="sap.ui.core.mvc" 
xmlns:f="sap.ui.layout.form" 
xmlns:semantic="sap.m.semantic" 
xmlns:footerbar="sap.ushell.ui.footerbar"
xmlns:html1="sap.ui.core.HTML"
xmlns:html="http://www.w3.org/1999/xhtml"
id="iconTabBarPdf" icon="sap-icon://pdf-reader" 
tooltip="{i18n>detailIconTabBarPdf}" text="PDF">

<Button text="PDF" width="100px" 
id="idButtonPdf" press="onPressPdf" icon="sap-icon://pdf-reader"/>
	<Panel>
	  <content>
	    <core:HTML id="idFrame"/>
	  </content>
	</Panel>
</IconTabFilter>

This is how the view looks like:

Any suggestions?

capturar.png (6.9 kB)
pdf.png (3.6 kB)
Add comment
10|10000 characters needed characters exceeded

  • Get RSS Feed

3 Answers

  • Oct 18, 2016 at 12:56 PM

    I am not sure but yo can try two thing:

    1) dont use html as a variable name (might be interpreted in another way), change something like below:

    var oHtml = this.getView().byId("idFrame");

    2) might be issue in below code:

    //instead of
    src=" + pdfURL + "
    //you can try
    src='" + pdfURL + "'

    Regards,

    Akhilesh

    Add comment
    10|10000 characters needed characters exceeded

  • avatar image
    Former Member
    Oct 18, 2016 at 04:52 PM

    Hi,

    I managed to find the solution to my problem,

    The problem was in the call

    this.getModel().read( sRead,null,null, true,function(oData, oResponse){
        var pdfURL = oResponse.requestUri;

    I decided to get the model before using it so:

    var sURI = "/sap/opu/odata/SAP/Zmodel/";
    var oModel = new sap.ui.model.odata.ODataModel(sURI, false);
    sap.ui.getCore().setModel(oModel); 
    oModel.read( sRead, null, null, true, function(oData, oResponse){ var pdfURL = oResponse.requestUri;});
    

    And it works now.

    Thanks,

    Add comment
    10|10000 characters needed characters exceeded

  • avatar image
    Former Member
    Oct 18, 2016 at 08:54 PM

    Hi Gonçalo,

    I would like to show you another way that you can play with it.

    1) SAP recommends to use the V2 of ODataModel. There are many benefits, please check the API;

    2) For PDF, you can by pass the ODataModel and just use as "link":

    Controller...

    var oHtml = this.getView().byId("idFrame"),
        sService = this._getService(),
        sURLPDF = sService + "pdfSet(Licencachave='" + <YOUR_KEY> + "')/$value";
    
    oHtml.setContent("<iframe src='" + sURLPDF + "' height='100%' width='100%'></iframe>"); 

    Super class or internal method: (Keep it simple, just create one single method for the service call)

    _getService: function() {
        return this.getOwnerComponent().getMetadata().getManifestEntry("sap.ui5").config.serviceConfig.serviceUrl;
    },
    ... 

    Component.js (you don't need to use the URI as hard code every time you call the backend)

    ...
    "serviceConfig": {
    "name": "Zmodel",
    "serviceUrl": "/sap/opu/odata/SAP/Zmodel/"
    }
    ...
    Add comment
    10|10000 characters needed characters exceeded