modify cell contents prior to filtering

modify cell contents prior to filtering

shrogeshroge Posts: 2Questions: 0Answers: 0
edited April 2009 in General
Excellent plug-in!

Is there a way to modify the cell content just prior to filtering? My table data cells have a div id along with the actual data shown and some filtering picks up the div info.

Example of a typical data cell:


Here is my displayed text on the division team.



A search on "div" or "team" will pick up every row due to the inside the . I'm looking for a way to remove all html tags inside the cell just prior to the filter search.

Thanks for the help,
Shroge

Replies

  • allanallan Posts: 54,900Questions: 1Answers: 8,605 Site admin
    Hi Shroge,

    Indeed there is - have a look at this example here: http://datatables.net/examples/example_html_sort.html

    Basically the key is to set the 'sType' to 'html' for the column where you don't want HTML tags to be filtered upon. The filtering algorithm will strip out the HTML before doing the search.

    Regards,
    Allan
  • shrogeshroge Posts: 2Questions: 0Answers: 0
    Allan,

    Thanks for the quick response. I was under the impression that sType only controlled the sorting of the data and not the search filtering. One reason that I thought this is because I created custom sorting functions for asc and desc which filters out html among other things. I've tested the custom sorting function and I get alerts whenever it sorts the table according to a column, so I know that part works. However, the custom sorting function does not fire when I do a search (fill text in the search box) to filter out the table.

    jQuery.fn.dataTableExt.oSort['comb-html-asc'] = function(x,y) {
    ...
    }
    jQuery.fn.dataTableExt.oSort['comb-html-desc'] = function(x,y) {
    ...
    }
    $("table[id^=tableid]").each(function() {
    oViewTable = $(this).dataTable({
    "aoColumns": [
    { "sType": "comb-html" },
    { "sType": "comb-html" },
    { "sType": "comb-html" },
    { "sType": "comb-html" },
    { "sType": "comb-html" },
    { "sType": "comb-html" }
    ]
    });
    });

    Is there something I'm missing that would make the custom sort function only work on column sorting and not on table searching?

    Thanks,
    Shroge
  • allanallan Posts: 54,900Questions: 1Answers: 8,605 Site admin
    Hi Shroge,

    sType also indicates to DataTables that it should to a little bit of processing on the filtering for the built-in data types (specifically the html type). Perhaps what would be best for you in this specific case (since all of your columns have "comb-html" would be for you to override the built-in html sort for DataTables and use the html type.

    [code]
    jQuery.fn.dataTableExt.oSort['html-asc'] = function(x,y) {
    ...
    }
    jQuery.fn.dataTableExt.oSort['html-desc'] = function(x,y) {
    ...
    }
    $("table[id^=tableid]").each(function() {
    oViewTable = $(this).dataTable({
    "aoColumns": [
    { "sType": "html" },
    { "sType": "html" },
    { "sType": "html" },
    { "sType": "html" },
    { "sType": "html" },
    { "sType": "html" }
    ]
    });
    });
    [/code]

    This would allow you to take advantage of the built in filtering html type, and define your own sorting for it.

    Regards,
    Allan
This discussion has been closed.