For this version, I'm not using button loading
Documentation
To have a better understanding on how to use the component and how the component works, after following the steps below you will have a screen that, using the html2pdf Js component, will let you download as PDF the content of a predefined container. You will also learn by the end of the instructions how to configure the settings to change the output of this PDF File. To see an implementation of this component as described in the next Instructions section, check the demo.
1. Make the component available on your application.
Install the component on your environment and manage the dependencies in your application. You should find 2 web blocks and 6 structures. Make sure you have them all available to use.
Reactive Html2Pdf Js available content.
2. Place the component on your screen.
With the component available on your application, you need to drag and drop the two web blocks just made available. The two web blocks must be on your screen. Define the input parameters requested by the Html2Pdf_Js_ExecBlock:
ElementId - The Id of the container with the content to be printed as a PDF.
Options - The set of options to configure your download PDF File. Create a local variable on your screen and change its data type to a structure of type options (this structure comes with the component and should be available on your application after step1 of these instructions).
Options Local Variable
Inputs requested by the Html2Pdf_Js_ExecBlock web block
3. Define your PDF downloaded file settings
You can define the output settings of your PDF File by changing the values of the Options local variable. There is a set of definitions that comes as default. You can define all of these attributes when your screen initializes (OnInitialize action) so when the user clicks the button, the file will be downloaded with your settings applied. You can also have some of these attributes to be filled by the user as shown on the demo with the help of standard outsystems inputs and dropdowns. To find more about these options and what values are accepted, click here .
To have a better understanding on how to use the component and how the component works, after following the steps below you will have a screen that, using the html2pdf Js component, will let you download as PDF the content of a predefined container. You will also learn by the end of the instructions how to configure the settings to change the output of this PDF File. To see an implementation of this component as described in the next Instructions section, click here to check the demo.
You can define the output settings of your PDF File by changing the values of the Options local variable. There is a set of definitions that comes as default. You can define all of these attributes when your screen initializes (OnInitialize action) so when the user clicks the button, the file will be downloaded with your settings applied. You can also have some of these attributes to be filled by the user as shown on the demo here with the help of standard outsystems inputs and dropdowns. To find more about these options and what values are accepted, click here .
Install the component on your environment and manage the dependencies in your application. You should find 2 web-blocks and 5 structures. Make sure you have them all available to use.
ElementId - The Id of the container with the content to be printed as PDF.
Filename - The name of the file that would be downloaded to your device.
ButtonText - Text to appear on the button to download the PDF on your screen.
SetButtonAsDefault - You can define a default style to be applied to all the buttons using this component. To do this, you need to set this input as True and update the style class on the component's Html2Pdf_Js_ExecBlock web block to your liking.