I've retrieved my pdf from my odata service call. However when I insert to html content using iframe tag, it display a blank page.
I tried below code. When i hardcode url with drive.google, my app able to show the pdf page but when i remove the hard coded value, my html content not able to render the pdf page. Any inputs on this?
// var pdfURL = "https://drive.google.com/viewerng/viewer?
//url=https://assets.cdn.sap.com/sapcom/docs/2015/07/c06ac591-5b7c-0010-82c7-
//eda71af511fa.pdf?pid=explorer&efh=false&a=v&chrome=false&embedded=true";
var pdfURL = "https://assets.cdn.sap.com/sapcom/docs/2015/07/c06ac591-5b7c-
0010-82c7-eda71af511fa.pdf";
var oHtmlChange = new sap.ui.core.HTML({
content: "<iframe src=" + pdfURL + " width='800' height='800'></iframe>"
});
poFormPanel.addContent(oHtmlChange);
Try to set the following content property value:
...
content: "<embed src='https://drive.google.com/viewerng/viewer?embedded=true&url=https://assets.cdn.sap.com/sapcom/docs/2015/07/c06ac591-5b7c-0010-82c7-eda71af511fa.pdf' width='800' height='800'>"
...
Here is a working example.
Related
I created a document file from word and has exported as pdf . i want to show the pdf content inside the Div element in razor page. How can I show the pdf content from razor page. Please can you provide an example code how to show in blazor server side
If you stored your pdf file directly in your documents for example in the folder wwwroot/pdf.
wwwroot/pdf/test.pdf
You can display this PDF with this line of html bellow :
< embed src="pdf/test.pdf" style="width=100%; height=2100px;" />
It will provide you a pdf displayer with printing options !
If you want to go further, upload your file and then display it, I will recommend you to go check this explanation :
https://www.learmoreseekmore.com/2020/10/blazor-webassembly-fileupload.html
The upload for PDF files works the same as Img file, you need to go check IBrowserFile documentation.
You will see that it has a Size obj and a OpenReadStream() function that will help you get the display Url for your file (image or pdf)
If the site abow closes, this is the upload code that is shown on it :
#code{
List<string> imgUrls = new List<string>();
private async Task OnFileSelection(InputFileChangeEventArgs e)
{
foreach (IBrowserFile imgFile in e.GetMultipleFiles(5))
{
var buffers = new byte[imgFile.Size];
await imgFile.OpenReadStream().ReadAsync(buffers);
string imageType = imgFile.ContentType;
string imgUrl = $"data:{imageType};base64,{Convert.ToBase64String(buffers)}";
imgUrls.Add(imgUrl);
}
}
}
This code was written by Naveen Bommidi, author of the blog where I found this usefull code
If you want, as I said, upload a PDF and then display it.
You can use the same html line :
< embed src="#imgUrl" style="width=100%; height=2100px;" />
And your uploaded files will be displaying.
Example
Save in DB and import data and create a pdf file using jspdf.
Data is stored up to html tag...
select ct_contents from contract where ct_id = 659;
RESULT : `<p style="text-align:justify"><span style="font-size:10.5pt"><span style="font-family:Century,serif"><span style="font-family:"MS Mincho"">氏 名</span></span></span></p>`
I have this js code :
let pdfName = this.newTemplate.tp_title.trim()
var doc = new jsPDF();
doc.addFileToVFS('NotoSansCJKjp-Regular.ttf', VFS);
doc.addFont('NotoSansCJKjp-Regular.ttf', 'NotoSansCJKjp', 'Bold');
doc.setFont('NotoSansCJKjp', 'Bold');
doc.setFontSize(12);
var paragraph = this.contract.ct_contents;
var lines = doc.splitTextToSize(paragraph, 150);
doc.text(15, 60, lines);
doc.save(pdfName + '.pdf');
add a font to work on it, but check the downloaded pdf, the html tag will also appear.
I want to remove this tag and make it appear only in text.
image is the result of downloading by pdf.
And it is page 3 in ms word and only page 1 of pdf is download.....
How can I get the font to come out without getting the html tag?
I am parsing a website and want to read out one specific HTML part of that website. I am looking for one (and one only) <frame> tag:
<frame scrolling="auto" ... src=”I need this text">
So I need basically only the text in src="". But how can I do this as simple as possible? So far I tried to analyze the string by:
NSString *html = [self.webview stringByEvaluatingJavaScriptFromString: #"document.body.innerHTML"];
But html stays empty and I wouldn't know how to continue. So how can I make this as simple as possible using my webview?
Something like this might work:
document.addEventListener("DOMContentLoaded", function() {
var allFrames = document.querySelectorAll("frame");
if (allFrames.length) {
var src = allFrames[0].src;
console.log(src);
var request = new XMLHttpRequest();
request.open("GET", "my-app://localhost/?src=" + encodeURIComponent(src));
request.send(null);
} else {
console.log("no frames on the page " + location.href);
}
});
Run this code using stringByEvaluatingJavaScriptFromString from the webViewDidFinishLoad callback, and handle the output data from the script using shouldStartLoadWithRequest callback.
You see the log and debug the script using Safari Web Inspector (for both simulator and device).
I'm loading dynamic pages into Html id using load() function. So i want to destroy/clear/fly all Elements(including javascript objects) which are loaded previously into the Html id After destroy the previous loaded elements then new content should be load in to Html id. I'm rendering Extjs form panels and popup in each pages.When i'm trying to load same page again popups are not displaying because previous elements not destroying. Whts the wrong with my approch.
var content_div = Ext.get(div_id);
content_div.load({
url:BASE_URL+url_href,
scripts:true,
text: 'Loading...',
params:{id:'123'}
});
content_div.show();
Any ideas?
Try the following:
var content_div = Ext.get(div_id);
content_div.update("");
content_div.load({
url:BASE_URL+url_href,
scripts:true,
text: 'Loading...',
params:{id:'123'}
});
content_div.show();
I have a Galleriffic slideshow on my page. Right now the "large" image links to the next image in the slideshow. How can I make it link to an external file instead?
First, you have to add a hidden div or span tag to your unordered list:
<li>
<a class="thumb" href="/imageurl/image.gif">imageititle</a>
<span id="project-path" style="display:none;">example_path</span>
</li>
Then, add this code to your galleriffic.js file. You are grabbing the path from the span element:
addImage: function(listItem, thumbExists, insert, position) {
var $li = ( typeof listItem === "string" ) ? $(listItem) : listItem;
var $aThumb = $li.find('a.thumb');
** var $path = $li.find('#project-path');
** var projectPath = $path.text();
var slideUrl = $aThumb.attr('href');
var title = $aThumb.attr('title');
var $caption = $li.find('.caption').remove();
var hash = $aThumb.attr('name');
Then, you add the value to the image variable:
var imageData = {
** projectPath:projectPath,
title:title,
slideUrl:slideUrl,
caption:$caption,
hash:hash,
gallery:this,
index:position
};
Now tell the gallery to change the link w/ new path on the full-size gallery images:
// Construct new hidden span for the image
var newSlide = this.$imageContainer
.append('<span class="image-wrapper current"><a class="advance-link" rel="history" href="/project/'+imageData.projectPath+'" title="'+imageData.title+'"> </a></span>')
.find('span.current').css('opacity', '0');
And comment out the gallery click action here, so that your user can just use the normal link wrapping the image:
newSlide.find('a')
.append(imageData.image)
//.click(function(e) {
//gallery.clickHandler(e, this);
//})
;
yep - at http://prestondentalgroup.com.au/downloads.html
The hyperlinks on the slide images allow viewer to open/save a PDF doc.
Works nicely (once I deciphered how to write example_path and to substitute /project/ with the URL of the PDF file (including subfolders).
So to link to readme.pdf from the site's images/downloads/ folder,
example_path becomes images/downloads/readme.pdf
and
/project/ becomes http:/prestondentalgroup.com.au/