How to highlight selected values

Hello,

I have few containers containing values from entity. On selecting(click) the value the container need to be highlighted to show it as selected item.  Again onclick it need to be deselected. I can select multiple items. How to highlight or change css when selected. I can attach a sample oml if needed.



Thanks.

Hi Priya,

you can do it by simple JS code-

On Page

put this code on JS property-

$(document).on('click','.CommonClass', function(){
    if($(this).attr('class').split(' ').pop()=='selected')
    {
     $(this).removeClass('selected');
    }
    else
    {
    $(this).addClass('selected');
    }
});

Put this css on Css property 

.selected{
    background-color: #861b1b;
    color: #fff;
}
.CommonClass{
border: 1px solid black;
cursor: pointer;

}


Provide a name CommonClass for container.

See Demo- https://rahul-sahu.outsystemscloud.com/Email/Demo.aspx?_ts=637301428896480625 

let me know if you want any other solution.

Hope this will help you.

Regards

Rahul Sahu

Rahul Sahu wrote:

Hi Priya,

you can do it by simple JS code-

On Page

put this code on JS property-

$(document).on('click','.CommonClass', function(){
    if($(this).attr('class').split(' ').pop()=='selected')
    {
     $(this).removeClass('selected');
    }
    else
    {
    $(this).addClass('selected');
    }
});

Put this css on Css property 

.selected{
    background-color: #861b1b;
    color: #fff;
}
.CommonClass{
border: 1px solid black;
cursor: pointer;

}


Provide a name CommonClass for container.

See Demo- https://rahul-sahu.outsystemscloud.com/Email/Demo.aspx?_ts=637301428896480625 

let me know if you want any other solution.

Hope this will help you.

Regards

Rahul Sahu

Hello Rahul sahu,

 Thanks for suggestion, but i want to select multiple items  and can't we achieve this without using jQuery or javascript? The link you provided for demo can you make it anonymous so that I can have a look . 

Thank you


 

Hi Priya ,

Now you can check , i have made it anonymous.

Can you provide oml.


Regards

Rahul Sahu

Rahul Sahu wrote:

Hi Priya ,

Now you can check , i have made it anonymous.

Can you provide oml.


Regards

Rahul Sahu

 

 Attached an oml. kindly check 

Hi Priya,

I have updated you oml find it but i didnt understand what you want achive.

why Every onclick you call db action for create or update?


Regards

Rahul Sahu

Rahul Sahu wrote:

Hi Priya,

I have updated you oml find it but i didnt understand what you want achive.

why Every onclick you call db action for create or update?


Regards

Rahul Sahu

Hi Rahul,

  I want to save the selected value in my database. i don't want to toggle classname by js as it is not best practice anyways thanks for your suggestion.

 Thanks

Priya Ruth wrote:

Rahul Sahu wrote:

Hi Priya,

I have updated you oml find it but i didnt understand what you want achive.

why Every onclick you call db action for create or update?


Regards

Rahul Sahu

Hi Rahul,

  I want to save the selected value in my database. i don't want to toggle classname by js as it is not best practice anyways thanks for your suggestion.

 Thanks

 Hi Priya,

I have updated oml again it will work without js.also added some logic you can find in oml 

As data Insert in Usercolor entity without Users idenetifire. you can modify according youur logic.


regards

Rahul Sahu