- Printout will be rendered in the browser
- Data is not transferred to the back end system to generate the document and push back to the client.
- Include SAPUI5 controls directly into the output, like charts, tables etc .
Step 1: Create a SAPUI5 application project in Eclipse , create a view and develop your UI5 application ( These steps have been discussed multiple times , so i am not discussing it here again ).
Now my application looks like the below. I included some header data , a table with stock information, and followed by a graphical representation of profit percentage .
When the controls are rendered , corresponding HTML code will be generated . So , if we want to include any SAPUI5 standard controls, we should get the rendered html content.
Below is the print format which we are now going to design .
Now we will think of some HTML stuffs . All the header information can be rendered using plain HTML tags ( using <div> , <p> etc ) and the table can be created in our choice using the <table> html tag . Graph html code can be taken from the rendered HTML DOM and insert into our print document. In the controller , i am defining a function which accept the JSON data for the header and the table ( for the header and the table ) .
In the above code snippet, i am creating the HTML code corresponding to the output expected . HTML DOM for the chart is read using the outerHTML variable from the document . Using the generated HTML string, a popup is opened and the same is printed .
And here comes your document
Lazy to write the HTML tags for the print out ?
This is for lazy people 🙂 Are you not confident enough to write the HTML for your print out ? SCN is there to help you .
Step 1 : Create a blog or document in SCN.
Step 2 : Go to MS Word , and draft your output ( for eg , i am creating a table )
Step 3: Copy the table, and paste it in the content editor , and go to the html version (right side, top )
Here you will get the HTML code . You may need to clean the code based on your requirement . There are many free internet services available to create HTML from MS Word contents .
Happy coding 🙂