Input "On Change" is too fast

Post Closed

Cristovao Vaz

Solved

Question

Hi,

I have an input with an "On Change" destination, but it triggers too fast. (around 1-2 sec.)

What ends up happenning is this:
- User wants to type 12.50
- Types "12" and looks at the paper
- Types ".50", but it replaces the "12"

Is there a way (argument?) to delay the trigger a couple of seconds? Another (better) way to overcome this?

Thank you.

12 Sep 2012

Ricardo Ferreira

Staff

Solution

Hi Cristovao!

You can change the trigger delay of an "On Change", by setting the osOnChangeTimerDelay javascript variable.

The default value is 800, that corresponds to a delay of 800 ms after the user stops typing.

To change this value to 3 seconds, you just have to include the following javascript statement in your eSpace javascript.

osOnChangeTimerDelay = 3000;

Thanks!

See solution in context

12 Sep 2012

1 reply

17 Apr 2018

Show thread

Hide thread

André Pinho

Ricardo Ferreira wrote:

Hi Cristovao!

You can change the trigger delay of an "On Change", by setting the osOnChangeTimerDelay javascript variable.

The default value is 800, that corresponds to a delay of 800 ms after the user stops typing.

To change this value to 3 seconds, you just have to include the following javascript statement in your eSpace javascript.

osOnChangeTimerDelay = 3000;

Thanks!

Hi Ricardo, sorry for my ignorance, where can I find & change the osOnChangeTimerDelay javascript variable, could you show me a screenshot? I cannot seem to find it anywhere, sorry I'm a newbie with a personal environment only. Thanks.

17 Apr 2018

Gonçalo Martins

Staff

Hi Cristovão,

Have you tried to use the onkeyup event instead?
You can even do something like:

$('#element').bind('keyup', function() { alert('hello world!!') } );

You can also do

$('element').keyup(function() { });

Note that in jQuery, the letters 'on' are removed from all functions.

Best Regards,

Gonçalo M.

12 Sep 2012

António Chinita

Hi Cristovao,

Actually, using onblur would be the best solution for that case.
Whenever the control loses focus, you save the data. See here.

:)

12 Sep 2012

MVP

Yeah, wish it would be a standard option in the properties of an input-widget to be able to use OnBlur instead of OnChange.

12 Sep 2012

Ricardo Ferreira

Staff

Solution

Hi Cristovao!

You can change the trigger delay of an "On Change", by setting the osOnChangeTimerDelay javascript variable.

The default value is 800, that corresponds to a delay of 800 ms after the user stops typing.

To change this value to 3 seconds, you just have to include the following javascript statement in your eSpace javascript.

osOnChangeTimerDelay = 3000;

Thanks!

12 Sep 2012

1 reply

17 Apr 2018

Show thread

Hide thread

André Pinho

Ricardo Ferreira wrote:

Hi Cristovao!

You can change the trigger delay of an "On Change", by setting the osOnChangeTimerDelay javascript variable.

The default value is 800, that corresponds to a delay of 800 ms after the user stops typing.

To change this value to 3 seconds, you just have to include the following javascript statement in your eSpace javascript.

osOnChangeTimerDelay = 3000;

Thanks!

17 Apr 2018

Cristovao Vaz

Thanks everyone.

Ended up using "onblur" with "document.getElementById('" + bt n_name.Id + "').click();"

Took me a while to realize had to keep "Visible" as True and use style to hide it... but it's working fine now.

17 Sep 2012

Pedro Domingues

Champion

Hello Guys,

I've tried to do exactly the same and, at least on platform 9.1, the correct variable to use is osOnChangeTimerDelay instead of the mentioned osOnChangeTimeDelay.

Cheers,

12 Apr 2016

Kilian Hekhuis

MVP

Hi Pedro,

That's what Ricardo also mentioned, he just made a typo in the example.

13 Apr 2016

Pedro Domingues

Champion

Just to ensure! =)

13 Apr 2016

Arjan Waardenburg

Staff

Any idea if a similar setting kan be used in a P10 generated application ? Setting the timer variable does not work in that setup unfortunately, it also uses a very short timeout.

24 Jan 2017

Kilian Hekhuis

MVP

Hi Andre,

It's a JavaScript variable, so it's not directly available in Service Studio. But if you start a Web App, and use your browser's devtools, you can query the variable:

If you want to change it, you'll need to write some JavaScript yourself.

17 Apr 2018

1 reply

23 Dec 2022

Show thread

Hide thread

sumant kumar

Do you use console.log() for this?

23 Dec 2022

Danny O'Neill

Should that variable be visible in a mobile app? If I debug a mobile app in chrome and inspect with chrome dev tools, I cant see that variable. Would be good to lengthen it a bit if poss!

17 Apr 2018

Kilian Hekhuis

MVP

Hi Danny,

No, the variable is probably not available to mobile apps. But with mobile apps you have also access to onblur, which might suite you better?

18 Apr 2018

Danny O'Neill

I am literally working on doing that right now Kilian, thanks!!!

22 Apr 2018

André Pinho

Hi Kilian, sorry to keep pressing for this but I am still learning the platform and I am not a developer, could you explain how to implement the javascript in espace to the suggested 3 seconds..

osOnChangeTimerDelay = 3000;

I have not found were I can add javascript in the espace and how ot implement this code. thanks

04 Aug 2018

Kilian Hekhuis

MVP

Hi André,

For Mobile Apps, adding JavaScript is as simple as using the JavaScript Statement:

Since they are part of the flow, they can interact with the rest of the code via Input and Output Variables. This is probabably what you want for the osOnChangeTimerDelay.

Larger scripts can be added in the Scripts Folder on the Interface tab. These are typically .js files that you want to include rather than smaller stuff written yourself. Note that there's no input/output here, so they must be self-contained. To include them in a Screen, select them in the Required Scripts Property of the Screen.

06 Aug 2018

2 replies

Last reply 06 Feb 2023

Show thread

Hide thread

Diogo Luciano

Hi @Kilian Hekhuis,

Sorry for the question, this post is old but I think you can help with this.

I am trying to delay the onchange on my input field in reactive. I added the script with only this: osOnChangeTimerDelay = 3000;
I also tried called this script on screen, module and on initialize and I still can't make this work.

Last year I tried with traditional and it worked, but with reactive I can't make it work.

Can you help me please?

06 Feb 2023

Kilian Hekhuis

MVP

Replying to Diogo Luciano's comment on 06 Feb 2023 16:42:47

Hi Diogo,

Please do not reply to old topics, especially if you have a new question. I'd advise you to start a new topic, perhaps referring to this thread. Unfortunately, I can't help you here.

06 Feb 2023

André Pinho

Hi Kilian,

Sorry, you are talking to a newbie (both OS and JS). Could you explain "baby steps" what exactly I need to do.

I have an email input field with a On Change action to validate the email address.
Problem is this tries to validate the address too fast.

Here is what I have attempted to do so far (but failed):

Help?

06 Aug 2018

Kilian Hekhuis

MVP

The osOnChangeTimerDelay is a setting that (apparently, I'm going by Ricardo's information here) changes the time it takes for the Platform to fire an onchange event. So you need to set that once (per Screen, probably).

What you have attempted to do is calling the delay setting function after the onchange has fired, which of course is not what you need to do. Also, you gave the JavaScript function the same name as the variable, and I'm not very proficient in JavaScript, but I think that's not a good idea...

07 Aug 2018

Dhiranjan Sahu

Try this component. It might help you.

https://www.outsystems.com/forge/component-overview/9294/input-stoptyping-event

06 Sep 2020