I have little developing experience and I would really appreciate it if someone could point me in the right direction with my little project.
Basically, I have this first page where the user fills a form via radio buttons. These choices all represent pieces of texts in the database. When the form is submitted, an EJS page is rendered where these texts are merged. I've managed to make it work this far using Node, Express and MongoDB.
As the next step I'm trying to give the user the option to download the generated text as a nice looking PDF file. What would you recommend me to use?
You can use tools like node-html-pdf which takes a picture from your generated html page from EJS and print it using an headless browser.
Note : Since PhamtomJS is deprectated, node-html-pdf's too.
Related
I have two html tables(containing dynamic content stored in variables) along with headings and paragraphs. When the user clicks the download PDF button, he/she should be able to download one PDF of two pages containing the two tables.
I have read a lot of articles but I found no definite answer to this issue.Should I use jspdf or react-pdf for this scenario?
I am using react frontend and Nodejs backend.
https://github.com/MrRio/jsPDF
JSPDF is a perfect solution for converting tables into PDF in client-side. But if you want to do something from backend
Or you can refer to
https://www.npmjs.com/package/html-pdf
for rendering it in the backend, and make express download it.
Looks like you can call the window.print() method in componentDidMount() to print the complete div, though removing the footer through the script can be a challenge.
Using html2canvas with jspdf has a major drawback that the pdfs are blurred and their clarity varies with the page zoom, as it takes the screenshot of that portion. Hence, you must configure it correctly or compromise on quality.
My use case is: a user goes onto a webpage and modifies it by either filling in a form, populating the page with data from the database, or dragging around some draggables on the page. He can then download the page he modified as pdf. I was thinking of using PhantomJS to do the conversion from html to pdf.
I understand the basic functionality of PhantomJS and got the basic example working but in all the examples I've seen, either a local file or a url is passed in. Example:
page.open('./test.html', function () { ... }
How would I render the page that is getting modified by a user using PhantomJS? I have 2 ideas:
Have the url change as the user modifies the page, and simply pass in the url. For example, the url contains the position of a draggable div.
Send the modified html to back-end, save it, and run PhantomJS
Do these solutions make sense? I'm hoping there would be a simpler way.
I'm trying to create minimalistic content management system with ckeditor using node and express as a server. I would definitely want to implement the inline editing capabilities of ckeditor, but I'm having no success in sending the data to server and finally to nosql (mongodb) database.
I would like to have multiple inline editors within a page and to save to my database them simultaneously upon a POST event. I have my editor instances in invividual divs with an attribute contenteditable="true". Editor instances launch just fine, but when I'm trying to grab the data in my controller, all I have is an empty object. I can get the data from input fields, but then I lose the inline editing features. I've tried tinkering with bodyparser, but no success. All my divs containing the editable content lay under a HTML form element.
I would be more than happy is someone could at least point me to a general direction of how to accomplish this. Sorry if I was unable to make my self clear posting this question :)
tldr; How can I parse data from HTML elements, other than input-fields and text areas, in node/express with bodyparser?
Content of non-input fields won't be posted in a form, so you can't do that. A couple options come to mind:
Use JavaScript to update hidden inputs on the page as those divs change. Updated content will be posted.
Use JavaScript to make the POST, on save grab the contents, post them to the server, and then after that make the redirect from client side.
I have seen webpage with a PDF icon, where you could click on it to print the content of that webpage.
The page i am intending to add the print feature is designed in JSF, so is there anyway where i could add a print button, to get the webpage printed ?
No, you must do this yourself. Get some PDF library (for example iText), then get web page output (plain HTML). Then you will have to iterate thru HTML and create PDF version (for example build iText document). You will probably have to do this yourself, because some elements (javascript powered) will need to turn into static content. Nobody but you knows how the output should look like.
I am creating an ASP.NET web application. In one of my webpages (an ASCX control) I am placing a fusion chart inside a <div> tag. I want to provide an option for the client to download this fusion chart.
Is there any way that I can download
the fusion chart present in the Div
tag, as an image (Using javascript
because the div tag is a client side
control).
The request is that my client could save this fusion chart present in the <div> tag as an image when he visits the webpage.
The target browser is IE.
Please help me.
I can confirm that it is not possible to 'Export the chart as image' when using FusionCharts Free. However, as mentioned by Larsenal, you will be able to use FusionCharts v3.2.1 and it's updated JavaScript API to export pure JavaScript charts to JPEG, PNG, PDF, SVG formats.
Ref.- http://www.fusioncharts.com/docs/?ECPureJS.html
Furthermore, you may even export your Flash charts, if required, in a similar manner. DO check out the link below for a more detailed account of the same.
Ref.- http://www.fusioncharts.com/docs/?ECOverview.html
Hope this helps.
It is currently not possible to generate an image from a section of a webpage with JavaScript. Quoting myself from another question:
Firefox added something similar to
this to their canvas implementation.
You can find
CanvasRenderingContext2D.drawWindow()
documented in their wiki. It is
restricted to being used by plugins,
for security purposes, and isn't
supported by any other browsers.
There is
talk
of adding support to other browsers,
and perhaps removing some of the
security restrictions, but that is
probably a long way off. For now,
there isn't a good JavaScript solution
to your problem.
Sorry, there's no way to do it with Javascript.
I don't know about the Fusion controls, but some graphing libraries include a way to render to an image or PDF. Start looking there, not Javascript.
Update: FusionCharts claims to have the ability to export to JPG, PNG, PDF and CSV. Start with this page about exporting pure JS charts in their documentation.