Wednesday, 24 May 2017

Nintex Forms 101

A - OBJECTIVE: 

This article is to review basic points of Nintex Forms (on-premises version 2013).

Case Study: when a user registers a form on behalf of other user, the form should populate the user profile accordingly.

B - TIPS:

To list all potential or encountered technical errors or operational issues.

1. Panels: are used to group related control for various purposes (e.g. to show/hide a set of controls at a time). You can add controls to a panel by:

(a) cut the control, select the panel, & paste the control to the selected panel, or,
(b) drag & drop controls to panels to enable this kind of grouping.

 

2.  Javascript variable (associated with a control): is used to get the value of the form (even in real time). To use the variable, you need to (a) define the variable in the Control Settings, and (b) get the value (e.g. at Nintex Forms settings) in the control via this variable





3.  Rules: rules are used to format or validate controls in a form. in the below example, a panel is hidden by default.

 

4. Duplicated Values: can be checked to avoid duplicate registration. In this case the employee ID is used as the primary key to check.

You should use a calculated value to save the value

 

5.  Rules with conditions from calculated values



C - SOLUTION:

When the form is loaded, the current logged in user is loaded together with his/her profile details (from SharePoint)

 
If the checkbox "Click here if you register on behalf of your colleague" is ticked, the user can choose any other user & the profile details of the on-behalf-of user must be populated properly






D - SOURCE CODE :

The guide is to illustrate the development steps required for the case study:

1. Set auto-populated fields to read only & create necessary function at Nintext Forms Settings:

NWF$(document).ready(function(){
 NWF$('#'+tbEmployeeID2).prop("readonly", true);
 NWF$('#'+tbEmpEmail2).prop("readonly", true);
 NWF$('#'+tbEmpContact2).prop("readonly", true);
 NWF$('#'+tbEmpDiv2).prop("readonly", true);
 NWF$('#'+tbEmpDept2).prop("readonly", true);
 NWF$('#'+tbEmpLoc2).prop("readonly", true);
 NWF$('#'+tbEmpCom2).prop("readonly", true);
});

function setValue(control, value) {
  if (typeof control != 'undefined'){
   NWF$('#' +control).val(value);
  }
 }






2. Employee Name: is the important manual field (People Picker) with default value is the current logged in user, & has its variable



3. Calculated Values: are used to retrieve the values of the People Picker & assign to the relevant fields which are associated with SharePoint columns



4. Get the current user profile:  these values are used when the checkbox is unticked, and the profile of the current logged-in user is auto-populated again.












 

5. Checkbox "On-Behalf-of" will clear the fields if it is ticked, and the code should be added to Nintex Forms Settings.

NWF$("#" + varOnBehalfOf).click(function(){
var checkBox = NWF$("#" + varOnBehalfOf);
var peoplePickerControl = new NF.PeoplePickerApi("#" + varAttendingStaff);
if(NWF$(this).prop("checked")){
peoplePickerControl.clear();
}
else
{
var vUserAccount = "domain\\" + NWF$("#" + varCurrentUserAccount).val();
var vCurrentUserFullName = NWF$("#" + varCurrentUserFullName).val();
var vCurrentUserEmail = NWF$("#" + varCurrentUserEmail).val();
peoplePickerControl.clear();
peoplePickerControl.add({value:vUserAccount, label:vCurrentUserFullName, type:'user', email:vCurrentUserEmail });
}
});




 Details about the People Picker API in Nintex Forms can be found at https://community.nintex.com/docs/DOC-1222