Unhide control for a set time

  • 22 January 2019
  • 1 reply
  • 2 views

Badge +5

I have a lookup control that when selected will pre-load a repeating section (thanks to Paul Crawford‌).

However now that I have implemented all my validation/hide rules on the repeating rows there is a short delay or 2 - 3 seconds before loading the populated rows. Therefore I would like a "Please wait" message to appear on the form for 3 seconds before disappearing e.g.:

  1. Label with "Please wait" is hidden on the form.
  2. Select a value from the lookup control.
  3. The "Please wait" label appears.
  4. After 3 seconds the "Please wait" label disappears.

How would I achieve this in Nintex Forms?


1 reply

Badge +7

Using a little JavaScript, you should be able to accomplish this.

 

First give your List Lookup control a Client ID JavaScript variable name:

313iC5DFDB48E992B1F0.png

 

and add a CSS class to your Label control:

314i47E086AEC45E3FA5.png

 

Then, in the Custom JavaScript section under Settings, paste the following code:

NWF$(document).ready(function(){
	NWF$('.pleasewait').css('visibility','hidden');
	NWF$('#' + listlookup).change(function(){
		sleepfor(3000);
	});
});

async function sleepfor(time) {
  NWF$('.pleasewait').css('visibility','visible');
  await sleep(time);
  NWF$('.pleasewait').css('visibility','hidden');
}

function sleep(ms) {
	return new Promise(resolve => setTimeout(resolve, ms));
}

Which I pulled from this Stackoverflow article and modified.

 

Notice where I use the '.pleasewait' for my label and the '#' + listlookup for my lookup control.

 

I set sleepfor(3000) which equals 3 seconds. Just change that number to accomodate your required length of time.

 

End result:

315i4B4BE4E7D6FEFD74.gif

Reply