1

I have a problem using ng-grid search filter on column wich references cellTemplate.

My data object has multiple fields. One of those fields is an array and I use cellTemplate to create a div with ng-repeat to show those values and apply a certain css class according values from that array.

Here is the plunkler that demonstrate my problem: plnkr.co/edit/jMvafIjqCsU0cnW6Ecvy?p=preview.

My problem is when I use cellTemplate grid propertie, the filter do not work properly. To simulate this scenario, you can try search by person2@gmail.com that you'll notice the problem. In this plunker, I use a cellTemplate to concatenate '@gmail.com' to person's email so if you type person2 the filter is applied, but after type @ you'll see that filter do not work.

Can someone help me? Thank you!

bob
  • 11
  • 3

1 Answers1

1

ng-grid does not search on the rendered cellTemplate output but on the underlying data.

So the best way would be to transform your data to have searchable values.

  angular.forEach($scope.myData, function(value) {
    value.email+='@gmail.com';
  });

Find a Plunker here

mainguy
  • 8,283
  • 2
  • 31
  • 40
  • And if i want apply a css style? For example, if the email is @gmail the output will be green, else the output will be red? This is my real problem, when I should use cellTemplate to manipulate the output because I cant neither apply a style from my controller or to show an array of values on cell. – bob Sep 30 '14 at 13:18
  • How do you detect if an email is @gmail or anywhere else? Didn't find any hoster info in your plunker example, just the names. Please complete myData in the plunker and I will show you how to write your cellTemplate. – mainguy Sep 30 '14 at 13:31
  • You´re right. I edited your plunker to show what is my problem and I want try doing. Please, see the plunker. – bob Sep 30 '14 at 14:39
  • Hello, you're still with me? Look at the updated plunker: http://plnkr.co/edit/ARlDisOS0EVHXKjQPast?p=preview – mainguy Sep 30 '14 at 14:49
  • Sorry, we are now in plunker version hell. What plunker did you update? – mainguy Sep 30 '14 at 14:51
  • You can't update my plunker because it's frozen. You can only fork it and you have to tell me the new adress. – mainguy Sep 30 '14 at 14:58
  • Sorry, I was mistaken. Here it is: http://plnkr.co/edit/GrA7VqaXRFvP2BUTrq8l?p=preview – bob Sep 30 '14 at 15:13
  • Could someone help me please? – bob Oct 01 '14 at 14:04
  • Can't reach http://angular-ui.github.io/ng-grid/ from my workplace right now. Will look into your plunker later. – mainguy Oct 01 '14 at 14:28
  • Ok. I've looking for a solution but unsuccessfully. – bob Oct 02 '14 at 09:08
  • 1
    Oh, github.io is online again! Look here at this (very hackerish) plunker. Enter values like 200 or 100 in the searchbox. Again, this is a transformation of your json to a searchable value which is the data field of the column. The celltemplate decides which class to use on the actual meassurements data. Not very stylish, but hey, it works! http://plnkr.co/edit/Iuw025179PRBzottQzet?p=preview – mainguy Oct 02 '14 at 15:10