Authored by Anonymous

There is no out-of-the-box control in Pega Platform to implement a search box. Usually, it is implemented as a regular text field with a Search button next to it. However, it is much more intuitive to have a text field with a Search icon (a magnifying glass) for entering search criteria. This is in line with what is visible on most popular websites and apps. This document provides the steps for styling a search box that looks like the following screenshot.

To style the search box:

1. Configure a Text input control.
2. In the Presentation tab, in the Control format field, enter Table search.
3. In the Advanced Presentation Options section, define the Cell read-write classes and Cell read-only classes as label-height-0 border-0.
4. Clear the Reserve space for label check box.

For more information about Text input controls, see https://community.pega.com/knowledgebase/articles/user-experience/85/configuring-text-input-control.

Categories: 

• Pega Platform
• Design pattern