Skip to content

Commit 8401a01

Browse files
rparthi-pdfrparthi-pdf
authored
Merge pull request #3780 from syncfusion-content/EJ2-379783-openingPdf
379783: UG Documentation on How to Open PDF From Base64 Data
2 parents 1edd575 + 7e57276 commit 8401a01

File tree

4 files changed

+107
-2
lines changed

4 files changed

+107
-2
lines changed

‎ej2-asp-core-mvc/pdfviewer/EJ2_ASP.MVC/open-pdf-file.md

Lines changed: 52 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,52 @@
1+
---
2+
layout: post
3+
title: Open PDF files in EJ2 ASP.NET MVC PDF Viewer | Syncfusion
4+
description: Learn here all about Opening PDF in ASP.NET MVC PDF Viewer component of Syncfusion Essential JS 2 and more.
5+
platform: ej2-asp-core-mvc
6+
control: How to Open PDF From Base64
7+
publishingplatform: ##Platform_Name##
8+
documentation: ug
9+
---
10+
11+
# Opening a PDF from Base64 data in PDF Viewer
12+
### Overview
13+
14+
This guide demonstrates how to load a PDF document from a Base64 string into the Syncfusion PDF Viewer using ASP.NET MVC. This feature is useful for loading PDF data received from a client, database, or other sources where the document is encoded in Base64.
15+
16+
### Opening PDF from Base64 data
17+
18+
**Step 1:** Set Up the PdfViewer in Your ASP.NET MVC Project
19+
20+
Follow the steps provided in the [link](https://ej2.syncfusion.com/aspnetmvc/documentation/pdfviewer/getting-started) to create a simple PDF Viewer sample.
21+
22+
**Step 2:** Use the following code snippet to load PDF document using base64 string.
23+
24+
25+
{% tabs %}
26+
{% highlight html tabtitle="Standalone" %}
27+
28+
@using Syncfusion.EJ2
29+
@{
30+
ViewBag.Title = "Home Page";
31+
}
32+
<div>
33+
<div style="height:500px;width:100%;">
34+
<button type="button" onclick="LoadFromBase64()">:Load From Base64</button>
35+
<!-- Render PDF Viewer using the Html helper method -->
36+
@Html.EJS().PdfViewer("pdfViewer").DocumentPath("https://cdn.syncfusion.com/content/pdf/pdf-succinctly.pdf").ResourceUrl("https://cdn.syncfusion.com/ej2/28.1.33/dist/ej2-pdfviewer-lib").Render()
37+
</div>
38+
</div>
39+
40+
<script type="text/javascript">
41+
//Load PDF document from base64 String
42+
function LoadFromBase64() {
43+
var viewer = document.getElementById('pdfViewer').ej2_instances[0];
44+
//Enter Base64 Data
45+
viewer.load('Enter Base64 Data',null);
46+
}
47+
</script>
48+
49+
{% endhighlight %}
50+
{% endtabs %}
51+
52+
[View sample in GitHub](https://github.com/SyncfusionExamples/mvc-pdf-viewer-examples/tree/master/How%20to)

‎ej2-asp-core-mvc/pdfviewer/EJ2_ASP.NETCORE/open-pdf-file.md

Lines changed: 53 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,53 @@
1+
---
2+
layout: post
3+
title: Open PDF files in EJ2 ASP.NET CORE PDF Viewer | Syncfusion
4+
description: Learn here all about Opening PDF in ASP.NET CORE PDF Viewer component of Syncfusion Essential JS 2 and more.
5+
platform: ej2-asp-core-mvc
6+
control: PDF Viewer
7+
publishingplatform: ##Platform_Name##
8+
documentation: ug
9+
---
10+
11+
# Opening a PDF from Base64 data in PDF Viewer
12+
### Overview
13+
14+
This guide demonstrates how to load a PDF document from a Base64 string into the Syncfusion PDF Viewer using ASP.NET CORE. This feature is useful for loading PDF data received from a client, database, or other sources where the document is encoded in Base64.
15+
16+
### Opening PDF from Base64 data
17+
18+
**Step 1:** Set Up the PdfViewer in Your ASP.NET CORE Project
19+
20+
Follow the steps provided in the [link](https://ej2.syncfusion.com/aspnetcore/documentation/pdfviewer/getting-started) to create a simple PDF Viewer sample.
21+
22+
**Step 2:** Use the following code snippet to load PDF document using base64 string.
23+
24+
25+
{% tabs %}
26+
{% highlight html tabtitle="Standalone" %}
27+
28+
@page "{handler?}"
29+
@model IndexModel
30+
@{
31+
ViewData["Title"] = "Home page";
32+
}
33+
34+
<div class="text-center">
35+
<button type="button" id="loadButton">Load PDF from Base64</button>
36+
<ejs-pdfviewer id="pdfviewer" style="height:600px" resourceUrl="https://cdn.syncfusion.com/ej2/28.1.33/dist/ej2-pdfviewer-lib" documentPath="https://cdn.syncfusion.com/content/pdf/pdf-succinctly.pdf">
37+
</ejs-pdfviewer>
38+
</div>
39+
40+
<script type="text/javascript">
41+
document.getElementById('loadButton').addEventListener('click', function () {
42+
var pdfViewer = document.getElementById('pdfviewer').ej2_instances[0];
43+
//Enter the base 64 Data
44+
var base64String = 'Enter Base64 Data';
45+
// Load the PDF document using the load() method with Base64 string
46+
pdfViewer.load(base64String, null); // Pass null for filename if not required
47+
});
48+
</script>
49+
50+
{% endhighlight %}
51+
{% endtabs %}
52+
53+
[View sample in GitHub](https://github.com/SyncfusionExamples/asp-core-pdf-viewer-examples/tree/master/How%20to)

‎ej2-asp-core-toc.html

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1886,7 +1886,7 @@
18861886
</li>
18871887
<li><a href="/ej2-asp-core/pdfviewer/feature-module">Feature Modules</a></li>
18881888
<li>
1889-
Open PDF files
1889+
<a href="/ej2-asp-core/pdfviewer/open-pdf-file">Open PDF files</a>
18901890
<ul>
18911891
<li><a href="/ej2-asp-core/pdfviewer/open-pdf-file/from-azure-blob-storage">From Azure Blob Storage</a></li>
18921892
<li><a href="/ej2-asp-core/pdfviewer/open-pdf-file/from-google-drive">From Google Drive</a></li>

‎ej2-asp-mvc-toc.html

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1840,7 +1840,7 @@
18401840
</li>
18411841
<li><a href="/ej2-asp-mvc/pdfviewer/feature-module">Feature Modules</a></li>
18421842
<li>
1843-
Open PDF files
1843+
<a href="/ej2-asp-mvc/pdfviewer/open-pdf-file">Open PDF files</a>
18441844
<ul>
18451845
<li><a href="/ej2-asp-mvc/pdfviewer/open-pdf-file/from-azure-blob-storage">From Azure Blob Storage</a></li>
18461846
<li><a href="/ej2-asp-mvc/pdfviewer/open-pdf-file/from-google-drive">From Google Drive</a></li>

0 commit comments

Comments
 (0)