Adding Checkbox or Star Rating To Word Document Template

If you have read my post on Capturing and printing on document template using Pen Control and Microsoft Flow, you may have noticed that while the input form had a Yes/No flip control (which is equivalent to a checkbox without the use of flip control) and the generated document did not have that checkbox on the document itself. The reason was simple. My input form had the T&Cs Yes/No as mandatory and therefor it had to be set to Yes before you could save the record and that was directly reflected in the clause without needing a checkbox as checked. However, if I had to just display a checkbox with the T&Cs clause, I could have added just a static checkbox control as checked (ticked)in the template which may have been fine because the UI did not allow you to save it without marking it as Yes.

Recently, one of the community members stated a requirement where he needed to display the checkbox checked/unchecked conditionally and this is what I will be discussing in this post. Apparently, it is a simple requirement but when it comes to the capability of Document Templates, there is no straightforward way to achieve it. Therefore, any solution to meet this requirement without relying on any 3rd part add-on is going to be a workaround.

Before discussing the solution, let me be clear here. I am not going to build any conditions in the word template itself i.e. I will be building some conditions in PowerApp and the display in word template would be a simple mapping exercise. This also means that when I am going to display, say, a checkbox or a star rating, it will only be a visual representation and not an interactive/functional control in the word document and this may be acceptable solution in most of the scenarios because your interaction is most likely going to happen with the app UI rather than the document. The generation of the document is only going to create a document with the necessary data from CDS, displayed in a well formatted manner.

Scenario

For the sake of this post, I am going to reuse the model-driven app from my previous post and add a few input elements/controls to demonstrate the solution.

As you can see in the following screenshot, I have added two additional fields to my Undertaking Form:

  • Yes/No switch – Consent for any product related promotional communication
  • Start Rating – This is another custom control allowing you to rate from 1-5
  • Note that I already have the original Yes/No flip switch to indicate agreement to the T&C which has to be set to Yes. This makes a total of 3 controls that I will be adding to the generated document. I will map the Yes/No flip control to a checkbox (checked/unchecked) as this looks better in a printed document.

Concept

The concept is very simple. I will be displaying the controls as images in the document and I will make sure that I have a way to use correct image based on the input to the 3 controls I have listed above.

Solution

Overview

In terms of designing the solution, I am going to create a master table (custom entity) called “Control Representation” which will hold images of all possible states of the controls I intend to print. The reason to have all these images in one place in the form of a master table is that I can reuse these same images in any other entity that needs to have a document template with any of those controls printed. Before discussing more details on this master table, let’s assume it exists and holds all those images. Now, for any control that needs to be printed on the document, you need to do 2 things in your app to your target entity for document template:

  1. Add a lookup field which references the “Control Representation” entity
  2. Implement a Business Rule which sets/updates this lookup field whenever its corresponding input data field changes so that it has a correct representation of the data in the generated document

Resources

In this scenario, I have used two distinct controls.

1. Flip Control

Flip Control can have two possible states i.e. Yes/No and therefore I will need two images to represent these states. I will be representing these states in the form of checked/unchecked checkbox.

2. Star Rating Control

Start Rating can have 6 possible values or states i.e. 1-5 Stars as well as No Start (when no input has been given or blank).

Now that I know the possible states of these controls that can be present in my document, I need images to represent them. Note that I will be storing these images as Base64 encoded string later and therefore I have converted them to Base64. This is so I can map them to a Picture Control in the word template. Here is the summary of what I have now.

Summary of Resources

Control TypeControl StateImageBase64 String
CheckboxCheckedCheckbox-CheckedDownload
Checkbox UncheckedCheckbox-Unchecked
Star Rating5 Star5-StarDownload
Star Rating 4 Star4-StarDownload
Star Rating 3 Star3-StarDownload
Star Rating 2 Star2-StarDownload
Star Rating 1 Star1-StarDownload
Star Rating 0 Star (blank)0-StarDownload

Control Representation Entity

In the “Control Representation” entity, I have got the following fields:

  • Name: This is the primary field for the name of the record
  • Base64 String: This is a multiple lines of text field with max characters as 15,000. This field will hold Base64 string of the control’s image for a given state. Note that, the image I have used is a .gif image which is a reasonable quality to keep the Base64 string within 15,000 characters. If you are using high quality image then you may need to either adjust your field length or reduce the image quality otherwise you won’t be able to store the complete string within 15,000 characters.
  • Control Type: This is just an additional field which will allow me to keep my control representations organised by putting them under different groups. You can ignore this if you wish to keep it simple for testing it out.
Control Representation Records
List view listing possible states of the Checkbox and Star Rating control
Entity Form

Undertaking Entity

This is the entity on which I will have my document template run. As mentioned before, I have added 3 lookup fields (lookup to Control Representation) corresponding to the two flip controls and a star rating control. These fields are hidden on the form and I have a Business Rule that keeps these lookup up to date whenever their corresponding input fields change.

Updated Lookupsv2

Creating Document Template

From here onward, the process of creating the document template is not new. You just need to make sure of the following

Result

Here is how the final result looks like both in the Unified Interface for a mobile device and the generated word document.

Mobile View
Mobile View
Generated Document
Generated Document

Limitations

  • As mentioned earlier, this technique only produces a visual representation of the control i.e. the object on the document is not a functional control (the assumption is that the interaction happens in the app itself before document generation)
  • This solution is feasible when the control has a discrete set of relatively small number of control states. If there are too many possible states then this may be too much work e.g. a radial knob displaying values ranging from 0-100%

Conclusion

You can use this technique to display any image and not necessarily control specific image on a word document where you have a custom logic for the resulting image. This is the same approach that you would normally use if you have to display some conditional text on a word document where you would maintain a calculated field in your app and simply map it to the word document.

Leave a Reply

Your email address will not be published. Required fields are marked *