If you try to print your form by pressing CTRL+P in the browser it might not look like you would expect. Especially when it is opened in a modern panel you can not just print it.
Using skybow Modern Forms you can do the following steps to get your form printed nicely.
- Add a command bar action
- Give it a Display name "Print" and a nice print icon
- Configure an action type "Open Web Page" and open the Display Form of the current list (in this scenario the Expenses list) by passing the ID and an action=print as additional query string parameter
Url: [[@Web.Url]]/Lists/Expenses/DispForm.aspx
Additional Query String: ID=[[ID]]&action=print
Open in: New window - Add an After-Form Load action of type "Execute Script" on the same display form.
- It should just be executed there is an url parameter "action=print", therefore we add the condition on the action.
The script itself is plain javascript (that could be extended with skybow placeholders, but we don't need them here)
With the first 2 lines we are going to add some CSS styles which are using for print only to hide the command action bar on the printout. The following 2 lines will print the content of the form and the last line will close the additional tab that has been opened by the command bar action.
Title: Print form if action = print
Condition: =[[@Page.GetQueryString('action')]]=="print"
Type: Execute Script
Script: 👇var style = "@media print { .ms-CommandBar { display:none;} }";
jQuery('head').append("<style type='text/css'>"+style+"</style>");
document.body.innerHTML = jQuery("div[class*='skyFormsContainerWrapper']").first().html();
window.print();
window.close();
The result should look like this:
Print view:
Comments
1 comment
Printing the form looses the second column while there's clearly enough space available. Is there a way to print the form a it is on screen?
Article is closed for comments.