Categories:
Partners
Web Hosting
We've partnered with HostGator for reliable, affordable hosting starting at $3.95/mon. Use coupon code "javascriptkit25" for 25% off any package.

Filtering a Tabular Data Control

Besides sorting it, a Tabular Data Control can also be filtered, meaning the data can be displayed selectively depending on the value of the columns. For example, you may wish to only show the first 5 students within a list of student records, or only students with a grade of 80% or higher. The ability to control how much information gets displayed at once in a TDC is very useful. If you're unfamiliar with TDC in general, be sure to first read the tutorials "Introduction to Tabular Data Control" and "Sorting a TDC."

Filtering a TDC follows the exact same procedure as sorting it, and can be done either through the <PARAM> tag or script:

  • <PARAM name="Filter" value="filter string">

  • TDC.Filter: Read/writable property that contain the filter string

  • TDC.reset(): Method that refreshes the displayed data according to the settings of a Sort or Filter request.

A filter string can get more complex than a sort string, as it supports basic logic, such as "grades that are 80% or higher" or "names that being with John". Below lists the logic supported in a filter string:

= (equal sign) <> (not equal) & (and)
> (greater than) >= (greater or equal)  | (or)
< (less than) <= (less than or equal) (...) (parentheses for grouping multiple statements)

You can use the wildcard (*) character and empty string (&quot;&quot;) in your comparison to denote any string and empty string, respectively. Ok you're dying to see some examples.

studentgrades.txt:

name|grade
~George Chiang~|~83%~
~Bill Larson~|~69%~
~Jimmy Lin~|~94%~
~Mary Miller~|~59%~
~Jane Wood~|~89%~
~Terry Gray~|~72%~
~Andrew Dart~|~82%~

The following <param> causes our TDC to display only students with grades of 70% or lower:

<PARAM NAME="Filter" VALUE="grade<70%">

This one filters and displays the grades of the students "Mary Miller" and "Jane Wood":

<PARAM NAME="Filter" VALUE="(name=Mary Miller)|(name=Jane Wood)">

Here we display grades that are in the 70's range:

<PARAM NAME="Filter" VALUE="grade=7*">

Finally, lets use scripting to call up George Chiang's grade

tdcobj.Filter="name=George Chiang"
tdcobj.reset()
Copyright 1997-2014 JavaScript Kit. NO PART may be reproduced without author's permission.