Start Building Professional
Web Apps Today

Custom Filters

I have a column that has data in multiple lines like:

row1 might have
value 1
value 2

row2 might have
value 1
value 3

I would like the combobox to show
value 1
value 2
value 3

instead, of course, it shows
value 1
value 2
value 1
value 3

And then of course when the filter is run it checks to see if the value is anywhere in the cell (I think it already sort of does this right?) Whats the best way to make this happen. Is there a way to create my own excell that will return multiple values or will I have to create a custom filter header and custom filter function? If so can you please explain the steps.

The solution depends on how you want to show both values in cell, if showing comma separated list of both values works for you , then only custom filtering need to be applied

xml
<rows>
    <row id="1"><cell>value1,value2</cell></row>
    <row id="2"><cell>value1,value3</cell></row>
</rows>

js code
...
grid.attachHeader("<select onchage="myfilter(this.value)"><option value="value1">value1<option value="value2">value2<option value="value3">value3</select>")
function myfilter(value){

   grid.filterBy(0,function(cell){
         var data=cell.split(",");
         if (data[0]==value || data[1]==value) return true;
         return false;
  });

}
...

Thank you that will work. How do I get the select to look like the default select_filters. I have done style='width:90%;height:13px;' but it seems that the margins or something are slightly different for the built in filters. Is there a css class or something I can do to make them look like the other default filters?

Build in filters attach "filter" css class to surrounding css, it can be mimicked through second parameter of attachHeader as 

mygrid.attachHeader("A,<select style='width:90%; font-size:8pt; font-family:Tahoma;'>",["","padding-left:0px; text-align:center;"]);