Tech Tip: Custom Filter Elements

Integrating multiple clickable elements is a good way to provide quick access to the most common search results.  You can also use this technique with an image map to provide a more visual alternative to the standard search page.

These custom filter elements are created by passing parameters using one or more query strings.  You choose the search criteria and include it in the link URL.  The Report DataPage then reads the search criteria and displays the appropriate results.

Steps to creating a custom filter element:

Create a Report based on pre-defined criteria

If you have a previous Report DataPage, make a copy and follow these instructions to convert it to use pre-defined criteria.  Otherwise, open the DataPage wizard by clicking the New button.  Select Reports and choose the Report type (Tabular, List, or Gallery).  Click Next.

On the second screen of the DataPage wizard be sure to enable advanced options and parameters.  Click Next.

On the next screen we need to enable external parameters because the search criteria are going to be passed via query string.  Select the radio button for “Filter data based on your pre-defined criteria”.  Also allow parameters in the search criteria and choose both Bridge and external parameters.  Click Next.

Create your pre-defined filter

On the next screen of the DataPage wizard we will create the filter that will receive our query string data.  Include the fields that will be used for filtering by moving them to the right-hand panel using the arrow buttons.

For example, if you would like to create the following elements:

Each button here would filter by the City field, so you will need to move city to the right-hand panel.  You can include as many fields as you would like in your filter.  Any filter elements that do not receive data can be ignored.  Click Next.

On the Configure Filtering Fields screen, click the advanced tab.  Select the Radio button to receive parameter.

The radio buttons under the receive parameter option tell the DataPage what to do if no information is received for this field.

• Value required will display “No records found” if this field is empty
• If empty, match blank values only
• If empty, ignore criteria is only used when you have added multiple criteria for a single field.
• If empty, match all records will not filter by this field if no data is received.

Be sure to note the parameter name (the text between “[@” and “]” because you will need it later.

Once you have included and formatted all of your filtering fields, you can create or revise the rest of your Report as needed.

Now that your Report DataPage is complete, deploy it using the embedded method.  Copy the host URL (if using the embedded deployment method).

Generate links to filter this DataPage

Now we can generate the links to filter this DataPage using parameters.

Custom Filter Element Form:

http://b4.caspio.com/dp.asp?AppKey=a301200034f1ce0fbb274fd1b7b7

Use this form to generate each filter element based on your specific page URL, text/image links, and parameters. Press submit to generate the HTML code to insert into your web page.

For example:

Gives the following:

Image Maps

This technique can also be used to create image maps.  Image maps, are clickable images where each region leads to a different URL.  Using the image below, we could create an image map that dynamically listed only records within the clicked region.

Many online tools exist that will generate image maps for you.  Just use the URL from the Custom Filter Element form as the image map destination.  You can even put the image map and the Report DataPage on the same web page!