A custom widget designed to work with a larger collection of data like your Staff Directory. This widget uses a paginated sort-able, searchable table to display data back in an organized way.
To add a Table with Search Widget to a Page:
- Open the Widgets Panel (+)
- Search for "Table With"
- Drag and Drop the Table with Search Widget on to the page
- Then engage the supplied switch before connecting to a collection.
This widget was specifically designed to connect to a collection. This widget will not work as a standalone widget, it must be connected to a source collection.
To Connect this Widget to a Collection:
BEFORE connecting this widget to a collection open the widget and click the switch noted in the top of the Content area of the widget. IF you plan on also showing an image in your table (not recommended) then under Configuration Settings you need to set the Force Cell to Image SRC option and identify the column.
- Access the widget settings, either Right Click the widget or choose the Gear from the widget editor.
- Choose Connect/Connected Data
- Set the "Connect Records to" option to your desired collection like your PlusPortals Staff Directory
- Map/Connect the Columns to the appropriate column that will display the data like Column1 to ProperName and Column2 to Position, etc. Note not all fields will be used.
- Optional: Choose Filter & sort to set a sort or fixed filter on the widget. This would allow you to sort by Name (Last,First) or filter by a department. For example, to have a table of your department of Office Staff Only.
- Click Done
- Access the widget content and under Headers check the box to "Use" the column or not.
- Give each used column a Title.
- Turn the Switch at the top OFF to generate the table and close the widget editor.
- Your data should now be displaying in the widget.
By defualt the table is automatically sorting on COLUMN1. Users can click on other columns to sort by when interacting with the widget. Also, the search will search all column fields automatically.
Content Options
The widgets content options are minimal especially when connecting to a Collection like PlusPortals.
# | Title | Settings |
1. | Collection Toggle | A switch to engage before connecting the widget to a collection. Must be disengaged after connection is made |
2. | Configuration Settings | Unique ID (if placing more than one widget on the same page) Display Search Bar Toggle Add print and download buttons Pagination Option - Show Pagination, Show Number of Results to Display, Force Cell To Image SRC and Which Column is an Image |
3. | Headers | Use Column Headers (Column Titles) |
Design Options
Most design options are standard items you may find with other widgets like adjust Font Size and Color etc.
# | Title | Settings |
1. | Text Styles | Text Styles- Column Header and Data Text Show Entries + Search Labels Text Style Search Bar Placeholder Text Pagination Text Style |
2. | Search Bar Styles | Border Settings Background Rounder Corners |
3. | Pagination Styles | Multiple Color Settings for the pages #s displaying in lower right corner. Padding, Background, and Border |
4. | Rows | Color options for even and odd rows |
5. | Button Styles | Settings for the Previous and Next Buttons of the pagination |
6. | Table Styles | Border Width Border Color |