Office 365 in SharePoint Online: How to use set field value in Nintex Forms for Office 365?
Introduction:
Here we will discuss how we can use set field value in Nintex Forms for Office 365 in SharePoint Online. In this particular example let us take a SharePoint online list which has Title, FirstName and LastName column. Once user puts some value on the FirstName then it should set LastName textbox as FirstName textbox value.
This can be achieved by using InfoPath forms using rules but we can not do this by using any rule in Nintex. We have to use JavaScript to do this inside Nintex forms.
If new to Nintex forms for Office 365 then it is necessary to know how to use JavaScript inside Nintex forms, follow this article before proceeding.
Steps:
The below steps are required to achieve this.
First, open the SharePoint online site and then open the list and from the ribbon click on "Nintex Forms" button in the ribbon to open the Nintex form designer.
https://www.enjoysharepoint.com/wp-content/uploads/2018/09/Nintex-forms-set-field-value.png
This will open the Nintex Forms for Office 365 designer and the list fields will appear.
Here first we need to set a JavaScript variable to the fields.
Double click on the FirstName text box which will open the Control Settings dialog box. Here expand the Advanced section and first, select "Store Client ID in JavaScript variable" Yes and then give a variable name in the "Client ID JavaScript variable name" textbox. Here we have given the name as varFirstName.
Similarly, double click on the LastName textbox and do the above step. The LastName looks like below:
Now we will write the JavaScript function which will set the field value. From the designer click on Form Settings.
Then in the Forms Settings dialog box, expand Custom JavaScript and put the below JavaScript code.
NWF$(document).ready(function(){
NWF$("#"+varFirstName).change(function()
{
var selectedValue = NWF$("#" + varFirstName).val();
NWF$("#"+varLastName).val(selectedValue);
});
});
It should look like below:
Now Save and Publish the Nintex form. And once the form published successfully.
Now try to add one item to the list. In the form, if you will put something in the FirstName text box and once you come out of the textbox LastName textbox will auto-populate like below:
References:
If you are new to Nintex for Office 365, then you can check below article first before moving further.
You can also check a few useful articles on:
- SharePoint Online Office 365 Create and Delete List using Rest API
- Microsoft Flow Step by Step Tutorial with Examples
- How to publish InfoPath forms as content type in SharePoint 2013?
Conclusion:
Here we have discussed how we can set field value using JavaScript & jQuery in Nintex forms for Office 365.