jQuery Grid Filtering

To enable the build in filtering into the grid widget you need to set filtering.enabled options to true.
In order to pass additional options to the build in filters you need to handle the filterWidgetCreating event.
In order to add custom widget as filter widget you need to use column.customFilter and got its value into the getCustomFilterValue event.
In addition to the build in filtering you can implement search by filtering which is custom type of filtering where only one textbox can filter all columns values. This type of filtering can be seen in this demo.

    $(function () {
        $("#grid").shieldGrid({
            dataSource: {
                data: gridData,
                schema: {
                    fields: {
                        id: { type: Number },
                        name: { type: String },
                        company: { type: String },
                        phone: { type: String },
                        age: { type: Number }
                    }
                },
            },
            filtering: {
                enabled: true
            },
            paging: true,
            columns: [
                { field: "id", width: "250px", title: "ID" },
                { field: "name", title: "Person Name", width: "250px" },
                { field: "company", title: "Company" },
                { field: "phone", title: "Phone", width: "250px" },
                { field: "age", title: "Age" }
            ]
        });
    });