Contents

  1. Home
  2. Contents
  3. How to Create a Grid Widget
  4. Customizing the Grid Widget

Customizing the Grid Widget

If I click over to the “Properties” tab of the widget settings menu, I will find several widget customization options.

 

In the “Basic Settings” section, I can choose whether I would like to allow sorting (this option is selected by default, and we will explore it in more detail later). I can also choose whether I would like my widget to allow me to click through multiple pages and whether I would like the horizontal and vertical lines of my table to be visible. In the “Header Settings” section, I can even change the background color and font color of my header.

Basic Settings option helps to customize the widget

After experimenting with these settings, I have decided to change my header background color to a custom shade of green by clicking the down arrow in the “Background” color box, selecting the “Switcher” box in the bottom left corner, and moving the cursor around the color swatch. I have also decided to remove the horizontal lines from my widget.

Background Color box popup allows to the change the color scheme of the grid

 

My widget now looks like this.

dashboard view shows the applied color in the widget

 

I would like to test the widget’s sorting functionality, but before I do, there is one more thing I would like to change. Currently, the columns of my widget display the names of the fields that I dragged to the “Columns” box (“PlayerName” and “Sum Of Goals”).

The column names accurately reflect the data they display, but they are field names—they are not the titles I would ordinarily give to my columns.

 

To revise my column names, I can scroll down to the “Column Settings” section of the “Properties” tab and click the “Edit Column Names” button. I can then type in the new column names and click “OK,” and the column names on my widget immediately change.

Edit Column Names option helps to modify the column names

dialog where we can edit the column names

Now, I would like to test my widget’s sorting functionality. If I choose to allow sorting in the “Basic Settings” section of the “Properties” tab, I can sort my data according to either of the columns in my widget.

 

I can sort by the players’ names in ascending or descending order, or I can sort by the number of goals that were scored in ascending or descending order. To do this, I simply need to click anywhere in the header for the column by which I would like to sort.

 

For example, if I want the widget to display the most goals scored in descending order, I can click the “Goals” header. My first click displays the goals in ascending order, which is not what I want.

icon explores the dashboard to visualize the goals in ascending order

However, if I click the “Goals” header again, the goals will be displayed in descending order.

icon explores the dashboard to visualize the goals in descending order

If you prefer to sort your data by player name, you can click the “Player” heading to display the names in ascending or descending alphabetical order.

 

 

As you can see, the simple but powerful grid widget allows you to easily display and sort key pieces of data, and you can even filter the data itself to customize the information the widget displays.

 

 

For example, if I want my widget to display only the top ten goal scorers in the World Cup, I can navigate back to the “Assign Data” tab, click the “Options” button that appears beside the “PlayerName” field, and click “Filter(s).”

choose Options button where we can to apply filter to the data

 

Then, I can click the “Rank” checkbox, select “Top” from the “Mode” drop-down list box, change the “Count” option to 10, change the “Column” drop-down list box to “Goals,” and click “OK.”

filter popup allows to configure the data to be filtered for the required widget

Now, my widget will display only the top ten goal scorers from the World Cup. However, filtering the data has changed my sorting settings, so I will once again click the “Goals” header to sort by the number of goals that were scored in descending order.

 

dashboard view of the widget displays only the top ten goal scorers from the World Cup

How can we help?