CODEWITHSUNDEEP
angularjsng-grid
Justin
Justin

Reputation: 2404

Ng-Grid Multiple Filtering in Column

Let's say I had one of many columns of data in an ng-grid like so:

Status

Open

Closed

Open

Closed

Pending

Pending

Closed

I can filter for just one, but can I have multiple filters using ng-grid? For example, filtering for 'Open' gives me back all the ones that are 'Open', but what if I wanted to get back both 'Open' and 'Closed'? So the result would be like:

Status

Open

Closed

Open

Closed

Closed

Thanks for any help!

Upvotes: 0

Views: 277

Answers (1)

mainguy
mainguy

Reputation: 8331

Asuming that you are using PHP/MySQL on your server side I would use this approach:

Enter something like Open|Closed in the filter input. (or use any separator you like)

This search string will be send to your server.

At the server explode() this search string into an array.

$search=explode("|",$searchstring);

Then generate a sql query from that array.

Example code:

//The searchstring that was send via ajax
$searchstring="Open|Closed";
//The field in the DB you want to filter
$field="status";

//Generate the where condition
$search=explode("|",$searchstring);
$whereCond="";
while (list($key, $val) = each($search)) {
    $whereCond.= "`".$field."` ='".$val."' OR " ;
}
//remove the last unnecessary OR
$whereCond = substr_replace( $whereCond, "", -3 );

//Generate the query
$query="SELECT * FROM `table` WHERE ( ".$whereCond." )";
//Fetch data from the DB and return it to your App

This should generate a query like:

SELECT * FROM `table` WHERE ( `status` ='Open' OR `status` ='Closed' )

This way you can enter as many OR conditions as you want.

Watch out for the proper amount of spaces and use the correct quotes for the query.

In case you are using another stack, you have to figure out your own query generator. But basically it comes down to this approach. If you are using server sided data you have to do the filtering on the server side.

A client sided example can be found on the official ng-grid site here.

The Server-Side Paging Example is in fact client sided, it just fetches a large json file from the server.

Upvotes: 1

Related Questions