11
Views
5
Comments
Solved
On click change div colors
Question

I am new at OutSystems and I am trying to create a button group, or similar to it. I have div that on click I need to change its background color and if I click another div among the options that color must be removed from that div and added to the current clicked div.

Is there a way I can do it in Outsystems, to add or remove divs color on click?

ContactApp.oml

Rank: #90
Solution

Hi Marco,

Use style in property for change css. also you can use jquery for it.

i have updated your oml

https://rahul-sahu.outsystemscloud.com/ContactApp/CallResult.aspx?_ts=637296444373317246 


Regards

Rahul Sahu

ContactApp1.oml

mvp_badge
MVP
Rank: #91

Hi Marco, 

The mentioned requirement is same as how the ButtonGroup widget works in outsystems..

Is it that you are facing any challenges in implementing the same? or do you have any other complex requirement on top of it?

If you want to redraw the same control then you can go with Rahul's solution but you will have to explicitly call the Ajax refresh in every button click to apply the CSS style class.


See this sample app... 

Please find the attachement.


Hope this helps you!


Regards,

Benjith Sam

ButtonGrpSampleApp.oml

Rank: #90

Hi Marco,

Share your oml once.

You can simple use JS like below

Put this js on page JavaScript property

$(document).on('click','.CommonClass', function(){
    $('.CommonClass').removeClass('selected');
    $(this).addClass('selected');
});

Use css on style Property

Screen Design-

Regards

Rahul Sahu