Question

Display toggle icon (slidebar )

Is there any OOTB control to present the checkbox as "Toggle Switch"?.

Pega 7.3.1

Comments

Keep up to date on this post and subscribe to comments

October 10, 2019 - 11:22am

I don't recall if we have something OOTB for this in 7.3.1, but you can probably achieve this through CSS.

In fact, I believe someone has created a RS that you can import to view a mockup of said CSS.

https://community.pega.com/marketplace/components/checkbox-styling-control

October 11, 2019 - 3:13am
Response to Rett_Hean_GCS

Alignment is missing if checkbox has caption .   

Toggle is not responding if caption is left aligned.

 

October 15, 2019 - 2:48am
Response to Brahmesh@

Hi @BramheshM

I was also able to see the same issue you have reported here.

When caption position is given as "Left" and some caption label is give, the toggle is not responsible.

Instead of giving Checkbox caption in the general tab, can you provide the label in presentation tab as below. 

With this the toggle is responding. However the alignment is not proper. For that add the below script in the UserWorkForm.

<style>
  
  .chkbxCaptionRight {
  margin-left : auto;
  }
</style>

This would show the checkbox as below based on your dynamic layout format.

If you want the checkbox in a specific distance from the label you can change the style as below in UserWorkForm.

I gave a margin-left of 80 px that resulted as below.

Hope this helps.

Regards,

Priyabharathi

Pega
October 10, 2019 - 11:42am

Hi,

Thank you for posting your query in PSC!

In Pega 7.3.1 there is no OOTB control available to present the checkbox as "Toggle Switch".

You can customize your application based on your business requirement. The below links might help you to customize the checkbox.

https://community1.pega.com/community/pega-support/question/fancy-checkbox-toggle-switch-we-are-not-getting-property-value

https://community.pega.com/marketplace/components/checkbox-styling-control

https://community1.pega.com/community/product-support/question/how-show-checkbox-slider

Thanks,

Geeda.