how to enable and disable heart symbol

how to enable and disable heart symbol

  

hi friends,

                   I have editable table which lists different clubs.how to implement favourite heart symbol for each club .by default heart is not starred after user click on it it should become starred and again clicking it should become unstarred how to implement this.

Hi Karthik,

You should create an entity with a unique identifier, ClubId, UserId and a field for IsLoved(boolean).

When you query the list of clubs, left join on the new entity and filter on UserId.

Show the boolean IsLoved as a red heart image (icon) when true or outlined / light gray heart image (icon) when false.

OnClick of the image / icon (add a link around the image), you create an action to CreateOrUpdate the value to True or False depending on the previous value (just a toggle functionality) and Ajax-refresh the current line of the current table.

In a short way that's all there is to it.

Kind regards,

Remco Dekkinga

Remco Dekkinga wrote:

Hi Karthik,

You should create an entity with a unique identifier, ClubId, UserId and a field for IsLoved(boolean).

When you query the list of clubs, left join on the new entity and filter on UserId.

Show the boolean IsLoved as a red heart image (icon) when true or outlined / light gray heart image (icon) when false.

OnClick of the image / icon (add a link around the image), you create an action to CreateOrUpdate the value to True or False depending on the previous value (just a toggle functionality) and Ajax-refresh the current line of the current table.

In a short way that's all there is to it.

Kind regards,

Remco Dekkinga



hi manish,

                  how to insert heart symbol in the table.can u give the procedure for it



Hi Karthik,

If you follow some of the trainings, you will learn how to do it yourself.

Please check out this exercise on how to create something similar to what you need:

https://www.outsystems.com/learn/lesson/880/web-blocks-and-ui-reusability-exercise/

To add the symbol to the table, just drag the icon widget into the table.

Kind regards,

Remco Dekkinga

hi remco,

             how to make heart symbol clickable.i have attached my module

hi friends,

                  i have two text box email and name .how to validate email without pressing save button

karthik R wrote:

hi friends,

                  i have two text box email and name .how to validate email without pressing save button

Hi Karthik,

You can use the OnChange event of the email input event to validate it. Also, check this documentation page for more info "Validate Form Inputs" (it also applies to inputs outside forms).

P.S.: Since this is a different question from the one you've started, consider opening a new thread.


Regards,

António Pereira

Hi Karthik,

Can you create a new forum post for your last question? It doesn't help the overview of forum posts.

Regarding your hearts. There are two options:

1. is the heart an option for all users that can be set on records that are already created (similar to the Like button on Facebook posts)? or;

2. is the heart only once selected when creating the club, like a checkbox?

The problem is that when you go for option 1, you don't want the heart to be available on the editable list, but on an overview for end-users. If you go for option 1, you want the boolean value to be part of the club entity.

As far as I could see in your code, you don't want to refresh the entity before setting the value and set the IsLiked to Not IsLiked instead of True, otherwise you can only turn it on instead of toggling.

Kind regards,

Remco Dekkinga