ColumnFilter doesn't work with columns with hyperlink

[GoogleCodeExporter]

What steps will reproduce the problem?

Here is my code;

<script>

    var dataSetString = $('#hiddenData').attr('value');
    var dataSet = eval(dataSetString);

    $(document).ready(function() {

       var table = $('#example').dataTable( {

            "data": dataSet,
            "aoColumns": [
                        { "title": "Id"},
                        { "title": "Issue Date" },
                        { "title": "Expiry Date" },
                        { "title": "Area" }
            ],
            "columnDefs": [
                           //title column has hyperlinks
                           {
                               "render": function ( data, type, row ) {
                                   return '<a href="#{request.contextPath}/module/misc/module/search/titleDetails.jsf?titleId=' + data + '"><i class="fa fa-external-link"></i> ' + data + '</a>' ;
                               },
                               "targets": 0
                           }
            ],
            "order": [[ 0, "desc" ]]
        } );

        table.columnFilter({ sPlaceHolder: "head:before",
            aoColumns: [ {type: "number"},
                         {type: "number"},
                         {type: "number"},
                         {type: "number"}


                       ]

        });

    } );

</script>

What is the expected output? What do you see instead?
Hyperlink (for column Id) navigates to expected page but filter for this 
particular column (ID) doesn't work.

What version of the product are you using? On what operating system?
jquery.dataTables.columnFilter.js
* Version:     1.5.6.

Please provide any additional information below.

Original issue reported on code.google.com by [email protected] on 2 Dec 2014 at 11:44