How to filter a ListGrid clientside

[rkumsher]

I am trying to use the ListGrids built in filter editor to filter results in a grid that I populate using ListGrid.setRecords(ListGridRecord[] records). I am not currently using a DataSource. Below is a standalone example I would like to get working. Any help would be greatly appreciated.

SmartGWT - 2.2
Browser - FireFox

package com.example.myprject.client;

import com.google.gwt.core.client.EntryPoint;
import com.smartgwt.client.widgets.grid.ListGrid;
import com.smartgwt.client.widgets.grid.ListGridField;
import com.smartgwt.client.widgets.grid.ListGridRecord;

public class FilterGrid implements EntryPoint {
private final ListGrid gridToFilter = new ListGrid();
	public void onModuleLoad() {
		ListGridField colorField = new ListGridField("colorField", "Color");
		gridToFilter.setFields(colorField);
		gridToFilter.setShowFilterEditor(true);
		gridToFilter.setWidth100();
		gridToFilter.setHeight100();
		
		populateGrid();
		gridToFilter.draw();
	}
	
	public void populateGrid()
	{
		String[] colors = new String[] { "aqua", "black", "blue", "fuchsia",
				"gray", "green", "lime", "maroon", "navy", "olive", "purple",
				"red", "silver", "teal", "white", "yellow" };
		ListGridRecord[] records = new ListGridRecord[colors.length];
		for (int i=0; i<colors.length; i++)
		{
			ListGridRecord record = new ListGridRecord();
			record.setAttribute("colorField", colors[i]);
			records[i] = record;
		}
		gridToFilter.setRecords(records);
	}
}