Hi guys i need to save my HTML page in a PDF file how i can do that ?
Function or external app?
this is one example of my page:
|
v
Can anyone link me a tutorial? it's my first experience with these things
i need to store the pdf in a directory in the server .. whit window.print() user must click Print in the layout... i want a function that print in automatic without any user action
If you want to add a button to save a page as PDF, you might just assign window.print to the button. All of the modern browsers will allow the user to save document as a PDF from the print dialogue.
EDIT: for storing PDF on a server you may use a library like html-pdf
Related
Background:
I need to allow users to create web pages for various products, with each page having a standard overall appearance. So basically, I will have a template, and based on the input data I need the HTML page to be generated for each product. The input data will be submitted via a web form, following which the data should be merged with the template to produce the output.
I initially considered using a pure templating approach such as Nunjucks, but moved to ReactJS as I have prior experience with the latter.
Problem:
Once I display the output page (by adding the user input to the template file with placeholders), I am getting the desired output page displayed in the browser. But how can I now obtain the HTML code for this specific page?
When I tried to view the source code of the page, I see the contents of 'public/index.html' stating:
This HTML file is a template.
If you open it directly in the browser, you will see an empty page.
Expectedly, the same happens when I try to save (Save As...) the html page via the browser. I understand why the above happens.
But I cannot find a solution to my requirement. Can anyone tell me how I can download/save the static source code for the output page displayed on the browser.
I have read possible solutions such as installing 'React/Redux Development Extension' etc... but these would not work as a solution for external users (who cannot be expected to install these extensions to use my tool). I need a way to do this on production environment.
p.s. Having read the "background" info of my task, do let me know if you can think of any better ways of approaching this.
Edit note:
My app is currently actually just a single page, that accepts user data via a form and displays the output (in a full screen dialog). I don't wish to have these output pages 'published' on the website, and these are simply to be saved/downloaded for internal use. So simply being able to get the "source code" for the dislayed view/page on the browser and saving this to a file would solve my problem. But I am not sure if there is a way to do this?
Its recommended that you use a well-known site generator such as Gatsby or Next for your static sites since "npx create-react-app my-app" is for single page apps.
(ref: https://reactjs.org/docs/create-a-new-react-app.html#recommended-toolchains)
If I'm understanding correctly, you need to generate a new page link for each user. Each of your users will have their own link (http/https) to share with their users.
For example, a scheduling tool will need each user to create their own "booking page", which is a generated link (could be on your domain --> www.yourdomain.com/bookinguser1).
You'll need user profiles to store each user's custom page, a database, and such. If you're not comfortable, I'll use something like an e-commerce tool that will do it for you.
You can turn on the debugger (f12) and go to "Elements"
Then right-click on the HTML tag and press edit as HTML
And then copy everything (ctrl + a)
I have been asked to add 'TOC' and 'Back' buttons to HTML files which output as PDF using Antenna-House formatter.
The 'TOC' button navigates to the table of contents-this is simple enough to do.
The 'Back' button should navigate to the view prior to clicking the 'TOC' button and it is this I am struggling with.
I can get the back button to work using JavaScript with the HTML file prior to conversion. But JavaScript does not work in the output PDF.
Anything else I use I get an error message 'file not found' or 'unexpected end of line feed'.
The PDF viewer my company has does have back buttons but they are not as easily accessible as a button on the PDF would be.
Is it possible to do this?
You can specify some JavaScript to run when the document opens (see "openaction" in https://www.antennahouse.com/product/ahf66/ahf-ext.html#axf.document-info) and you can specify JavaScript for a form field event (see https://www.antennahouse.com/product/ahf66/ahf-ext.html#form-action).
What the JavaScript can do will depend on the JavaScript capability of the PDF viewer, not on AH Formatter. You may be able to make a one-button form that runs JavaScript that instructs the PDF viewer to return to the previous view, but I've never tried it.
I have a pdf document, whose path i have hardcoded into my webpage.
I also have a download link, clicking which the user can download the file.
<a href="Path\to\file" download>Click</a> (Works in HTML5)
However instead of having to carry both the webpage code and file separately, is it possible to incorporate the file data into the webpage itself and form a downloadable file whenever the user clicks on the link?
You can try to base64 encode that file and add it as link url:
DOWNLOAD
But adding file source to HTML is worst thing you can do. Why you need that? Your HTML will be loaded very slowly. CTRL + U and console debugging will be extra slow.
When I save a page from my website, I will get an html file and a folder that contains all photos, css and js files.
Is there a way to save only the html file?
I've just found that if you are using Google Chrome you can choose which one you want to save from the dropdown menu 'Save as type'. If you talk about preventing the user to save your HTML - it's not possible, if the browser can see the page, the user can view the source code and save the page.
If you use Microsoft Edge browser, do the following: ctrl+s then select html only on the drop-down menu.
you will get one html file without any extra folders.
I have a form with some boxes to use handwriting and signature in an ipad, it is
http://asbec.mx/form
I want a button to save as pdf and another one to print via airprint.
It is for a webapp.
I have already tried a button to save as pdf as you can see, the problem is that it creates a blank form.
Thanks for your support
This seems to be something that should be handled on the server end. You might try something like Zend PDF framework (extended PHP library).
http://framework.zend.com/manual/1.12/en/zend.pdf.html