5839
Views
17
Comments
Solved
Calling a Screen Action on Extended Properties (onblur, onfocus, etc)

Hello fellow OutSystems friends,


I am currently working on a functionality on an input button's onblur to call a Screen Action (Let's name it OnInputBlur). Here's an example:

Input1: Free text input
Disabled Input2: Generates information from a Screen Action (OnInputBlur) when Input1 loses focus


The question is: As only OnChange is provided for input field, how will I be able to call the Screen Action (OnInputBlur) on the "onblur" of Extended Properties?


Thanks in advance!

2015-04-10 17-57-05
Pedro Coelho
 
MVP
Solution

@Bruce Buttles

I don't think it ever got an official answer

I did find out a viable option to do this:

  • Add a FakeNotifyWidget (from RichWidgets) to the block and create an OnNotify action for it
  • Name it (the FakeNotifyWidget) and on the onblur event of the desired input add the following:
    OsNotifyWidget('<FakeNotifyWidget>.Id', '<message>')
  • On the OnNotify action you can get the <message> using the NotifyWidgetGetMessage() built-in function and treat it accordingly

Hope this helps

Best regards,

PC

2018-06-24 00-44-25
Bruce Buttles

Pedro Coelho wrote:

@Bruce Buttles

I don't think it ever got an official answer

I did find out a viable option to do this:

  • Add a FakeNotifyWidget (from RichWidgets) to the block and create an OnNotify action for it
  • Name it (the FakeNotifyWidget) and on the onblur event of the desired input add the following:
    OsNotifyWidget('<FakeNotifyWidget>.Id', '<message>')
  • On the OnNotify action you can get the <message> using the NotifyWidgetGetMessage() built-in function and treat it accordingly

Hope this helps

Best regards,

PC

Hey thanks this worked like a champ!


UserImage.jpg
Sergio Serrao

Pedro Coelho wrote:

@Bruce Buttles

I don't think it ever got an official answer

I did find out a viable option to do this:

  • Add a FakeNotifyWidget (from RichWidgets) to the block and create an OnNotify action for it
  • Name it (the FakeNotifyWidget) and on the onblur event of the desired input add the following:
    OsNotifyWidget('<FakeNotifyWidget>.Id', '<message>')
  • On the OnNotify action you can get the <message> using the NotifyWidgetGetMessage() built-in function and treat it accordingly

Hope this helps

Best regards,

PC

Can you please confirm if the syntax is like this? I'm not being able to get it work.

Tks

2015-04-10 17-57-05
Pedro Coelho
 
MVP

That is the syntax, but you need to add it like this:

onblur

= "OsNotifyWidget('" + FakeNotifyWidget.Id + "', 'This is my message');"

This is done so you will actually get the Runtime Id in the script

Hope it helps

Best regards,

PC

UserImage.jpg
Sergio Serrao

Pedro Coelho wrote:

That is the syntax, but you need to add it like this:

onblur

= "OsNotifyWidget('" + FakeNotifyWidget.Id + "', 'This is my message');"

This is done so you will actually get the Runtime Id in the script

Hope it helps

Best regards,

PC

Yes it helped .Tks


2017-07-05 18-13-21
Tiago Neves

Hi Danilo,

On the extended properties you can call (click) an hidden button (display:none;) that will run the screen action you want. Use this javascript: "document.getElementById('"+HiddenButtonName.Id+"').click();"

UserImage.jpg
Danilo Jr Eraes

Hi Tiago,

Thank you for your reply. I have tried this and is working, but is very inefficient especially when I am incorporating a lot of events on 1 input field. I am calling Ajax Refresh on the Screen Actions and sometimes the value that I want is not reflected correctly. Is there any other way to do this?

2015-04-10 17-57-05
Pedro Coelho
 
MVP

Actually that is a very good question, which I don't think I've have ever seen responded by OutSystems staff

If you take a close look at what the platform generates automatically when having an onchange set, should be something like:

onchange="OsAjax(arguments[0] || window.event,'the input name here','the input id here','Change','__OSVSTATE,','');"

The input name is the same as the input id but with "$" instead of "_"

You can replicate this behavior by yourself on the onblur property, but I would love to hear a better option to do this

Best regards,

PC

2015-04-10 17-57-05
Pedro Coelho
 
MVP

Digging a bit in the P10 documentation we have this link that shows us how to execute a server side action in mobile apps...

Would be awesome to have the same in Web applications

Best regards,

PC

UserImage.jpg
Danilo Jr Eraes

Hi Pedro,

Thank you for your reply. I visited the link you mentioned and indeed it does have the same functionality for the mobile app. I do hope there is an easier (and less cluttered) way in the Desktop app. I'll let you know when I find a solution for my problem, but if there are any other suggestions it is greatly appreciated. Thanks!

2015-04-10 17-57-05
Pedro Coelho
 
MVP

@Outsystems Staff

Any comments to this thread? :)

What's the correct approach to use when we need to use screen actions in onblur/onfocus events without having to use an extra click on a hidden button?

Best regards,

PC

2018-06-24 00-44-25
Bruce Buttles

Pedro Coelho wrote:

@Outsystems Staff

Any comments to this thread? :)

What's the correct approach to use when we need to use screen actions in onblur/onfocus events without having to use an extra click on a hidden button?

Best regards,

PC


I still need this as well ... I need an OnKeyPress event to call a ScreenAction too.

Was this ever solved?

2015-04-10 17-57-05
Pedro Coelho
 
MVP
Solution

@Bruce Buttles

I don't think it ever got an official answer

I did find out a viable option to do this:

  • Add a FakeNotifyWidget (from RichWidgets) to the block and create an OnNotify action for it
  • Name it (the FakeNotifyWidget) and on the onblur event of the desired input add the following:
    OsNotifyWidget('<FakeNotifyWidget>.Id', '<message>')
  • On the OnNotify action you can get the <message> using the NotifyWidgetGetMessage() built-in function and treat it accordingly

Hope this helps

Best regards,

PC

2018-06-24 00-44-25
Bruce Buttles

Pedro Coelho wrote:

@Bruce Buttles

I don't think it ever got an official answer

I did find out a viable option to do this:

  • Add a FakeNotifyWidget (from RichWidgets) to the block and create an OnNotify action for it
  • Name it (the FakeNotifyWidget) and on the onblur event of the desired input add the following:
    OsNotifyWidget('<FakeNotifyWidget>.Id', '<message>')
  • On the OnNotify action you can get the <message> using the NotifyWidgetGetMessage() built-in function and treat it accordingly

Hope this helps

Best regards,

PC

Hey thanks this worked like a champ!


UserImage.jpg
Sergio Serrao

Pedro Coelho wrote:

@Bruce Buttles

I don't think it ever got an official answer

I did find out a viable option to do this:

  • Add a FakeNotifyWidget (from RichWidgets) to the block and create an OnNotify action for it
  • Name it (the FakeNotifyWidget) and on the onblur event of the desired input add the following:
    OsNotifyWidget('<FakeNotifyWidget>.Id', '<message>')
  • On the OnNotify action you can get the <message> using the NotifyWidgetGetMessage() built-in function and treat it accordingly

Hope this helps

Best regards,

PC

Can you please confirm if the syntax is like this? I'm not being able to get it work.

Tks

2015-04-10 17-57-05
Pedro Coelho
 
MVP

That is the syntax, but you need to add it like this:

onblur

= "OsNotifyWidget('" + FakeNotifyWidget.Id + "', 'This is my message');"

This is done so you will actually get the Runtime Id in the script

Hope it helps

Best regards,

PC

UserImage.jpg
Sergio Serrao

Pedro Coelho wrote:

That is the syntax, but you need to add it like this:

onblur

= "OsNotifyWidget('" + FakeNotifyWidget.Id + "', 'This is my message');"

This is done so you will actually get the Runtime Id in the script

Hope it helps

Best regards,

PC

Yes it helped .Tks


2015-04-10 17-57-05
Pedro Coelho
 
MVP

Glad it helped :)

Best regards,

PC

2015-04-10 17-57-05
Pedro Coelho
 
MVP

Glad it helped!

Best regards,

PC

UserImage.jpg
João Campos

Hi,

I have a similar problem. The difference is i have a combo box and when i click on my combo i want to add/remove a class from another widget. The problem isn't on the javascript im using, cause when i call an action onClick for the surrounding container it works just fine, but the problem is it only works when i click between the container's area and the combo box itself. If i click inside the combo to expand it or hide and i use the solution above it doens't work.

On my combo box i had an onblue extended propertie and the FakeNotifiyWidget trick. Can't understand why it's not working, can it be related on Outsystems not recgonizing the combo is being clicked?

If someone can help me with this issue would be great.

Best regards,

João Campos

UserImage.jpg
Gustavo Urias Pereira Feitoza

I couldn't get the message...


how should i use NotifyWidgetGetMessage ()?

2020-07-02 13-32-59
Max de Groot

Hi all,

Thanks for posting this solution, it works fine on a single input! 

For a project I am working on we use the editable table as provided by OutSystems. Now I am using above logic to save answers onblur but this is giving some issues while trying to go through multiple columns without losing focus to the row. I am using a webblock inside each column of the table (same block) where the end user answers the question. I am using this since the input can be short text, long text or a dropdown. The editable table itself is a webblock as well, that is inside another webblock. 

So for example, if I add a new row to the table, the answerId will be 0. OnBlur the logic above will save it and give back an answerid. If I do not 'leave' the table but go to the next column right away I do not get the new answerid, but 0 is used again. This results in multiple rows of answers while it should be in the same row. 

I have tried using the event handler and passing back the answerId and the rownumber to try and change the input of 0 to the newly created answerId. It seems that the save logic runs twice (once for the answer I just entered, once for the new column I clicked) and therefore overwrites the AnswerId with 0 again, thus creating new answers all the time. 

Would anybody know how to fix this?


Regards,
Max

Community GuidelinesBe kind and respectful, give credit to the original source of content, and search for duplicates before posting.