Auto pop Nintex form fields with a check box

Post on 09-Jan-2017

214 views 2 download

Transcript of Auto pop Nintex form fields with a check box

Nintex Forms on O365Auto populate Nintex form fields with a check boxBy Larry Saytee – SharePoint Consultant

Create form, adding the following fields to the “Title”;

1. Outbound Departure – a single line text

2. Outbound Arrival – a single line text

3. Same as Inbound – a tick box (Yes/No)

4. Inbound Arrival – a single line text

5. Inbound Departure – a single line text

For each form field control settings;

For Outbound Departure, Click the “Advanced” setting, Select Yes from the dropdown for Store Client ID in JavaScript variable.

In the Client ID JavaScript variable name, I entered and assigned “varOutboundDeparture” as the variable name. Leave everything else the same.

For each form field control settings;

For Outbound Departure, Click the “Advanced” setting, Select Yes from the dropdown for Store Client ID in JavaScript variable.

In the Client ID JavaScript variable name, I entered and assigned “varOutboundArrival” as the variable name. Leave everything else the same.

For each form field control settings;

For Outbound Departure, Click the “Advanced” setting, Select Yes from the dropdown for Store Client ID in JavaScript variable.

In the Client ID JavaScript variable name, I entered and assigned “varSame” as the variable name. Leave everything else the same.

For each form field control settings;

For Inbound Departure, Click the “Advanced” setting, Select Yes from the dropdown for Store Client ID in JavaScript variable.

In the Client ID JavaScript variable name, I entered and assigned “varInboundArrival” as the variable name.

Make sure the “Not connected” dropdown option is selected for the “Connected to” setting. Leave everything else the same.

For each form field control settings;

For Inbound Departure, Click the “Advanced” setting, Select Yes from the dropdown for Store Client ID in JavaScript variable.

In the Client ID JavaScript variable name, I entered and assigned “varInboundArrival” as the variable name.

Make sure the “Not connected” dropdown option is selected for the “Connected to” setting. Leave everything else the same.

Now, in the form settings add the following JavaScript;

To add JavaScript to Nintex Forms, from the Form editor click the Settings button in the Ribbon and then expand the Custom JavaScript section at the bottom.

NWF$('#' + Same).click(function(){ var checkBox = NWF$('#' + varSame); if (checkBox.is(':checked') == true){ var OutboundDeparture = NWF$('#' + var OutboundDeparture).val(); var OutboundArrival = NWF$('#' + var OutboundArrival).val(); NWF$('#' + varinboundArrival).val(outboundDeparture); NWF$('#' + varinboundDeparture).val(outboundArrival); } else { var nullValue = ''; NWF$('#' + varInboundArrival).val(nullValue); NWF$('#' + varInboundDeparture).val(nullValue); }});

For each form field control settings;

Nintex Forms uses a copy of the jQuery library that you can access through NWF$. So just adding SPServices to your form’s page won’t work, but since jQuery is already there it’s fairly simple to get it all hooked up through NWF$.

Finally, it’s time for testing. Testing is as follows;

1. Enter data for Outbound Departure and Outbound Arrival fields

2. Check the Tick box, the result should be

3. Uncheck the Tick box, the result should be

Testing the form

Outbound Departure Airport and Outbound Arrival Airport with “Same as Inbound”: Unchecked

Testing the form

Inbound Departure Airport and Inbound Arrival Airport with “Same As Inbound”: Checked

Larry Saytee (BSc)

Email: larry.Saytee@email.comTel.: 07791842745

Used in this Presentation• SharePoint Server• SharePoint Online (and O365)• Nintex on O365• jQuery

Click here to find out more about Larry Saytee on LinkedIn