Showing results for 
Search instead for 
Did you mean: 

Improving the tabbed Nintex Forms experience: a JavaScript solution

Nintex Newbie
6 2 2,018

I would like to share my solution to a little problem that I recently encountered in a project.  I was using tabbed forms and noticed that submitting the form, if you re-open the form in view mode you will see that the form is not appearing with first tab selected. It is selecting the tab last viewed and displaying the visible panel for that tab. What’s happening here is the choice control is saving the value internally of last option (Tab) selected before the form is saved and that’s why when you are trying to view the form it’s selecting the last value it reached and displaying the required panel that is visible for that value. (Incidentially, if you’d like to know more about choice controls and rules, go here.)

That could really be confusing to the user of the form, but we can improve their experience!


So before saving the form if we can set the value of the choice control to the first option forcefully, the problem can be solved.

What to do?

Step 1:

For this you have to set ‘Store Client ID in JavaScript variable’ as yes and have to give ‘Client ID JavaScript variable name’ for the choice(Tabbed) control as follows:


Step 2:

Now Goto Settings and click on “Custom JavaScript” as follows:

Step 3:

Paste the required script to set forcefully the value of Choice(Tab) control


What the code snippet is doing here?

Before saving the form the required JQuery Submit function triggers first and it set the value of the choice control forcefully to the first option value(it could be different as well as per the requirement) before the form is saved. And now the if you open the form it will come up with the first tab selected.  

I hope this helps your users' experience.

Automation Master
Automation Master

Great Post!

Nintex Newbie

It's not letting me give kudos to this past, but I want to.

I'm curious why set the value upon submit, rather than upon opening the form (in view or edit mode)?

Related question; does custom JavaScript fire before or after rules?  Does the JavaScript function matter (like how certain functions fire before or after one another), or are ALL rules processed before or after the JavaScript?

I plan on using rules to change tabs, and to validate input on each tab, but also want to use JavaScript to run certain actions on the tab/page.