[Note this might be similar to https://stackoverflow.com/questions/48138874/can-make-print-js-print-a-variable, but I don't know PHP]
I have an ASP.Net core action that creates a PDF on the fly. I currently have the PDF download to the client, like so:
<a asp-controller="Home" asp-action="Pdf">Download PDF</a>
and the controller action
public IActionResult Pdf()
{
using (MemoryStream ms = new MemoryStream())
{
...
return File(ms.ToArray(), "application/pdf", "file.pdf");
}
}
Instead, I would like it to go to the print preview dialog of the browser, for which I was planning to use printjs. But I have to specify a server-based file (such as "docs/file.pdf"). The printjs sample is:
<button type="button" onclick="printJS('docs/file.pdf')">Print PDF</button>
Is there a way to cause the printJS file to download the pdf file without needing to save it somewhere?
Doh. Too easy:
<a onclick="printJS('/home/Pdf')">Print PDF</a>
Instead of supplying an href to a file, have the onclick function call printJS with the action name which will execute and download the PDF.
Related
I have adopted various approaches to embed PDF blob in html in IE in order to display it.
1) creating a object URL and passing it to the embed or iframe tag. This works fine in Chrome but not in IE.
</head>
<body>
<input type="file" onchange="previewFile()">
<iframe id="test_iframe" style="width:100%;height:500px;"></iframe>
<script>
function previewFile() {
var file = document.querySelector('input[type=file]').files[0];
var downloadUrl = URL.createObjectURL(file);
console.log(downloadUrl);
var element = document.getElementById('test_iframe');
element.setAttribute('src',downloadUrl);
}
</script>
</body>
2) I have also tried wrapping the URL Blob inside a encodeURIcomponent()
Any pointers on how I can approach to solve this?
IE doesn't support iframe with data url as src attribute. You could check it in caniuse. It shows that the support is limited to images and linked resources like CSS or JS in IE. Please also check this documentation:
Data URIs are supported only for the following elements and/or
attributes.
object (images only)
img
input type=image
link
CSS declarations that accept a URL, such as background, backgroundImage, and so on.
Besides, IE doesn't have PDF viewer embeded, so you can't display PDFs directly in IE 11. You can only use msSaveOrOpenBlob to handle blobs in IE, then choose to open or save the PDF file:
if(window.navigator.msSaveOrOpenBlob) {
//IE11
window.navigator.msSaveOrOpenBlob(blobData, fileName);
}
else{
//Other browsers
window.URL.createObjectURL(blobData);
...
}
We have a sitefinity Customer Portal. Now we need to add MVC pages to it. I understand how to add a page, and how to drag e.g. a list to the page's content. But I don't understand how I can create a controller and other c# code to populate the list and do other custom things. We cannot open the project in Visual Studio, and we have no access to the existing code.
First of all, you must sure your project run success on your local. You can check it by login to back end page.
Then you can create the MVC component like this: (you should create all of this in root/MVC folder)
Create controller first:
[ControllerToolboxItem(Name = "ImportCSV", Title = "ImportCSV", SectionName = "ImportCSV")]
public class ImportCSVController : Controller
{
// GET: ImportCSV
public ActionResult Index()
{
return View();
}
}
SectionName is title of content group for you custom
Title is the title of component
Name is used for code behind
Then you can create the views to show in page: (you have to create the views in MVC/Views/ImportCSV, sitefinity will recognize folder name to map in BE)
<h2>Upload File</h2>
<div class="form-group">
<input type="file" id="dataFile" name="upload" />
</div>
<div class="form-group">
<a onclick="upload()" class="button" id="btnupload">Upload</a>
</div>
You need to get access to the code then, controllers\models need to be compiled. You can get away with a lot directly in a cshtml file though which DOESN'T need to be compiled.
Could you download a new blank SF project that's on your version and start from scratch pointed at your DB? Copy over /App_Data and /ResourcePackages to the new project and just run it. Should work fine, but any page that has a custom widget on it that uses custom code would tank. Sorry I'm just not sure why you don't have the code. Could use JustDecompile to retrieve the actual code for custom widgets too I suppose.
I am in process of creating a new website. I have done my basic HTML/CSS/JQuery code to generate the webpage. The website is going to display images. Now my questions are around where the images are supposed to be stored and how to retrieve them. I did research but I am all over the place with the architecture.
My understanding is that HTML page will make a query to a web server (like Apache) and get the data/images back and display it? The function of the web server is to provide the data based on the query, is that right? Where is the data like jpeg images, their metadata, link between gallery and images would be stored? Is there another layer of DB somewhere? Would the architecture be HTML<-->Apache<-->DB ?
Or do I just put my images in a database and host the data their. Basically taking out Apache from the architecture? The queries are going to depend only on the current stage in the navigation tree (nothing user specific).
There is no need for DB to use images. It works more this way:
HTML <-> Apache <-> Image
because apache has the ability to deliver files.
Now, there are several differents way of working.
For example, the image can be load dynamically in a php files with images header. In this case, the scheme will be :
HTML <-> Apache <-> PHP <-> Image
To do it, you simply put your images in a folder where apache's user can access.
For example you can have the following structure in /var/www/sitename:
index.html
img / my_image.jpg
And in index.html
<img src="img/my_image.jpg" ... />
Edit to answer you question :
create a php script that will generate the json array, for example :
page.php
<?php
switch($_GET['link']){
case 'link1':
images_links = array(
'path/to/img1',
'path/to/img2',
...
);
break;
case 'link2':
images_links = array(
'path/to/img3',
'path/to/img4',
...
);
break;
}
echo json_encode(images_links);
?>
Let's guess your html is
<a>link1</a>
<a>link2</a>
<img class="imgToChange" src="..."/>
<img class="imgToChange" src="..."/>
...
Then you will add this javascript function to your html
function updateImages(clicked_link){
// get the text of the link
link_text = clicked_link.innerHTML;
// send a request to page.php to get images's urls
$.get( "path/to/page.php?link="+link_text, function( data ) {
// data will be your json array
images_links = data;
// get a table of all images elements that can be changed
var images = document.getElementsByClassName("imgToChange");
// for each image in the json array
for(var k=0; k<images_links.length; k++){
images[k].src = images_links[k];
}
});
}
And you just have to call this function when a link is clicked
<a onclick="updateImages(this)">link1</a>
<a onclick="updateImages(this)">link2</a>
<img class="imgToChange" src="..."/>
<img class="imgToChange" src="..."/>
...
I'm working on an MVC4 C# project in VS2010.
I would like to allow the user to upload the contents of a .csv file to a database but there is a requirement to first echo the contents of the file to screen (as a final visual check) before submitting. What would be the best approach of submitting to the database as I am struggling to find a way of persisting the complex object in the view?
Here is the view where I am using a form to allow the user to upload the csv file:
#model IEnumerable<MyNamespace.Models.MyModel>
#{
ViewBag.Title = "Upload";
WebGrid grid = new WebGrid(Model, rowsPerPage: 5);
}
<h2>Upload</h2>
<form action="" method="post" enctype="multipart/form-data">
<label for="file">Filename:</label>
<input type="file" name="file" id="file" />
<input type="submit" />
</form>
<h2>Grid</h2>
#grid.GetHtml(
//Displaying Grid here)
<p>
#Html.ActionLink("Submit", "Insert")
</p>
Here is the action in the controller that processes the csv file:
[HttpPost]
public ActionResult Upload(HttpPostedFileBase file)
{
var fileName = Path.GetFileName(file.FileName);
var path = Path.Combine(Server.MapPath("~/App_Data"), fileName);
file.SaveAs(path);
//Stream reader will read test.csv file in current folder
StreamReader sr = new StreamReader(path);
//Csv reader reads the stream
CsvReader csvread = new CsvReader(sr);
List<MyModel> listMyModele = new List<MyModel>(); // creating list of model.
csvread.Configuration.RegisterClassMap<MyModelMap>(); // use mapping specified.
listMyModel = csvread.GetRecords<MyModel>().ToList();
sr.Close();
//return View();
return View(listMyModel);
}
Up until this point everything is simple, I can upload the csv to the controller, read using CsvHelper, produce a list of MyModel objects and display in the view within a grid. To reiterate my initial question, is it now possible to submit the complex object (the list of MyModel) from the view as I can't figure out a way of making it available to an action within the controller.
Thank you.
Yes it's possible, It's "easier" if you have a Model with the IEnumerable in it so you can use the naming convention like this:
Property[index].ItemProperty
for every Html input/select field.
If you want to keep the IEnumerable as Model I think the naming convention is something like this:
ItemProperty[index]
So translated in code:
#Html.TextBoxFor(t => t.Property, new { name = "Property[" + i + "]" })
where i comes from a for loop to render all items or something like that.
I have already done it but I can't find the code at the moment. KendoUI uses this scheme for its multirows edit in the grid component.
You can check their POST AJAX requests for the right naming convention.
EDIT 1:
Otherwise you can think about store the model somewhere temporarily and retrieve it every time and updating with user inputs. It's a little more expensive but probably easier to write. Something like an updated csv file or a temporary db table.
I do not know how to disable PDF download and print in ZUML(ZK User Interface Markup Language). Do I need to embed a customized PDF viewer as I can only open PDF file by using Iframe tag in ZK and it uses browser pdf viewer.Therefore, it makes the task of disabling print and download pdf even harder.
There are two other solution:
Convert the file to HTML, image, or any other format that can be directly viewed in the browser. This conversion can be on-the-fly using a server-side (written in Java in this case), or you can just pre-convert all files to a readable one.
The other approach, which is the best, is to use a Flash-based PDF viewer (such as http://flexpaper.devaldi.com/). This is easy, flexible and doesn't require writing server-side code. This approach is used by many Document-sharing sites (e.g. http://www.scribd.com/, http://www.slideshare.net/, http://www.docstoc.com/)
(For reference only, If you don't want disable download pdf file, there are few solutions:
http://zkfiddle.org/sample/1dnhepc/11-PDF-viewer
http://zkfiddle.org/sample/3ojd4og/1-PDF-Viewer-in-ZK-using-Iframe#source-2 )
After this question I discovered the existence of PDFObject, a simple javascript plugin to embed PDF documents inside a page. I've made a fiddle so you can see it in action.
index.zul
<?script type="text/javascript" src="http://pdfobject.com/scripts/pdfobject.js"?>
<zk>
<script type='text/javascript'>
function embedPDF(_url){
var myPDF = new PDFObject({
url: _url
}).embed('pdfContainer');
}
</script>
<vlayout apply="org.zkoss.bind.BindComposer" viewModel="#id('vm') #init('pkg$.TestVM')" xmlns:w="http://www.zkoss.org/2005/zk/client">
<listbox model="#load(vm.pdfUrls)">
<template name="model" var="url">
<listitem>
<listcell label="#load(url)" />
<listcell>
<button label="load" onClick="#command('loadPdf', url=url)" />
</listcell>
</listitem>
</template>
</listbox>
<vlayout xmlns:n="native">
<n:object id="pdfContainer"></n:object>
</vlayout>
</vlayout>
</zk>
TestVM.java
import org.zkoss.bind.annotation.AfterCompose;
import org.zkoss.bind.annotation.Command;
import org.zkoss.bind.annotation.BindingParam;
import java.util.List;
import java.util.ArrayList;
import org.zkoss.zk.ui.util.Clients;
public class TestVM {
List<String> pdfUrls;
#AfterCompose
public void afterCompose() {
pdfUrls = new ArrayList<String>();
pdfUrls.add("http://www.pdf995.com/samples/pdf.pdf");
pdfUrls.add("https://partners.adobe.com/public/developer/en/xml/AdobeXMLFormsSamples.pdf");
pdfUrls.add("https://www.iscp.ie/sites/default/files/pdf-sample.pdf");
}
#Command
public void loadPdf(#BindingParam("url")String url) {
Clients.evalJavaScript("embedPDF('"+ url +"')");
}
public List<String> getPdfUrls() {
return pdfUrls;
}
}
Cheers, Alex