Datatables Individual Column Filtering (Select Tag) : Use Exact Match

Question

I'm using datatables 1.9.4 and the column filtering plugin. It works like a charm except that when I use 'select' tags for column filtering, the filter is not done for exact matches. It's using wildcard search, which I do not want. I thought using a select element instead of text input would solve the problem but it doesn't.

When i search for 'Semester - I', it should show only 'Semester - I' results. But it shows 'Semester - II' and 'Semester - III' matches too since the filter is not looking for exact match.

I tried jQuery DataTable ColumnFilter plugin. Can the "select" filter style support exact match? that and also http://code.google.com/p/jquery-datatables-column-filter/issues/detail?id=11 that. But none solved my problem.

JS CODE

$('#semester').dataTable({
                    "sPaginationType": "full_numbers"
                })
                .columnFilter({
                    aoColumns: [ { type: "text"},
                             { type: "text" },
                             { type: "select", values: [ 'Year - I', 'Year - II', 'Year - III', 'Semester - I', 'Semester - II', 'Semester - III', 'Semester - IV', 'Semester - V', 'Semester - VI', 'Semester - VII  ( Integrated )', 'Semester - VIII  ( Integrated )', 'Semester - IX  ( Integrated )', 'Semester - X  ( Integrated )']},
                             { type: "text" },
                             null
                        ]

                });

Are there any other alternatives? Thanks in advance

UPDATE

I also tried the below, but that didn't help too:

if (bRegex)
      oTable.fnFilter($(this).val(), iColumn, bRegex);
else
      oTable.fnFilter(unescape("^"+$(this).val()+"$"), iColumn, true);

Answer 1

Voila! Figured it out myself through a series of trial and error attempts. For those who are in a similar problem here is the solution:

In the plugin file, inside select.change(function () {}), change this:

if (bRegex)
  oTable.fnFilter($(this).val(), iColumn, bRegex);
else
  oTable.fnFilter(unescape($(this).val()), iColumn);

to

if (bRegex)
  oTable.fnFilter($(this).val(), iColumn, bRegex);
else
  oTable.fnFilter(unescape("^"+$(this).val()+"$"), iColumn, true, false);

Answer 2

multy filter in DataTable Demo

var asInitVals = new Array();

$(document).ready(function() {
    var oTable = $('#example').dataTable( {
        "oLanguage": {
            "sSearch": "Search all columns:"
        }
    } );

    $("tfoot input").keyup( function () {
        /* Filter on the column (the index) of this element */
        oTable.fnFilter( this.value, $("tfoot input").index(this) );
    } );



    /*
     * Support functions to provide a little bit of 'user friendlyness' to the textboxes in 
     * the footer
     */
    $("tfoot input").each( function (i) {
        asInitVals[i] = this.value;
    } );

    $("tfoot input").focus( function () {
        if ( this.className == "search_init" )
        {
            this.className = "";
            this.value = "";
        }
    } );

    $("tfoot input").blur( function (i) {
        if ( this.value == "" )
        {
            this.className = "search_init";
            this.value = asInitVals[$("tfoot input").index(this)];
        }
    } );
} );

Note that in the above code, the support functions are provided to ensure that the end user knows what data is being filtered upon. fnFilter() is the function of primary import here.

// after creating the table and getting the table object...

var oTable = $('#some_id').dataTable();

// ...you can use it to get a settings object...

var oSettings = oTable.fnSettings();

// ...then you can do things with the settings object

oSettings.aoPreSearchCols[ iCol ].sSearch = "^\\s*"+'1'+"\\s*$";
oSettings.aoPreSearchCols[ iCol ].bRegex = false;
oSettings.aoPreSearchCols[ iCol ].bSmart= false;

Answer 3

I used the accepted answer, however if I change the dropdown, then change it back to the default value I would get no results. My guess is it is trying to do an exact text search on "" and finding nothing. I made this modification and it appears to be working for me.

if ($(this).val() == "")
    oTable.fnFilter(unescape($(this).val()), iColumn, false, false, false, false);
else {
    if (bRegex)
       oTable.fnFilter($(this).val(), iColumn, bRegex, false, false, false); 
    else
       oTable.fnFilter(unescape("^" + $(this).val() + "$"), iColumn, true, false, false, false); 
    }