Have Print, Will Edit!

Currently writing from Calgary where I got to spend some time with some amazing people, places and unreal eats! While meeting with customers, I was asked an excellent question about hiding some portions of a Nintex Form when using Print to PDF. 

So, can it be done? You know it!

The Build

We are going to use a very simple Leave Request form for this use case, and below you will see two areas we want to hide:

  • The red asterisk mark that shows a required field
  • The 'Close' button on the bottom of the form

Next, we are going to take advantage of media query listeners in CSS and use the media type of 'print' to hide those elements if the class of those elements match our CSS selectors.

The Code

Open up your Nintex Form in the Form Designer and click on Form Settings, and then expand Custom CSS. From there, paste the following code:

@media print {
    .ms-formvalidation {
        visibility: hidden;
    }

    input[type=submit] {
        visibility: hidden;
    }
}

After you have entered in the above CSS, save the form settings and publish your form. 

Let's take a look at our finished form!

The Result

If you open the display form, you'll notice it looks exactly the same, and that is exactly what we want. However, if you click on 'Print to PDF' in your ribbon and open the PDF document that is generated, you'll see something different.

Pretty easy to get up and running and looks awesome! Feel free to leave any comments or questions and as always, keep being awesome!