How to configure "red task number" , sample see attached image?


How to configure "red task number"  , sample see attached image?

Hi Jack,

As per the mentioned requirement If i am not wrong this is what you want --> Demo Link


If it is so, please let me know, will try to help you in the implementation.


Kind Regards,

Benjith Sam

Benjith Sam wrote:

Hi Jack,

As per the mentioned requirement If i am not wrong this is what you want --> Demo Link


If it is so, please let me know, will try to help you in the implementation.


Kind Regards,

Benjith Sam


Hi benjith,  

Yes, that`s what I want.


Solution

Hi Jack,

If you are using Outsystems 11, there is a component in outsystems UI that does that. It's called icon badge. You can check it here.

Regards,

Marcelo

Solution

Jack Bao wrote:

Benjith Sam wrote:

Hi Jack,

As per the mentioned requirement If i am not wrong this is what you want --> Demo Link


If it is so, please let me know, will try to help you in the implementation.


Kind Regards,

Benjith Sam


Hi benjith,  

Yes, that`s what I want.


Hi Jack,

Adding to what Marcelo Sir had mentioned, to achieve the stated requirement I used 

1) Data\IconBadge & Data\Badge

2) Button with Ajax Submit (On Click - Method) - Logic to add 1 to the local variable of Integer type which is binded to the Badge - Number field

3) Added custom CSS on the container which contains the Data\Badge UI component -> To place the badge over the Default User Image


SyntaxEditor Code Snippet

"   position: absolute;
    left: 8%;
    top: 50px;
    z-index: 10;
"


Please let me know if I was not clear enough. Happy to help you :)


Kind Regards,

Benjith Sam

Thank Benjith , Marcelo !